/* /Components/Layout/MainLayout.razor.rz.scp.css */
.municipal-layout-root[b-g2onrq2ot2] {
    --sidebar-auto-width: 336px;
    --sidebar-duration: 320ms;
    --sidebar-easing: cubic-bezier(.22, .8, .22, 1);
    --topbar-height: 72px;
    --appbar-current-height: var(--topbar-height);

    --emerald: var(--theme-primary);
    --emerald-dark: var(--theme-dark);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: #71827c;
    --theme-primary: #0a6a50;
    --theme-dark: #043d2f;
    --theme-light: #24b887;
    --theme-accent: #c6a15b;
    --theme-ink: #17372e;
    --theme-muted: #71827c;
    --theme-border: #dce9e4;
    --theme-bg: #f2f7f4;
    --theme-primary-rgb: 10, 106, 80;
    --theme-dark-rgb: 4, 61, 47;
    --theme-light-rgb: 36, 184, 135;
    --theme-accent-rgb: 198, 161, 91;
    --theme-shadow-rgb: var(--theme-dark-rgb);
    --mud-palette-primary: var(--theme-primary);
    --mud-palette-primary-rgb: var(--theme-primary-rgb);
    --mud-palette-secondary: var(--theme-accent);
    --mud-palette-secondary-rgb: var(--theme-accent-rgb);
    --mud-palette-tertiary: var(--theme-light);
    --mud-palette-tertiary-rgb: var(--theme-light-rgb);
    --mud-palette-appbar-background: var(--theme-dark);
    --mud-palette-drawer-background: #ffffff;
    --mud-palette-background: var(--theme-bg);
    --mud-palette-text-primary: var(--theme-ink);
    --mud-palette-text-secondary: var(--theme-muted);
    --mud-palette-lines-default: var(--theme-border);

    position: relative;

    display: grid;
    grid-template-columns:
        var(--sidebar-auto-width)
        minmax(0, 1fr);
    grid-template-rows:
        var(--appbar-current-height)
        minmax(calc(100vh - var(--appbar-current-height)), auto)
        auto;

    width: 100%;
    min-height: 100vh;
    overflow-x: clip;

    color: var(--ink);

    background:
        radial-gradient(
            circle at 4% 0%,
            rgba(var(--theme-accent-rgb), .10),
            transparent 26rem
        ),
        radial-gradient(
            circle at 100% 5%,
            rgba(var(--theme-primary-rgb), .08),
            transparent 30rem
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            var(--theme-bg) 100%
        );

    font-family: 'Kanit', sans-serif;

    transition:
        grid-template-columns
        var(--sidebar-duration)
        var(--sidebar-easing);
}

.auth-only-layout[b-g2onrq2ot2] {
    grid-column: 1;
    grid-row: 2;
    min-height: calc(100vh - var(--appbar-current-height));
    background: #f2f7f4;
}

.public-auth-layout[b-g2onrq2ot2] {
    --topbar-height: 0px;
    --appbar-current-height: 0px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows:
        var(--appbar-current-height)
        minmax(calc(100vh - var(--appbar-current-height)), auto);
}

.public-auth-layout .municipal-topbar[b-g2onrq2ot2] {
    display: none;
    grid-column: 1;
}

.municipal-layout-root.theme-blue[b-g2onrq2ot2] {
    --theme-primary: #2563eb;
    --theme-dark: #1e3a8a;
    --theme-light: #60a5fa;
    --theme-accent: #f59e0b;
    --theme-ink: #172554;
    --theme-muted: #64748b;
    --theme-border: #dbe5f6;
    --theme-bg: #f4f7fc;
    --theme-primary-rgb: 37, 99, 235;
    --theme-dark-rgb: 30, 58, 138;
    --theme-light-rgb: 96, 165, 250;
    --theme-accent-rgb: 245, 158, 11;
}

.municipal-layout-root.theme-cyan[b-g2onrq2ot2] {
    --theme-primary: #0891b2;
    --theme-dark: #164e63;
    --theme-light: #22d3ee;
    --theme-accent: #f59e0b;
    --theme-ink: #12343d;
    --theme-muted: #61777f;
    --theme-border: #d7ebf0;
    --theme-bg: #f2f9fb;
    --theme-primary-rgb: 8, 145, 178;
    --theme-dark-rgb: 22, 78, 99;
    --theme-light-rgb: 34, 211, 238;
    --theme-accent-rgb: 245, 158, 11;
}

.municipal-layout-root.theme-teal[b-g2onrq2ot2] {
    --theme-primary: #0f766e;
    --theme-dark: #134e4a;
    --theme-light: #2dd4bf;
    --theme-accent: #d4a017;
    --theme-ink: #133c38;
    --theme-muted: #657c78;
    --theme-border: #d8e9e7;
    --theme-bg: #f3faf8;
    --theme-primary-rgb: 15, 118, 110;
    --theme-dark-rgb: 19, 78, 74;
    --theme-light-rgb: 45, 212, 191;
    --theme-accent-rgb: 212, 160, 23;
}

.municipal-layout-root.theme-green[b-g2onrq2ot2] {
    --theme-primary: #16a34a;
    --theme-dark: #166534;
    --theme-light: #4ade80;
    --theme-accent: #eab308;
    --theme-ink: #153823;
    --theme-muted: #66786d;
    --theme-border: #d9e9dd;
    --theme-bg: #f4faf5;
    --theme-primary-rgb: 22, 163, 74;
    --theme-dark-rgb: 22, 101, 52;
    --theme-light-rgb: 74, 222, 128;
    --theme-accent-rgb: 234, 179, 8;
}

.municipal-layout-root.theme-lime[b-g2onrq2ot2] {
    --theme-primary: #65a30d;
    --theme-dark: #365314;
    --theme-light: #a3e635;
    --theme-accent: #0ea5e9;
    --theme-ink: #263514;
    --theme-muted: #737d63;
    --theme-border: #e1ead2;
    --theme-bg: #f8fbf1;
    --theme-primary-rgb: 101, 163, 13;
    --theme-dark-rgb: 54, 83, 20;
    --theme-light-rgb: 163, 230, 53;
    --theme-accent-rgb: 14, 165, 233;
}

.municipal-layout-root.theme-amber[b-g2onrq2ot2] {
    --theme-primary: #d97706;
    --theme-dark: #92400e;
    --theme-light: #fbbf24;
    --theme-accent: #0f766e;
    --theme-ink: #3b2a0d;
    --theme-muted: #7b715f;
    --theme-border: #eadfc9;
    --theme-bg: #fbf7ef;
    --theme-primary-rgb: 217, 119, 6;
    --theme-dark-rgb: 146, 64, 14;
    --theme-light-rgb: 251, 191, 36;
    --theme-accent-rgb: 15, 118, 110;
}

.municipal-layout-root.theme-orange[b-g2onrq2ot2] {
    --theme-primary: #ea580c;
    --theme-dark: #9a3412;
    --theme-light: #fb923c;
    --theme-accent: #2563eb;
    --theme-ink: #3d2115;
    --theme-muted: #7d6f68;
    --theme-border: #ecd9cf;
    --theme-bg: #fbf5f1;
    --theme-primary-rgb: 234, 88, 12;
    --theme-dark-rgb: 154, 52, 18;
    --theme-light-rgb: 251, 146, 60;
    --theme-accent-rgb: 37, 99, 235;
}

.municipal-layout-root.theme-rose[b-g2onrq2ot2] {
    --theme-primary: #e11d48;
    --theme-dark: #9f1239;
    --theme-light: #fb7185;
    --theme-accent: #0ea5e9;
    --theme-ink: #401923;
    --theme-muted: #7e6870;
    --theme-border: #efd7dd;
    --theme-bg: #fcf3f5;
    --theme-primary-rgb: 225, 29, 72;
    --theme-dark-rgb: 159, 18, 57;
    --theme-light-rgb: 251, 113, 133;
    --theme-accent-rgb: 14, 165, 233;
}

.municipal-layout-root.theme-purple[b-g2onrq2ot2] {
    --theme-primary: #7c3aed;
    --theme-dark: #4c1d95;
    --theme-light: #a78bfa;
    --theme-accent: #f59e0b;
    --theme-ink: #281c45;
    --theme-muted: #71687f;
    --theme-border: #e2dcf1;
    --theme-bg: #f7f4fc;
    --theme-primary-rgb: 124, 58, 237;
    --theme-dark-rgb: 76, 29, 149;
    --theme-light-rgb: 167, 139, 250;
    --theme-accent-rgb: 245, 158, 11;
}

.municipal-layout-root.theme-indigo[b-g2onrq2ot2] {
    --theme-primary: #4f46e5;
    --theme-dark: #312e81;
    --theme-light: #818cf8;
    --theme-accent: #f59e0b;
    --theme-ink: #1e1b4b;
    --theme-muted: #6a6b80;
    --theme-border: #dedff2;
    --theme-bg: #f5f6fc;
    --theme-primary-rgb: 79, 70, 229;
    --theme-dark-rgb: 49, 46, 129;
    --theme-light-rgb: 129, 140, 248;
    --theme-accent-rgb: 245, 158, 11;
}

.municipal-layout-root.theme-slate[b-g2onrq2ot2] {
    --theme-primary: #475569;
    --theme-dark: #1e293b;
    --theme-light: #94a3b8;
    --theme-accent: #d4a017;
    --theme-ink: #1f2933;
    --theme-muted: #6b7280;
    --theme-border: #dde3ea;
    --theme-bg: #f4f6f8;
    --theme-primary-rgb: 71, 85, 105;
    --theme-dark-rgb: 30, 41, 59;
    --theme-light-rgb: 148, 163, 184;
    --theme-accent-rgb: 212, 160, 23;
}

.municipal-layout-root.sidebar-collapsed[b-g2onrq2ot2] {
    grid-template-columns:
        0
        minmax(0, 1fr);
}


/*
   ซ่อนเฉพาะ Appbar Top
   Hero, Sidebar, Main Content และ Footer ไม่ถูกซ่อน
*/
.municipal-layout-root.appbar-hidden[b-g2onrq2ot2] {
    --appbar-current-height: 0px;
}

/* =========================================================
   APPBAR
   เลื่อนขึ้น = ซ่อน
   เลื่อนลง = แสดง
   ========================================================= */
.municipal-topbar[b-g2onrq2ot2] {
    position: sticky;
    top: 0;
    z-index: 200;

    grid-column: 1 / -1;
    grid-row: 1;

    display: flex;
    width: 100%;
    height: var(--topbar-height);
    min-height: var(--topbar-height);
    min-width: 0;

    align-items: center;
    justify-content: space-between;
    gap: 22px;

    padding: 10px 26px;

    overflow: hidden;

    border-bottom: 1px solid rgba(var(--theme-primary-rgb), .12);

    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .99),
            rgba(245, 250, 247, .97)
        );

    box-shadow:
        0 9px 28px rgba(var(--theme-dark-rgb), .08);

    opacity: 1;
    transform: translateY(0);

    backdrop-filter: blur(14px);

    transition:
        height 260ms var(--sidebar-easing),
        min-height 260ms var(--sidebar-easing),
        padding 260ms var(--sidebar-easing),
        border-color 220ms ease,
        box-shadow 220ms ease,
        opacity 190ms ease,
        transform 260ms var(--sidebar-easing);
}

/*
   ซ่อนเฉพาะแถบ Appbar Top
   Grid row ด้านบนจะลดเป็น 0 ผ่าน --appbar-current-height
*/
.municipal-layout-root.appbar-hidden .municipal-topbar[b-g2onrq2ot2] {
    border-bottom-color: transparent;
    box-shadow: none;

    opacity: 0;
    pointer-events: none;

    transform: translateY(-100%);
}

.topbar-left[b-g2onrq2ot2],
.topbar-right[b-g2onrq2ot2],
.system-online[b-g2onrq2ot2],
.topbar-date[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
}

.topbar-left[b-g2onrq2ot2] {
    min-width: 0;
    gap: 12px;
}

.topbar-icon[b-g2onrq2ot2] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 1px solid rgba(var(--theme-accent-rgb), .28);
    border-radius: 14px;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        );

    box-shadow:
        0 9px 20px rgba(var(--theme-dark-rgb), .20);
}

.topbar-copy[b-g2onrq2ot2] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.topbar-copy strong[b-g2onrq2ot2] {
    overflow: hidden;

    color: var(--theme-ink);
    font-size: .96rem;
    font-weight: 700;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.topbar-copy span[b-g2onrq2ot2] {
    margin-top: 1px;

    color: #8a9a94;
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .08em;
}

.topbar-right[b-g2onrq2ot2] {
    flex: 0 0 auto;
    gap: 16px;
}

.system-online[b-g2onrq2ot2] {
    gap: 10px;
}

.online-dot[b-g2onrq2ot2] {
    width: 9px;
    height: 9px;

    border-radius: 50%;
    background: #2bc481;

    box-shadow:
        0 0 0 5px rgba(43, 196, 129, .13);
}

.system-online > div[b-g2onrq2ot2] {
    display: flex;
    flex-direction: column;
}

.system-online strong[b-g2onrq2ot2] {
    color: var(--theme-primary);
    font-size: .73rem;
    font-weight: 650;
}

.system-online small[b-g2onrq2ot2] {
    color: #8a9994;
    font-size: .60rem;
}

.topbar-separator[b-g2onrq2ot2] {
    width: 1px;
    height: 28px;

    background:
        rgba(var(--theme-primary-rgb), .12);
}

.topbar-date[b-g2onrq2ot2] {
    gap: 7px;

    color: #51665f;
    font-size: .73rem;
    font-weight: 550;
}

.theme-picker-button[b-g2onrq2ot2] {
    position: relative;
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(var(--theme-primary-rgb), .14);
    border-radius: 13px;
    color: var(--theme-primary);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .98),
            color-mix(in srgb, var(--theme-light) 10%, white)
        );
    box-shadow:
        0 8px 20px rgba(var(--theme-dark-rgb), .07),
        inset 0 1px 0 rgba(255, 255, 255, .88);
    cursor: pointer;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.theme-picker-button:hover[b-g2onrq2ot2] {
    border-color: rgba(var(--theme-primary-rgb), .28);
    box-shadow:
        0 12px 24px rgba(var(--theme-dark-rgb), .12),
        inset 0 1px 0 #ffffff;
    transform: translateY(-1px);
}

.theme-picker-swatch[b-g2onrq2ot2] {
    position: absolute;
    right: 7px;
    bottom: 7px;
    width: 11px;
    height: 11px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .16);
}

.theme-picker-panel[b-g2onrq2ot2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(118px, 1fr));
    gap: 6px;
    padding: 8px;
}

.theme-option[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 6px 8px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #334155;
    background: transparent;
    font-family: 'Kanit', sans-serif;
    font-size: .68rem;
    text-align: left;
    cursor: pointer;
    transition:
        background .16s ease,
        border-color .16s ease,
        transform .16s ease;
}

.theme-option:hover[b-g2onrq2ot2],
.theme-option.selected[b-g2onrq2ot2] {
    border-color: rgba(var(--theme-primary-rgb), .18);
    background: color-mix(in srgb, var(--theme-light) 11%, white);
}

.theme-option:hover[b-g2onrq2ot2] {
    transform: translateY(-1px);
}

.theme-option span[b-g2onrq2ot2] {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    border: 2px solid rgba(255, 255, 255, .95);
    border-radius: 50%;
    box-shadow:
        0 0 0 1px rgba(15, 23, 42, .10),
        0 4px 10px rgba(15, 23, 42, .14);
}

.theme-option strong[b-g2onrq2ot2] {
    overflow: hidden;
    min-width: 0;
    font-size: .68rem;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* =========================================================
   LOGIN / LOGOUT / PROFILE
   ========================================================= */
.topbar-auth[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.topbar-authenticated[b-g2onrq2ot2] {
    min-width: 0;
}

.topbar-profile-card[b-g2onrq2ot2] {
    display: flex;
    min-width: 0;
    min-height: 48px;

    align-items: center;
    gap: 9px;

    padding: 4px 10px 4px 4px;

    border:
        1px solid rgba(var(--theme-primary-rgb), .12);

    border-radius: 999px;

    color: #24473b;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .96),
            rgba(243, 249, 246, .94)
        );

    text-decoration: none;

    box-shadow:
        0 7px 20px rgba(var(--theme-dark-rgb), .06),
        inset 0 1px 0 rgba(255, 255, 255, .92);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.topbar-profile-card:hover[b-g2onrq2ot2] {
    color: var(--theme-primary);

    border-color:
        rgba(var(--theme-primary-rgb), .23);

    box-shadow:
        0 11px 26px rgba(var(--theme-dark-rgb), .10),
        inset 0 1px 0 rgba(255, 255, 255, .96);

    transform: translateY(-1px);
}

.topbar-avatar[b-g2onrq2ot2] {
    position: relative;

    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;
    overflow: hidden;

    border:
        2px solid rgba(var(--theme-accent-rgb), .70);

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        );

    box-shadow:
        0 7px 16px rgba(var(--theme-dark-rgb), .20),
        0 0 0 3px rgba(var(--theme-accent-rgb), .09);
}

.topbar-avatar[b-g2onrq2ot2]::after {
    content: "";

    position: absolute;
    inset: 0;

    border-radius: 50%;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .24);

    pointer-events: none;
}

.topbar-avatar img[b-g2onrq2ot2] {
    display: block;

    width: 100%;
    height: 100%;

    border-radius: 50%;

    object-fit: cover;
    object-position: center;
}

.topbar-user-copy[b-g2onrq2ot2] {
    display: flex;
    min-width: 0;
    max-width: 150px;
    flex-direction: column;
}

.topbar-user-copy strong[b-g2onrq2ot2],
.topbar-user-copy small[b-g2onrq2ot2] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.topbar-user-copy strong[b-g2onrq2ot2] {
    color: #23483b;
    font-size: .68rem;
    font-weight: 700;
}

.topbar-user-copy small[b-g2onrq2ot2] {
    margin-top: 1px;

    color: #8a9993;
    font-size: .55rem;
}

.topbar-login-button[b-g2onrq2ot2],
.topbar-logout-button[b-g2onrq2ot2] {
    display: inline-flex;
    min-height: 42px;

    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 0 13px;

    border-radius: 13px;

    font-family: 'Kanit', sans-serif;
    font-size: .67rem;
    font-weight: 600;
    text-decoration: none;

    cursor: pointer;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.topbar-login-button[b-g2onrq2ot2] {
    border:
        1px solid rgba(var(--theme-accent-rgb), .42);

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        );

    box-shadow:
        0 9px 20px rgba(var(--theme-dark-rgb), .20),
        inset 0 1px 0 rgba(255, 255, 255, .13);
}

.topbar-login-button:hover[b-g2onrq2ot2] {
    color: #ffffff;

    transform: translateY(-1px);

    box-shadow:
        0 12px 25px rgba(var(--theme-dark-rgb), .27),
        inset 0 1px 0 rgba(255, 255, 255, .17);
}

.topbar-logout-form[b-g2onrq2ot2] {
    display: flex;
    margin: 0;
}

.topbar-logout-button[b-g2onrq2ot2] {
    border:
        1px solid rgba(174, 65, 55, .15);

    color: #a8443c;
    background:
        linear-gradient(
            145deg,
            #fff9f8,
            #fcedeb
        );

    box-shadow:
        0 7px 18px rgba(151, 55, 48, .06);
}

.topbar-logout-button:hover[b-g2onrq2ot2] {
    border-color:
        rgba(174, 65, 55, .28);

    transform: translateY(-1px);

    box-shadow:
        0 10px 22px rgba(151, 55, 48, .11);
}

/* =========================================================
   SIDEBAR
   ========================================================= */
.municipal-sidebar[b-g2onrq2ot2] {
    position: sticky;
    top: 0;
    z-index: 100;

    grid-column: 1;
    grid-row: 2 / 4;

    width: var(--sidebar-auto-width);
    min-width: var(--sidebar-auto-width);
    height: calc(100vh - var(--appbar-current-height));

    overflow: visible;

    transition:
        top 260ms var(--sidebar-easing),
        height 260ms var(--sidebar-easing);
}

.sidebar-surface[b-g2onrq2ot2] {
    width: var(--sidebar-auto-width);
    min-width: var(--sidebar-auto-width);
    height: 100%;

    overflow: hidden;

    background: #ffffff;

    border-right:
        1px solid rgba(var(--theme-primary-rgb), .12);

    box-shadow:
        14px 0 38px rgba(var(--theme-dark-rgb), .08);

    opacity: 1;
    transform: translateX(0);

    will-change: transform, opacity;

    transition:
        transform var(--sidebar-duration) var(--sidebar-easing),
        opacity 190ms ease;
}

.sidebar-collapsed .municipal-sidebar[b-g2onrq2ot2] {
    width: 0;
    min-width: 0;
}

.sidebar-collapsed .sidebar-surface[b-g2onrq2ot2] {
    opacity: 0;
    pointer-events: none;

    transform:
        translateX(calc(-100% - 16px));
}

/* =========================================================
   ปุ่มลูกศร
   ========================================================= */
.sidebar-arrow-button[b-g2onrq2ot2] {
    position: absolute;
    top: 16px;
    right: -21px;
    z-index: 140;

    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    padding: 0;

    border:
        1px solid rgba(var(--theme-accent-rgb), .46);

    border-radius: 14px;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary) 0%,
            var(--theme-dark) 100%
        );

    box-shadow:
        0 12px 28px rgba(var(--theme-dark-rgb), .28),
        inset 0 1px 0 rgba(255, 255, 255, .15);

    cursor: pointer;

    transition:
        right var(--sidebar-duration) var(--sidebar-easing),
        transform .18s ease,
        box-shadow .18s ease;
}

.sidebar-arrow-button:hover[b-g2onrq2ot2] {
    transform:
        translateY(-1px)
        scale(1.05);

    box-shadow:
        0 15px 32px rgba(var(--theme-dark-rgb), .34),
        inset 0 1px 0 rgba(255, 255, 255, .19);
}

.sidebar-arrow-button:focus-visible[b-g2onrq2ot2] {
    outline:
        3px solid rgba(18, 146, 103, .22);

    outline-offset: 3px;
}

.sidebar-collapsed .sidebar-arrow-button[b-g2onrq2ot2] {
    right: -51px;
}

/* =========================================================
   MAIN CONTENT
   ========================================================= */
.municipal-main-content[b-g2onrq2ot2] {
    grid-column: 2;
    grid-row: 2;

    width: 100%;
    min-width: 0;
    min-height:
        calc(100vh - var(--appbar-current-height));

    overflow-x: hidden;
}

.municipal-page-content[b-g2onrq2ot2] {
    width: 100%;
    min-width: 0;
    padding: 0;
}

/* =========================================================
   FOOTER
   ========================================================= */
.municipal-footer[b-g2onrq2ot2] {
    position: relative;
    grid-column: 2;
    grid-row: 3;

    min-width: 0;
    overflow: hidden;

    color: rgba(255, 255, 255, .82);

    background:
        linear-gradient(
            135deg,
            var(--theme-primary) 0%,
            var(--theme-dark) 58%,
            color-mix(in srgb, var(--theme-dark) 82%, black) 100%
        );

    border-top:
        1px solid rgba(var(--theme-accent-rgb), .28);

    box-shadow:
        0 -14px 38px rgba(3, 36, 29, .11);
}

.footer-glow[b-g2onrq2ot2] {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(4px);
}

.footer-glow-left[b-g2onrq2ot2] {
    left: -170px;
    bottom: -210px;

    width: 430px;
    height: 430px;

    background:
        radial-gradient(
            circle,
            rgba(var(--theme-accent-rgb), .15),
            transparent 68%
        );
}

.footer-glow-right[b-g2onrq2ot2] {
    top: -190px;
    right: -140px;

    width: 430px;
    height: 430px;

    background:
        radial-gradient(
            circle,
            rgba(32, 155, 116, .15),
            transparent 68%
        );
}

.footer-main[b-g2onrq2ot2] {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(260px, 1.4fr)
        minmax(170px, .8fr)
        minmax(180px, .9fr)
        minmax(210px, .9fr);

    gap: 36px;

    padding:
        42px clamp(24px, 4vw, 58px) 34px;
}

.footer-brand-section[b-g2onrq2ot2] {
    min-width: 0;
}

.footer-brand[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 13px;
}

.footer-brand-icon[b-g2onrq2ot2] {
    display: grid;
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    place-items: center;

    border:
        1px solid rgba(var(--theme-accent-rgb), .34);

    border-radius: 16px;

    color: #f4d99d;

    background:
        linear-gradient(
            145deg,
            rgba(var(--theme-primary-rgb), .96),
            rgba(var(--theme-dark-rgb), .96)
        );

    box-shadow:
        0 12px 28px rgba(0, 0, 0, .18),
        inset 0 1px 0 rgba(255, 255, 255, .12);
}

.footer-brand-copy[b-g2onrq2ot2] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.footer-brand-copy strong[b-g2onrq2ot2] {
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
}

.footer-brand-copy span[b-g2onrq2ot2] {
    margin-top: 2px;

    color: rgba(255, 255, 255, .55);
    font-size: .69rem;
}

.footer-description[b-g2onrq2ot2] {
    max-width: 460px;

    margin: 18px 0 20px;

    color: rgba(255, 255, 255, .63);
    font-size: .74rem;
    line-height: 1.8;
}

.footer-status-card[b-g2onrq2ot2] {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    padding: 10px 14px;

    border:
        1px solid rgba(63, 206, 151, .16);

    border-radius: 14px;

    background:
        rgba(255, 255, 255, .055);

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .04);
}

.footer-status-dot[b-g2onrq2ot2] {
    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: #35d58e;

    box-shadow:
        0 0 0 5px rgba(53, 213, 142, .12);
}

.footer-status-card > div[b-g2onrq2ot2] {
    display: flex;
    flex-direction: column;
}

.footer-status-card strong[b-g2onrq2ot2] {
    color: #d8fff0;
    font-size: .70rem;
    font-weight: 600;
}

.footer-status-card small[b-g2onrq2ot2] {
    margin-top: 1px;

    color: rgba(255, 255, 255, .48);
    font-size: .59rem;
}

.footer-link-section h3[b-g2onrq2ot2],
.footer-system-section h3[b-g2onrq2ot2] {
    position: relative;

    margin: 2px 0 16px;
    padding-bottom: 11px;

    color: #f1d89f;
    font-size: .78rem;
    font-weight: 650;
}

.footer-link-section h3[b-g2onrq2ot2]::after,
.footer-system-section h3[b-g2onrq2ot2]::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 34px;
    height: 2px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            var(--theme-accent),
            rgba(var(--theme-accent-rgb), .10)
        );
}

.footer-links[b-g2onrq2ot2] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer-links a[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 9px;

    min-height: 31px;

    color: rgba(255, 255, 255, .62);
    font-size: .69rem;
    text-decoration: none;

    transition:
        color .17s ease,
        transform .17s ease;
}

.footer-links a:hover[b-g2onrq2ot2] {
    color: #ffffff;
    transform: translateX(4px);
}

.footer-links a[b-g2onrq2ot2]  .mud-icon-root {
    color: color-mix(in srgb, var(--theme-accent) 82%, white);
}

.footer-system-list[b-g2onrq2ot2] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer-system-row[b-g2onrq2ot2] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 8px 10px;

    border:
        1px solid rgba(255, 255, 255, .07);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, .035);
}

.footer-system-row span[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 7px;

    color: rgba(255, 255, 255, .57);
    font-size: .65rem;
}

.footer-system-row span[b-g2onrq2ot2]  .mud-icon-root {
    color: color-mix(in srgb, var(--theme-accent) 80%, white);
}

.footer-system-row strong[b-g2onrq2ot2] {
    color: #c8f6e4;
    font-size: .62rem;
    font-weight: 600;
}

.footer-bottom[b-g2onrq2ot2] {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;

    align-items: center;
    gap: 24px;

    min-height: 66px;

    padding:
        12px clamp(24px, 4vw, 58px);

    border-top:
        1px solid rgba(255, 255, 255, .07);

    background:
        rgba(0, 0, 0, .10);
}

.footer-copyright[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 7px;

    color: rgba(255, 255, 255, .47);
    font-size: .63rem;
}

.footer-legal-links[b-g2onrq2ot2] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-legal-links a[b-g2onrq2ot2] {
    color: rgba(255, 255, 255, .48);
    font-size: .62rem;
    text-decoration: none;

    transition: color .17s ease;
}

.footer-legal-links a:hover[b-g2onrq2ot2] {
    color: #f1d89f;
}

.footer-legal-links > span[b-g2onrq2ot2] {
    width: 3px;
    height: 3px;

    border-radius: 50%;

    background:
        rgba(255, 255, 255, .22);
}

.footer-back-to-top[b-g2onrq2ot2] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    padding: 0;

    border:
        1px solid rgba(var(--theme-accent-rgb), .30);

    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-accent) 78%, white);

    background:
        linear-gradient(
            145deg,
            rgba(var(--theme-primary-rgb), .95),
            rgba(var(--theme-dark-rgb), .95)
        );

    box-shadow:
        0 9px 22px rgba(0, 0, 0, .18);

    opacity: .50;
    cursor: pointer;

    transform: translateY(4px);

    transition:
        opacity .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.show-back-to-top .footer-back-to-top[b-g2onrq2ot2],
.footer-back-to-top:hover[b-g2onrq2ot2] {
    opacity: 1;
    transform: translateY(0);

    box-shadow:
        0 12px 26px rgba(0, 0, 0, .23);
}

/* =========================================================
   MOBILE BACKDROP
   ========================================================= */
.sidebar-mobile-backdrop[b-g2onrq2ot2] {
    display: none;
}

@media (max-width: 1360px) {
    .system-online[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-user-copy[b-g2onrq2ot2] {
        max-width: 115px;
    }
}

@media (max-width: 1080px) {
    .topbar-date[b-g2onrq2ot2],
    .topbar-separator:not(.auth-separator)[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-user-copy[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-profile-card[b-g2onrq2ot2] {
        min-height: 44px;
        padding: 2px;
        border: 0;
        background: transparent;
        box-shadow: none;
    }
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 1100px) {
    .footer-main[b-g2onrq2ot2] {
        grid-template-columns:
            minmax(260px, 1.2fr)
            repeat(2, minmax(170px, .8fr));
    }

    .footer-system-section[b-g2onrq2ot2] {
        grid-column: 1 / -1;
    }

    .footer-system-list[b-g2onrq2ot2] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 820px) {
    .municipal-layout-root[b-g2onrq2ot2],
    .municipal-layout-root.sidebar-collapsed[b-g2onrq2ot2] {
        grid-template-columns:
            minmax(0, 1fr);

        --topbar-height: 68px;

        grid-template-rows:
            var(--appbar-current-height)
            minmax(calc(100dvh - var(--appbar-current-height)), auto)
            auto;
    }

    .municipal-topbar[b-g2onrq2ot2] {
        grid-column: 1;
        grid-row: 1;

        height: 68px;
        min-height: 68px;

        padding: 9px 14px;
    }

    .topbar-copy strong[b-g2onrq2ot2] {
        font-size: .86rem;
    }

    .topbar-copy span[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-right[b-g2onrq2ot2] {
        display: flex;
        gap: 7px;
    }

    .system-online[b-g2onrq2ot2],
    .topbar-date[b-g2onrq2ot2],
    .topbar-separator[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-auth[b-g2onrq2ot2] {
        gap: 6px;
    }

    .topbar-profile-card[b-g2onrq2ot2] {
        min-height: 40px;
        padding: 0;
    }

    .topbar-avatar[b-g2onrq2ot2] {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
    }

    .topbar-user-copy[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-login-button[b-g2onrq2ot2],
    .topbar-logout-button[b-g2onrq2ot2] {
        min-width: 40px;
        min-height: 40px;
        padding: 0 10px;
    }

    .topbar-logout-button span[b-g2onrq2ot2] {
        display: none;
    }

    .municipal-sidebar[b-g2onrq2ot2] {
        position: fixed;

        top: var(--appbar-current-height);
        bottom: 0;
        left: 0;

        z-index: 150;

        grid-column: auto;
        grid-row: auto;

        width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            );

        min-width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            );

        height:
            calc(100dvh - var(--appbar-current-height));
    }

    .sidebar-surface[b-g2onrq2ot2] {
        width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            );

        min-width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            );
    }

    .sidebar-collapsed .municipal-sidebar[b-g2onrq2ot2] {
        width: 0;
        min-width: 0;
    }

    .sidebar-arrow-button[b-g2onrq2ot2] {
        top: 14px;
    }

    .sidebar-collapsed .sidebar-arrow-button[b-g2onrq2ot2] {
        right: -51px;
    }

    .municipal-main-content[b-g2onrq2ot2] {
        grid-column: 1;
        grid-row: 2;

        min-height:
            calc(100dvh - var(--appbar-current-height));
    }

    .municipal-footer[b-g2onrq2ot2] {
        grid-column: 1;
        grid-row: 3;
    }

    .sidebar-mobile-backdrop[b-g2onrq2ot2] {
        position: fixed;

        inset: var(--appbar-current-height) 0 0 0;

        z-index: 140;

        display: block;
        padding: 0;
        border: 0;

        background:
            rgba(5, 25, 18, .42);

        backdrop-filter:
            blur(3px);

        cursor: pointer;
    }

    .footer-main[b-g2onrq2ot2] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 28px;

        padding:
            34px 24px 28px;
    }

    .footer-brand-section[b-g2onrq2ot2],
    .footer-system-section[b-g2onrq2ot2] {
        grid-column: 1 / -1;
    }

    .footer-bottom[b-g2onrq2ot2] {
        grid-template-columns:
            minmax(0, 1fr)
            auto;

        gap: 15px;

        padding:
            14px 24px;
    }

    .footer-legal-links[b-g2onrq2ot2] {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .footer-back-to-top[b-g2onrq2ot2] {
        grid-column: 2;
        grid-row: 1;
    }
}

@media (max-width: 620px) {
    .municipal-topbar[b-g2onrq2ot2] {
        gap: 8px;
        padding-right: 9px;
    }

    .topbar-icon[b-g2onrq2ot2] {
        display: none;
    }

    .topbar-copy strong[b-g2onrq2ot2] {
        max-width: 165px;
        font-size: .75rem;
    }

    .topbar-login-button span[b-g2onrq2ot2] {
        display: none;
    }

    .theme-picker-button[b-g2onrq2ot2] {
        width: 38px;
        height: 38px;
    }

    .theme-picker-panel[b-g2onrq2ot2] {
        grid-template-columns: minmax(126px, 1fr);
    }

    .topbar-login-button[b-g2onrq2ot2],
    .topbar-logout-button[b-g2onrq2ot2] {
        width: 38px;
        min-width: 38px;
        padding: 0;
    }
}

@media (max-width: 560px) {
    .footer-main[b-g2onrq2ot2] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .footer-brand-section[b-g2onrq2ot2],
    .footer-system-section[b-g2onrq2ot2] {
        grid-column: auto;
    }

    .footer-system-list[b-g2onrq2ot2] {
        display: flex;
    }

    .footer-description[b-g2onrq2ot2] {
        font-size: .70rem;
    }

    .footer-bottom[b-g2onrq2ot2] {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
    }

    .footer-legal-links[b-g2onrq2ot2] {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .footer-legal-links > span[b-g2onrq2ot2] {
        display: none;
    }
}

@media (max-width: 420px) {
    .municipal-sidebar[b-g2onrq2ot2] {
        width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            );

        min-width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            );
    }

    .sidebar-surface[b-g2onrq2ot2] {
        width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            );

        min-width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            );
    }
}



/* =========================================================
   DASHBOARD KPI — COLORED ICONS
   เพิ่มไว้ใน Layout เพื่อบังคับใช้กับ Dashboard ทุกหน้า
   รองรับทั้ง .kpi-card และ .luxury-kpi
   ========================================================= */

/* สีเขียว — คำขอบริการวันนี้ */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card.green .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi.green .kpi-icon {
    color: #ffffff !important;
    background-color: #075b45 !important;
    background-image:
        linear-gradient(
            145deg,
            #21ad80 0%,
            #0a7a59 48%,
            #054c3a 100%
        ) !important;

    border-color:
        rgba(255, 255, 255, .38) !important;

    box-shadow:
        0 13px 27px rgba(7, 91, 69, .28),
        inset 0 1px 0 rgba(255, 255, 255, .30) !important;
}

/* สีฟ้า — กำลังดำเนินการ */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card.blue .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi.blue .kpi-icon {
    color: #ffffff !important;
    background-color: #2879ad !important;
    background-image:
        linear-gradient(
            145deg,
            #55b8e7 0%,
            #2f8fc3 48%,
            #246694 100%
        ) !important;

    border-color:
        rgba(255, 255, 255, .38) !important;

    box-shadow:
        0 13px 27px rgba(40, 121, 173, .28),
        inset 0 1px 0 rgba(255, 255, 255, .30) !important;
}

/* สีทอง — รายรับวันนี้ */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card.gold .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi.gold .kpi-icon {
    color: #ffffff !important;
    background-color: #b9862f !important;
    background-image:
        linear-gradient(
            145deg,
            #edc568 0%,
            #cf9f3d 48%,
            #9a6b1d 100%
        ) !important;

    border-color:
        rgba(255, 255, 255, .42) !important;

    box-shadow:
        0 13px 27px rgba(185, 134, 47, .30),
        inset 0 1px 0 rgba(255, 255, 255, .34) !important;
}

/* สีแดง — เหตุเร่งด่วน */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card.red .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi.red .kpi-icon {
    color: #ffffff !important;
    background-color: #cf5050 !important;
    background-image:
        linear-gradient(
            145deg,
            #f17b78 0%,
            #d95b57 48%,
            #ad3938 100%
        ) !important;

    border-color:
        rgba(255, 255, 255, .40) !important;

    box-shadow:
        0 13px 27px rgba(207, 80, 80, .28),
        inset 0 1px 0 rgba(255, 255, 255, .30) !important;
}

/* บังคับสี SVG ของ MudIcon ให้เป็นสีขาว */
.municipal-main-content[b-g2onrq2ot2]  .kpi-icon-wrap .mud-icon-root,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi .kpi-icon .mud-icon-root {
    color: #ffffff !important;
    fill: currentColor !important;
    opacity: 1 !important;
    filter: none !important;
}

/* ปรับขนาดและมิติของกล่องไอคอน */
.municipal-main-content[b-g2onrq2ot2]  .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi .kpi-icon {
    overflow: hidden;
    transform: translateZ(0);

    transition:
        transform .20s ease,
        box-shadow .20s ease,
        filter .20s ease;
}

/* Hover ให้ไอคอนเด่นขึ้น */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card:hover .kpi-icon-wrap,
.municipal-main-content[b-g2onrq2ot2]  .luxury-kpi:hover .kpi-icon {
    transform:
        translateY(-2px)
        scale(1.05);

    filter:
        saturate(1.08)
        brightness(1.03);
}

/* สี Trend Chip ให้สัมพันธ์กับแต่ละ Card */
.municipal-main-content[b-g2onrq2ot2]  .kpi-card.green .trend-chip {
    color: #087052 !important;
    border-color: rgba(7, 91, 69, .14) !important;
    background: #e8f6f0 !important;
}

.municipal-main-content[b-g2onrq2ot2]  .kpi-card.blue .trend-chip {
    color: #276f9e !important;
    border-color: rgba(40, 121, 173, .14) !important;
    background: #eaf5fb !important;
}

.municipal-main-content[b-g2onrq2ot2]  .kpi-card.gold .trend-chip {
    color: #976b20 !important;
    border-color: rgba(185, 134, 47, .16) !important;
    background: #fff5df !important;
}

.municipal-main-content[b-g2onrq2ot2]  .kpi-card.red .trend-chip {
    color: #b64343 !important;
    border-color: rgba(207, 80, 80, .15) !important;
    background: #fff0ef !important;
}




/* =========================================================
   SIDEBAR COMPACT WIDTH FIX
   ป้องกันข้อความยาวดัน Sidebar จนกินพื้นที่เนื้อหา
   ========================================================= */
.municipal-layout-root[b-g2onrq2ot2] {
    --sidebar-min-width: 310px;
    --sidebar-max-width: 360px;
}

.municipal-sidebar[b-g2onrq2ot2],
.sidebar-surface[b-g2onrq2ot2] {
    max-width: var(--sidebar-max-width);
}

/* หน้าจอ Tablet/Mobile ให้ Sidebar เป็นแผงขนาดพอดี ไม่เต็มจอ */
@media (max-width: 820px) {
    .municipal-sidebar[b-g2onrq2ot2],
    .sidebar-surface[b-g2onrq2ot2] {
        width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            ) !important;

        min-width:
            min(
                var(--sidebar-auto-width),
                86vw,
                340px
            ) !important;

        max-width: 340px;
    }

    .sidebar-collapsed .municipal-sidebar[b-g2onrq2ot2] {
        width: 0 !important;
        min-width: 0 !important;
    }
}

@media (max-width: 420px) {
    .municipal-sidebar[b-g2onrq2ot2],
    .sidebar-surface[b-g2onrq2ot2] {
        width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            ) !important;

        min-width:
            min(
                var(--sidebar-auto-width),
                88vw,
                330px
            ) !important;

        max-width: 330px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .municipal-topbar[b-g2onrq2ot2],
    .municipal-sidebar[b-g2onrq2ot2],
    .sidebar-surface[b-g2onrq2ot2],
    .sidebar-arrow-button[b-g2onrq2ot2],
    .footer-back-to-top[b-g2onrq2ot2] {
        transition-duration:
            1ms !important;
    }
}

/* =========================================================
   BLAZOR ERROR
   ========================================================= */
#blazor-error-ui[b-g2onrq2ot2] {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3000;

    display: none;
    padding: .7rem 1.25rem;

    color: #3b2c00;
    background: #fff3cd;

    box-shadow:
        0 -1px 4px rgba(0, 0, 0, .16);
}

#blazor-error-ui .dismiss[b-g2onrq2ot2] {
    position: absolute;
    top: .45rem;
    right: .75rem;

    cursor: pointer;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.municipal-nav-shell[b-ag90o8bl5g] {
    --nav-emerald: var(--theme-primary, #075b45);
    --nav-emerald-dark: var(--theme-dark, #043d2f);
    --nav-gold: var(--theme-accent, #c6a15b);
    --nav-ink: var(--theme-ink, #17372e);
    --nav-muted: var(--theme-muted, #788a83);
    --nav-border: rgba(var(--theme-primary-rgb, 7, 91, 69), .12);

    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    padding: 15px 10px 12px 14px;
    overflow: hidden;

    color: var(--nav-ink);
    background:
        radial-gradient(circle at 9% 0%, rgba(var(--theme-accent-rgb, 198, 161, 91), .13), transparent 22%),
        linear-gradient(180deg, #fbfcfb 0%, var(--theme-bg, #f2f7f4) 100%);
    font-family: 'Kanit', sans-serif;
}

.municipal-nav-shell[b-ag90o8bl5g]::before {
    content: "";
    position: absolute;
    top: -110px;
    right: -115px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--theme-primary-rgb, 7, 91, 69), .13), transparent 70%);
    pointer-events: none;
}

/* =========================================================
   BRAND
   ========================================================= */
.nav-brand[b-ag90o8bl5g] {
    position: relative;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 12px;
    padding: 5px 7px 13px;
}

.brand-emblem[b-ag90o8bl5g] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(var(--theme-accent-rgb, 198, 161, 91), .32);
    border-radius: 16px;
    color: #ffffff;
    background: linear-gradient(145deg, var(--theme-primary, #0c6c51), var(--theme-dark, #043d2f));
    box-shadow:
        0 11px 24px rgba(var(--theme-dark-rgb, 4, 61, 47), .23),
        inset 0 1px 0 rgba(255, 255, 255, .12);
}

.brand-copy[b-ag90o8bl5g] {
    display: flex;
    min-width: max-content;
    flex-direction: column;
}

.brand-copy strong[b-ag90o8bl5g] {
    color: var(--theme-ink, #12382d);
    font-size: .94rem;
    font-weight: 700;
    white-space: nowrap;
}

.brand-copy span[b-ag90o8bl5g] {
    margin-top: 2px;
    color: var(--nav-muted);
    font-size: .68rem;
    white-space: nowrap;
}

/* =========================================================
   STATUS
   ========================================================= */
.nav-user-status[b-ag90o8bl5g] {
    position: relative;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    margin: 0 3px 13px;
    padding: 10px 12px;
    border: 1px solid rgba(var(--theme-primary-rgb, 7, 91, 69), .11);
    border-radius: 15px;
    background: rgba(255, 255, 255, .84);
    box-shadow: 0 7px 20px rgba(var(--theme-dark-rgb, 15, 68, 52), .055);
}

.status-dot[b-ag90o8bl5g] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #2ac581;
    box-shadow: 0 0 0 5px rgba(42, 197, 129, .12);
}

.nav-user-status > div[b-ag90o8bl5g] {
    display: flex;
    min-width: max-content;
    flex-direction: column;
}

.nav-user-status strong[b-ag90o8bl5g] {
    color: var(--theme-primary, #175e49);
    font-size: .75rem;
    font-weight: 650;
    white-space: nowrap;
}

.nav-user-status small[b-ag90o8bl5g] {
    color: var(--nav-muted);
    font-size: .63rem;
    white-space: nowrap;
}

/* =========================================================
   SCROLL
   ========================================================= */
.nav-scroll-area[b-ag90o8bl5g] {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    min-height: 0;
    padding-right: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.nav-scroll-area[b-ag90o8bl5g]::-webkit-scrollbar {
    width: 7px;
}

.nav-scroll-area[b-ag90o8bl5g]::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(var(--theme-primary-rgb, 7, 91, 69), .035);
}

.nav-scroll-area[b-ag90o8bl5g]::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background:
        linear-gradient(180deg,
            rgba(var(--theme-accent-rgb, 198, 161, 91), .78),
            rgba(var(--theme-primary-rgb, 7, 91, 69), .62))
        padding-box;
}

.nav-scroll-area[b-ag90o8bl5g] {
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--theme-primary-rgb, 7, 91, 69), .55) rgba(var(--theme-primary-rgb, 7, 91, 69), .035);
}

.municipal-nav-shell[b-ag90o8bl5g]  .municipal-nav-menu {
    width: 100%;
    padding: 0;
}

/* =========================================================
   MAIN SECTION BUTTONS
   ========================================================= */
.nav-section-toggle[b-ag90o8bl5g] {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    margin: 5px 0 7px;
    padding: 8px 10px;
    border: 1px solid rgba(var(--theme-primary-rgb, 7, 91, 69), .11);
    border-radius: 16px;
    color: var(--nav-ink);
    text-align: left;
    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, .93),
            rgba(247, 251, 249, .90));
    box-shadow:
        0 7px 20px rgba(var(--theme-dark-rgb, 15, 68, 52), .05),
        inset 0 1px 0 rgba(255, 255, 255, .88);
    font-family: 'Kanit', sans-serif;
    cursor: pointer;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.nav-section-toggle:hover[b-ag90o8bl5g] {
    border-color: rgba(var(--theme-primary-rgb, 7, 91, 69), .22);
    background: linear-gradient(135deg, #ffffff, color-mix(in srgb, var(--theme-light, #24b887) 13%, white));
    box-shadow:
        0 10px 24px rgba(var(--theme-dark-rgb, 15, 68, 52), .085),
        inset 0 1px 0 #ffffff;
    transform: translateY(-1px);
}

.nav-section-toggle[aria-expanded="true"][b-ag90o8bl5g] {
    border-color: rgba(var(--theme-primary-rgb, 7, 91, 69), .18);
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--theme-light, #24b887) 12%, white),
            color-mix(in srgb, var(--theme-accent, #c6a15b) 10%, white));
}

.section-toggle-left[b-ag90o8bl5g] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.section-toggle-icon[b-ag90o8bl5g] {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    color: #ffffff;
    background: linear-gradient(145deg, var(--theme-primary, #0d6d52), var(--theme-dark, #054432));
    box-shadow: 0 7px 17px rgba(var(--theme-dark-rgb, 4, 63, 49), .16);
}

.section-toggle-icon.citizen[b-ag90o8bl5g] {
    color: #086047;
    background: linear-gradient(145deg, #edf8f3, #dcefe8);
    box-shadow: inset 0 0 0 1px rgba(7, 91, 69, .10);
}

.section-toggle-icon.special[b-ag90o8bl5g] {
    color: #8a641f;
    background: linear-gradient(145deg, #fff8e9, #f1e3bd);
    box-shadow: inset 0 0 0 1px rgba(169, 126, 47, .14);
}

.section-toggle-icon.economy[b-ag90o8bl5g] {
    color: #6a4a9d;
    background: linear-gradient(145deg, #f6f1ff, #e6dcf6);
    box-shadow: inset 0 0 0 1px rgba(106, 74, 157, .13);
}

.section-toggle-icon.internal[b-ag90o8bl5g] {
    color: #256b91;
    background: linear-gradient(145deg, #edf8fd, #d9edf6);
    box-shadow: inset 0 0 0 1px rgba(37, 107, 145, .13);
}

.section-toggle-icon.admin[b-ag90o8bl5g] {
    color: #a04343;
    background: linear-gradient(145deg, #fff3f1, #f4deda);
    box-shadow: inset 0 0 0 1px rgba(160, 67, 67, .13);
}

.section-toggle-icon.account[b-ag90o8bl5g] {
    color: #425f56;
    background: linear-gradient(145deg, #f3f7f5, #dfe9e5);
    box-shadow: inset 0 0 0 1px rgba(66, 95, 86, .13);
}

.section-toggle-copy[b-ag90o8bl5g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.section-toggle-copy strong[b-ag90o8bl5g] {
    color: var(--theme-ink, #173b30);
    font-size: .80rem;
    font-weight: 650;
    white-space: nowrap;
}

.section-toggle-copy small[b-ag90o8bl5g] {
    overflow: hidden;
    max-width: 210px;
    margin-top: 1px;
    color: var(--nav-muted);
    font-size: .61rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.section-chevron[b-ag90o8bl5g] {
    flex: 0 0 auto;
    color: #71857e;
}

.section-collapse-content[b-ag90o8bl5g] {
    padding: 0 1px 2px;
}

/* =========================================================
   NAV LINKS / GROUPS
   ========================================================= */
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link {
    width: 100%;
    min-height: 43px;
    margin: 2px 0;
    padding: 8px 11px;
    border-radius: 13px;
    color: #465a53;
    font-family: 'Kanit', sans-serif;
    font-size: .80rem;
    font-weight: 400;
    white-space: nowrap;
    transition:
        color .17s ease,
        background .17s ease,
        transform .17s ease,
        box-shadow .17s ease;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link:hover {
    color: var(--nav-emerald);
    background: rgba(var(--theme-primary-rgb, 7, 91, 69), .065);
    transform: translateX(2px);
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active {
    color: #ffffff;
    background:
        linear-gradient(135deg, var(--theme-primary, #0b6d51) 0%, var(--theme-dark, #054333) 100%);
    box-shadow: 0 9px 20px rgba(var(--theme-dark-rgb, 4, 67, 50), .20);
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active:hover,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .mud-nav-link-text,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .mud-nav-link-text *,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .mud-typography {
    color: #ffffff !important;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .mud-nav-link-icon {
    color: color-mix(in srgb, var(--theme-accent, #f3d797) 88%, white) !important;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link-icon {
    min-width: 34px;
    color: #6f817b;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link-text {
    min-width: 0 !important;
    max-width: 100% !important;

    overflow: hidden !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group {
    width: 100%;
    margin: 3px 0;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group > .mud-nav-link {
    min-height: 45px;
    color: #263f37;
    font-weight: 550;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group .mud-collapse-container {
    position: relative;
    width: calc(100% - 15px);
    margin: 3px 0 7px 15px;
    padding-left: 9px;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group .mud-collapse-container::before {
    content: "";
    position: absolute;
    top: 2px;
    bottom: 3px;
    left: 0;
    width: 1px;
    background:
        linear-gradient(180deg,
            rgba(var(--theme-accent-rgb, 198, 161, 91), .10),
            rgba(var(--theme-accent-rgb, 198, 161, 91), .44),
            rgba(var(--theme-primary-rgb, 7, 91, 69), .12));
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group .mud-collapse-container .mud-nav-link {
    min-height: 39px;
    padding-left: 9px;
    font-size: .75rem;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group .mud-nav-link-expand-icon {
    color: #8c9a95;
}

/* =========================================================
   DIVIDER / ACCOUNT / FOOTER
   ========================================================= */
.municipal-nav-shell[b-ag90o8bl5g]  .nav-divider {
    margin: 11px 7px;
    border-color: var(--nav-border);
}

.signed-user[b-ag90o8bl5g] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 7px 2px;
    padding: 10px;
    border: 1px solid rgba(var(--theme-accent-rgb, 198, 161, 91), .19);
    border-radius: 14px;
    background: rgba(255, 255, 255, .86);
}

.signed-avatar[b-ag90o8bl5g] {
    display: grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 11px;
    color: #ffffff;
    background: linear-gradient(145deg, var(--theme-primary, #0d6d52), var(--theme-dark, #064533));
}

.signed-copy[b-ag90o8bl5g] {
    display: flex;
    min-width: max-content;
    flex-direction: column;
}

.signed-copy strong[b-ag90o8bl5g] {
    color: var(--theme-ink, #173b30);
    font-size: .75rem;
    white-space: nowrap;
}

.signed-copy span[b-ag90o8bl5g] {
    color: var(--nav-muted);
    font-size: .63rem;
    white-space: nowrap;
}

.logout-form[b-ag90o8bl5g] {
    margin: 4px 2px 0;
}

.logout-button[b-ag90o8bl5g] {
    display: flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    gap: 11px;
    padding: 8px 12px;
    border: 1px solid rgba(177, 67, 58, .15);
    border-radius: 13px;
    color: #a5443c;
    background: rgba(255, 249, 248, .86);
    font-family: 'Kanit', sans-serif;
    font-size: .78rem;
    white-space: nowrap;
    cursor: pointer;
}

.nav-footer[b-ag90o8bl5g] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 16px 4px 0;
    padding: 11px;
    border-top: 1px solid var(--nav-border);
    color: #678078;
}

.nav-footer > div[b-ag90o8bl5g] {
    display: flex;
    min-width: max-content;
    flex-direction: column;
}

.nav-footer strong[b-ag90o8bl5g] {
    color: var(--theme-ink, #3e5c53);
    font-size: .66rem;
    font-weight: 600;
    white-space: nowrap;
}

.nav-footer span[b-ag90o8bl5g] {
    font-size: .59rem;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .municipal-nav-shell[b-ag90o8bl5g] {
        padding: 13px 7px 10px 11px;
    }

    .section-toggle-copy small[b-ag90o8bl5g] {
        max-width: 180px;
    }
}


/* =========================================================
   SYSTEM MANAGEMENT / ROLE GROUPS
   ========================================================= */
.role-menu-heading[b-ag90o8bl5g] {
    display: flex;
    min-height: 34px;

    align-items: center;
    gap: 8px;

    margin: 10px 5px 5px;
    padding: 7px 9px;

    border:
        1px solid rgba(198, 161, 91, .17);

    border-radius: 11px;

    color: #876820;

    background:
        linear-gradient(
            145deg,
            rgba(255, 249, 234, .94),
            rgba(249, 241, 217, .86)
        );

    font-size: .62rem;
    font-weight: 650;
}

.role-menu-heading[b-ag90o8bl5g]  .mud-icon-root {
    color: #b4862e;
}

.role-menu-item[b-ag90o8bl5g] {
    display: flex;
    min-width: 0;
    flex-direction: column;

    padding: 1px 0;
}

.role-menu-item strong[b-ag90o8bl5g],
.role-menu-item small[b-ag90o8bl5g] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.role-menu-item strong[b-ag90o8bl5g] {
    color: inherit;
    font-size: .69rem;
    font-weight: 650;
}

.role-menu-item small[b-ag90o8bl5g] {
    margin-top: 1px;

    color: #8a9892;
    font-size: .53rem;
    font-weight: 400;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .role-menu-item small {
    color: rgba(255, 255, 255, .70);
}

/* สีประจำกลุ่มสิทธิ์ */
.role-system-admin strong[b-ag90o8bl5g] {
    color: #a4463e;
}

.role-executive strong[b-ag90o8bl5g] {
    color: #987126;
}

.role-department-head strong[b-ag90o8bl5g] {
    color: #276f9e;
}

.role-operational strong[b-ag90o8bl5g] {
    color: #087052;
}

.role-citizen strong[b-ag90o8bl5g] {
    color: #7253a1;
}

.role-guest strong[b-ag90o8bl5g] {
    color: #6f7e78;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link.active .role-menu-item strong {
    color: #ffffff;
}



/* =========================================================
   COMPACT SIDEBAR CONTENT
   ข้อความยาวไม่ดันความกว้างของเมนู
   ========================================================= */
.municipal-nav-shell[b-ag90o8bl5g] {
    width: 100%;
    max-width: 360px;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group,
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link-text {
    min-width: 0;
    max-width: 100%;
}

.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-link {
    overflow: hidden;
}

.section-toggle-copy[b-ag90o8bl5g] {
    min-width: 0;
}

.section-toggle-copy strong[b-ag90o8bl5g],
.section-toggle-copy small[b-ag90o8bl5g] {
    overflow: hidden;

    max-width: 220px;

    white-space: nowrap;
    text-overflow: ellipsis;
}

/* กลุ่มสิทธิ์ให้คำอธิบายขึ้นได้ 2 บรรทัด แทนการขยายออกด้านข้าง */
.role-menu-item[b-ag90o8bl5g] {
    width: 100%;
    min-width: 0;
    max-width: 205px;
}

.role-menu-item strong[b-ag90o8bl5g] {
    overflow: hidden;

    max-width: 100%;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.role-menu-item small[b-ag90o8bl5g] {
    display: -webkit-box;
    overflow: hidden;

    max-width: 100%;

    white-space: normal;
    line-height: 1.35;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* ลดระยะเยื้องเมนูชั้นในเล็กน้อย */
.municipal-nav-shell[b-ag90o8bl5g]  .mud-nav-group .mud-collapse-container {
    width: calc(100% - 11px);
    margin-left: 11px;
    padding-left: 7px;
}

@media (max-width: 420px) {
    .section-toggle-copy strong[b-ag90o8bl5g],
    .section-toggle-copy small[b-ag90o8bl5g] {
        max-width: 190px;
    }

    .role-menu-item[b-ag90o8bl5g] {
        max-width: 180px;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
#components-reconnect-modal[b-gk9m0bhw1i] {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1400;
    overflow: hidden;
    background-color: transparent;
    border: none;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    padding: 0;
}

    #components-reconnect-modal[b-gk9m0bhw1i]::backdrop {
        background: rgba(10, 16, 28, 0.5);
    }

    #components-reconnect-modal.components-reconnect-show[b-gk9m0bhw1i],
    #components-reconnect-modal[open][b-gk9m0bhw1i],
    #components-reconnect-modal.components-reconnect-failed[b-gk9m0bhw1i],
    #components-reconnect-modal.components-reconnect-repeated-attempt[b-gk9m0bhw1i],
    #components-reconnect-modal.components-reconnect-paused[b-gk9m0bhw1i],
    #components-reconnect-modal.components-reconnect-resume-failed[b-gk9m0bhw1i],
    #components-reconnect-modal.components-pause[b-gk9m0bhw1i],
    #components-reconnect-modal.components-resume-failed[b-gk9m0bhw1i] {
        display: flex;
        align-items: center;
        justify-content: center;
    }

.components-reconnect-backdrop[b-gk9m0bhw1i] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(90% 60% at 80% 0%, color-mix(in srgb, var(--mud-palette-primary, #594AE2) 12%, transparent), transparent 60%), radial-gradient(80% 55% at 0% 100%, color-mix(in srgb, var(--mud-palette-info, #2196f3) 16%, transparent), transparent 62%), rgba(8, 12, 20, 0.5);
}

.components-reconnect-surface[b-gk9m0bhw1i] {
    width: min(480px, 100%);
    border-radius: var(--mud-default-borderradius, 12px);
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #e0e0e0) 70%, transparent);
    background: var(--mud-palette-surface, #fff);
    box-shadow: var(--mud-elevation-24, 0 16px 30px rgba(0, 0, 0, 0.28));
    color: var(--mud-palette-text-primary, #1f2937);
    padding: 20px 20px 18px;
}

.components-reconnect-header[b-gk9m0bhw1i] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

    .components-reconnect-header h2[b-gk9m0bhw1i] {
        margin: 0;
        font-size: 1.05rem;
        font-weight: 600;
        line-height: 1.3;
    }

.components-reconnect-status-dot[b-gk9m0bhw1i] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mud-palette-warning, #f59e0b);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--mud-palette-warning, #f59e0b) 25%, transparent);
}

.components-reconnect-supporting[b-gk9m0bhw1i],
.components-reconnect-message[b-gk9m0bhw1i] {
    margin: 0;
    line-height: 1.45;
    font-size: 0.95rem;
}

.components-reconnect-supporting[b-gk9m0bhw1i] {
    color: var(--mud-palette-text-secondary, #52607a);
    margin-bottom: 14px;
}

.components-reconnect-message[b-gk9m0bhw1i] {
    font-weight: 500;
}

.components-reconnect-danger[b-gk9m0bhw1i] {
    color: var(--mud-palette-error, #b00020);
}

.components-reconnect-actions[b-gk9m0bhw1i] {
    margin-top: 14px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.components-reconnect-first-attempt-visible[b-gk9m0bhw1i],
.components-reconnect-repeated-attempt-visible[b-gk9m0bhw1i],
.components-reconnect-failed-visible[b-gk9m0bhw1i],
.components-pause-visible[b-gk9m0bhw1i],
.components-resume-failed-visible[b-gk9m0bhw1i] {
    display: none;
}

dialog[open].components-reconnect-show .components-reconnect-first-attempt-visible[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-show .components-rejoin-loader[b-gk9m0bhw1i] {
    display: inline-flex;
}

dialog[open].components-reconnect-failed .components-reconnect-failed-visible[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-failed #components-reconnect-button[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-repeated-attempt .components-reconnect-repeated-attempt-visible[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-repeated-attempt .components-rejoin-loader[b-gk9m0bhw1i] {
    display: inline-flex;
}

dialog[open].components-reconnect-paused .components-pause-visible[b-gk9m0bhw1i],
dialog[open].components-pause .components-pause-visible[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-paused #components-resume-button[b-gk9m0bhw1i],
dialog[open].components-pause #components-resume-button[b-gk9m0bhw1i],
dialog[open].components-reconnect-resume-failed #components-resume-button[b-gk9m0bhw1i],
dialog[open].components-resume-failed #components-resume-button[b-gk9m0bhw1i] {
    display: block;
}

dialog[open].components-reconnect-resume-failed .components-resume-failed-visible[b-gk9m0bhw1i],
dialog[open].components-resume-failed .components-resume-failed-visible[b-gk9m0bhw1i] {
    display: block;
}

.components-rejoin-loader[b-gk9m0bhw1i] {
    display: none;
    margin-bottom: 10px;
    gap: 8px;
}

    .components-rejoin-loader div[b-gk9m0bhw1i] {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background-color: var(--mud-palette-primary, #594AE2);
        animation: reconnect-pulse-b-gk9m0bhw1i 1.2s infinite ease-in-out both;
    }

        .components-rejoin-loader div:nth-child(1)[b-gk9m0bhw1i] {
            animation-delay: -0.24s;
        }

        .components-rejoin-loader div:nth-child(2)[b-gk9m0bhw1i] {
            animation-delay: -0.12s;
        }

@keyframes reconnect-pulse-b-gk9m0bhw1i {
    0%, 80%, 100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1);
    }
}

#components-reconnect-button[b-gk9m0bhw1i],
#components-resume-button[b-gk9m0bhw1i] {
    display: none;
    min-width: 92px;
    cursor: pointer;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: 999px;
    background-color: var(--mud-palette-primary, #594AE2);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    transition: filter 140ms ease, transform 140ms ease;
}

    #components-reconnect-button:hover[b-gk9m0bhw1i],
    #components-resume-button:hover[b-gk9m0bhw1i] {
        filter: brightness(0.95);
    }

    #components-reconnect-button:active[b-gk9m0bhw1i],
    #components-resume-button:active[b-gk9m0bhw1i] {
        transform: translateY(1px);
    }

@media (max-width: 600px) {
    .components-reconnect-backdrop[b-gk9m0bhw1i] {
        padding: 14px;
    }

    .components-reconnect-surface[b-gk9m0bhw1i] {
        padding: 16px;
    }
}
/* /Components/Pages/01Ziticen/01Daskboard/ExecutiveDashboard.razor.rz.scp.css */
.executive-dashboard-page[b-ls36li0e4v] {
    --emerald-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --emerald-900: var(--theme-dark);
    --emerald-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --emerald-700: var(--theme-primary);
    --emerald-600: color-mix(in srgb, var(--theme-primary) 84%, var(--theme-light));
    --gold-500: var(--theme-accent);
    --gold-300: color-mix(in srgb, var(--theme-accent) 52%, white);
    --surface: #ffffff;
    --page-bg: var(--theme-bg);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --panel-shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);

    background:
        radial-gradient(
            circle at 1% 0%,
            rgba(201, 166, 93, .12),
            transparent 28rem
        ),
        radial-gradient(
            circle at 100% 4%,
            rgba(10, 106, 80, .09),
            transparent 32rem
        ),
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--theme-bg) 58%, white) 0%,
            var(--theme-bg) 100%
        );

    font-family: 'Kanit', sans-serif;
}

.executive-dashboard-page[b-ls36li0e4v]  .executive-dashboard-container {
    width: 100%;
    max-width: 1780px;

    margin: 0 auto;
    padding: 0 !important;
}

/* =========================================================
   HERO
   ========================================================= */
.executive-hero[b-ls36li0e4v] {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(320px, .55fr);

    min-height: 320px;

    align-items: center;
    gap: 30px;

    padding: 38px 40px;

    overflow: hidden;

    border:
        1px solid rgba(231, 207, 152, .22);

    border-radius: 30px;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 84% 0%,
            rgba(201, 166, 93, .22),
            transparent 27%
        ),
        radial-gradient(
            circle at 9% 115%,
            rgba(28, 138, 101, .22),
            transparent 34%
        ),
        linear-gradient(
            138deg,
            var(--theme-dark) 0%,
            color-mix(in srgb, var(--theme-dark) 86%, black) 58%,
            color-mix(in srgb, var(--theme-dark) 72%, black) 100%
        );

    box-shadow:
        0 28px 72px rgba(4, 54, 41, .24);
}

.hero-grid-pattern[b-ls36li0e4v] {
    position: absolute;
    inset: 0;

    opacity: .15;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .055) 1px,
            transparent 1px
        );

    background-size: 36px 36px;

    mask-image:
        linear-gradient(
            90deg,
            #000,
            transparent 88%
        );
}

.hero-gold-line[b-ls36li0e4v] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(231, 207, 152, .88),
            transparent
        );

    box-shadow:
        0 0 24px rgba(231, 207, 152, .42);
}

.hero-orb[b-ls36li0e4v] {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}

.hero-orb-one[b-ls36li0e4v] {
    right: -140px;
    bottom: -180px;

    width: 380px;
    height: 380px;

    background:
        radial-gradient(
            circle,
            rgba(201, 166, 93, .14),
            transparent 68%
        );
}

.hero-orb-two[b-ls36li0e4v] {
    top: -170px;
    left: 38%;

    width: 340px;
    height: 340px;

    background:
        radial-gradient(
            circle,
            rgba(49, 190, 140, .10),
            transparent 68%
        );
}

.hero-content[b-ls36li0e4v] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-ls36li0e4v] {
    display: inline-flex;
    width: fit-content;

    align-items: center;
    gap: 10px;

    margin-bottom: 20px;

    padding:
        8px 13px 8px 8px;

    border:
        1px solid rgba(231, 207, 152, .24);

    border-radius: 999px;

    background:
        rgba(255, 255, 255, .055);

    backdrop-filter:
        blur(12px);
}

.hero-badge-icon[b-ls36li0e4v] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);

    background:
        rgba(201, 166, 93, .14);
}

.hero-badge-copy[b-ls36li0e4v] {
    display: flex;
    flex-direction: column;
}

.hero-badge-copy small[b-ls36li0e4v] {
    color:
        rgba(255, 255, 255, .52);

    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge-copy strong[b-ls36li0e4v] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .69rem;
    font-weight: 650;
}

.hero-content h1[b-ls36li0e4v] {
    margin: 0;

    color: #ffffff;
    font-size:
        clamp(2.25rem, 3.9vw, 4.35rem);

    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.04em;
}

.hero-content p[b-ls36li0e4v] {
    max-width: 950px;

    margin: 18px 0 0;

    color:
        rgba(255, 255, 255, .66);

    font-size:
        clamp(.84rem, 1.08vw, 1.02rem);

    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-ls36li0e4v] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;

    margin-top: 24px;
}

.hero-meta > span[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    gap: 7px;

    padding: 0 12px;

    border:
        1px solid rgba(255, 255, 255, .10);

    border-radius: 12px;

    color:
        rgba(255, 255, 255, .63);

    background:
        rgba(255, 255, 255, .045);

    font-size: .64rem;
}

.hero-control-panel[b-ls36li0e4v] {
    position: relative;
    z-index: 3;

    padding: 20px;

    border:
        1px solid rgba(255, 255, 255, .14);

    border-radius: 22px;

    color: var(--ink);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .985),
            rgba(242, 247, 244, .955)
        );

    box-shadow:
        0 24px 52px rgba(0, 0, 0, .18);
}

.control-header[b-ls36li0e4v] {
    display: flex;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 13px;
}

.control-header > div[b-ls36li0e4v] {
    display: flex;
    flex-direction: column;
}

.control-header small[b-ls36li0e4v] {
    color: #9d7b35;
    font-size: .53rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.control-header strong[b-ls36li0e4v] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: .76rem;
}

.executive-dashboard-page[b-ls36li0e4v]  .refresh-button {
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
}

.executive-dashboard-page[b-ls36li0e4v]  .hero-field {
    width: 100%;
}

.executive-dashboard-page[b-ls36li0e4v]  .hero-field .mud-input-outlined-border {
    border-color:
        rgba(7, 88, 67, .13);
}

.executive-dashboard-page[b-ls36li0e4v]  .apply-filter-button {
    min-height: 44px;

    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;

    box-shadow:
        0 10px 23px rgba(4, 61, 47, .20);
}

.control-summary[b-ls36li0e4v] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;

    margin-top: 14px;
}

.control-summary > span[b-ls36li0e4v] {
    display: flex;
    min-height: 63px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    border:
        1px solid rgba(7, 88, 67, .08);

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            #f4f7f5,
            #ffffff
        );
}

.control-summary small[b-ls36li0e4v] {
    color: var(--theme-muted);
    font-size: .53rem;
}

.control-summary strong[b-ls36li0e4v] {
    margin-top: 2px;

    color: #185d48;
    font-size: .76rem;
}

.executive-dashboard-page[b-ls36li0e4v]  .dashboard-loading {
    margin:
        -4px 27px 0;

    border-radius:
        0 0 10px 10px;
}

.executive-dashboard-page[b-ls36li0e4v]  .dashboard-error {
    margin-top: 18px;

    border-radius: 15px !important;
}

/* =========================================================
   KPI
   ========================================================= */
.kpi-grid[b-ls36li0e4v] {
    margin-top: 7px;
}

.executive-kpi[b-ls36li0e4v] {
    position: relative;

    display: flex;
    min-height: 164px;

    align-items: center;
    gap: 16px;

    padding: 21px;

    overflow: hidden;

    border:
        1px solid var(--border);

    border-radius: 22px;

    color: #0b7557;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(247, 250, 248, .97)
        );

    box-shadow: var(--panel-shadow);

    transition:
        transform .20s ease,
        box-shadow .20s ease,
        border-color .20s ease;
}

.executive-kpi:hover[b-ls36li0e4v] {
    transform:
        translateY(-4px);

    border-color:
        rgba(7, 88, 67, .20);

    box-shadow:
        0 20px 46px rgba(5, 62, 46, .11);
}

.executive-kpi.blue[b-ls36li0e4v] {
    color: #2b7fae;
}

.executive-kpi.gold[b-ls36li0e4v] {
    color: #b9882f;
}

.executive-kpi.red[b-ls36li0e4v] {
    color: #cf514b;
}

.kpi-top-line[b-ls36li0e4v] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;

    opacity: .56;

    background:
        linear-gradient(
            90deg,
            transparent,
            currentColor,
            transparent
        );
}

.kpi-icon[b-ls36li0e4v] {
    display: grid;
    flex: 0 0 56px;

    width: 56px;
    height: 56px;

    place-items: center;

    border-radius: 17px;

    color: #ffffff;
    background: currentColor;

    box-shadow:
        0 12px 25px rgba(0, 0, 0, .13);
}

.kpi-content[b-ls36li0e4v] {
    min-width: 0;
    flex: 1;
}

.kpi-label[b-ls36li0e4v] {
    color: var(--theme-muted);
    font-size: .71rem;
    font-weight: 560;
}

.kpi-value-row[b-ls36li0e4v] {
    display: flex;

    align-items: baseline;
    gap: 7px;

    margin-top: 4px;
}

.kpi-value-row strong[b-ls36li0e4v] {
    color: var(--ink);
    font-size: 1.95rem;
    font-weight: 800;
    letter-spacing: -.035em;
}

.kpi-value-row small[b-ls36li0e4v] {
    color: var(--theme-muted);
    font-size: .62rem;
}

.kpi-footer[b-ls36li0e4v] {
    display: flex;
    flex-wrap: wrap;

    align-items: center;
    gap: 7px;

    margin-top: 9px;

    color: #94a09b;
    font-size: .56rem;
}

.kpi-trend[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 4px;

    padding: 0 7px;

    border-radius: 999px;

    font-size: .56rem;
    font-weight: 650;
}

.kpi-trend.positive[b-ls36li0e4v] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.kpi-trend.negative[b-ls36li0e4v] {
    color: #b44741;
    background: #fff0ef;
}

/* =========================================================
   COMMON PANELS
   ========================================================= */
.dashboard-row[b-ls36li0e4v] {
    margin-top: 7px;
}

.premium-panel[b-ls36li0e4v] {
    height: 100%;
    padding: 23px;

    border:
        1px solid var(--border);

    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(248, 251, 249, .97)
        );

    box-shadow: var(--panel-shadow);
}

.panel-heading[b-ls36li0e4v] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 19px;
}

.panel-heading.compact[b-ls36li0e4v] {
    margin-bottom: 14px;
}

.panel-kicker[b-ls36li0e4v] {
    color: #9d7a36;
    font-size: .53rem;
    font-weight: 760;
    letter-spacing: .11em;
}

.panel-heading h2[b-ls36li0e4v] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.22rem;
    font-weight: 730;
}

.panel-heading p[b-ls36li0e4v] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .65rem;
}

.panel-badge[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border:
        1px solid rgba(7, 88, 67, .13);

    border-radius: 999px;

    color: #0b7154;
    background: #edf8f3;

    font-size: .61rem;
    white-space: nowrap;
}

.panel-link-button[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 37px;

    align-items: center;
    gap: 6px;

    padding: 0 11px;

    border:
        1px solid rgba(7, 88, 67, .13);

    border-radius: 11px;

    color: #0b7154;
    background: #edf8f3;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.executive-dashboard-page[b-ls36li0e4v]  .premium-chart {
    font-family: 'Kanit', sans-serif;
}

.status-summary[b-ls36li0e4v] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;

    margin-top: -4px;
}

.status-summary > span[b-ls36li0e4v] {
    display: flex;
    min-height: 68px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    border:
        1px solid rgba(7, 88, 67, .08);

    border-radius: 13px;

    background: #f6f9f7;
}

.status-summary small[b-ls36li0e4v] {
    color: var(--theme-muted);
    font-size: .53rem;
}

.status-summary strong[b-ls36li0e4v] {
    margin-top: 2px;

    color: #155c47;
    font-size: 1.22rem;
}

.status-summary em[b-ls36li0e4v] {
    color: #9ba6a1;
    font-size: .51rem;
    font-style: normal;
}

/* =========================================================
   FINANCE
   ========================================================= */
.finance-summary[b-ls36li0e4v] {
    display: flex;
    min-height: 95px;

    align-items: center;
    gap: 11px;

    padding: 13px;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f6f9f7
        );
}

.finance-icon[b-ls36li0e4v] {
    display: grid;
    flex: 0 0 43px;

    width: 43px;
    height: 43px;

    place-items: center;

    border-radius: 13px;

    color: #ffffff;
    background: var(--theme-primary);
}

.finance-summary.expense .finance-icon[b-ls36li0e4v] {
    background: #d28a32;
}

.finance-summary.remaining .finance-icon[b-ls36li0e4v] {
    background: #2d7fab;
}

.finance-summary > div[b-ls36li0e4v] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.finance-summary small[b-ls36li0e4v] {
    color: #87958f;
    font-size: .55rem;
}

.finance-summary strong[b-ls36li0e4v] {
    overflow: hidden;

    margin-top: 2px;

    color: #23443a;
    font-size: .80rem;
    font-weight: 730;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.finance-summary em[b-ls36li0e4v] {
    color: #9aa59f;
    font-size: .50rem;
    font-style: normal;
}

.budget-progress-section[b-ls36li0e4v] {
    margin: 18px 0 8px;
    padding: 14px;

    border:
        1px solid rgba(7, 88, 67, .08);

    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-progress-heading[b-ls36li0e4v] {
    display: flex;

    justify-content: space-between;
    gap: 12px;

    margin-bottom: 8px;

    color: var(--theme-muted);
    font-size: .58rem;
}

.budget-progress-heading strong[b-ls36li0e4v] {
    margin-left: 5px;

    color: #0b7154;
    font-size: .68rem;
}

.budget-progress-heading em[b-ls36li0e4v] {
    color: #9b875d;
    font-style: normal;
}

.executive-dashboard-page[b-ls36li0e4v]  .budget-progress {
    height: 11px;
}

.finance-chart[b-ls36li0e4v] {
    margin-top: 4px;
}

/* =========================================================
   SATISFACTION
   ========================================================= */
.score-badge[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;

    padding: 0 10px;

    border-radius: 999px;

    color: #8d681e;
    background: #fff2d5;

    font-size: .65rem;
    font-weight: 700;
    white-space: nowrap;
}

.satisfaction-hero[b-ls36li0e4v] {
    display: flex;

    align-items: center;
    gap: 20px;

    padding: 16px;

    border:
        1px solid rgba(7, 88, 67, .08);

    border-radius: 18px;

    background:
        radial-gradient(
            circle at 20% 10%,
            rgba(201, 166, 93, .12),
            transparent 50%
        ),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.score-ring[b-ls36li0e4v] {
    display: flex;
    flex: 0 0 125px;

    width: 125px;
    height: 125px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    border:
        10px solid #d9eee5;

    border-top-color: #0b7657;
    border-right-color: #0b7657;

    border-radius: 50%;

    background: #ffffff;

    box-shadow:
        0 12px 28px rgba(5, 62, 46, .09);

    transform:
        rotate(7deg);
}

.score-ring strong[b-ls36li0e4v],
.score-ring small[b-ls36li0e4v] {
    transform:
        rotate(-7deg);
}

.score-ring strong[b-ls36li0e4v] {
    color: var(--theme-primary);
    font-size: 1.45rem;
    font-weight: 800;
}

.score-ring small[b-ls36li0e4v] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.satisfaction-copy[b-ls36li0e4v] {
    min-width: 0;
}

.satisfaction-copy > strong[b-ls36li0e4v] {
    color: #24463b;
    font-size: .90rem;
}

.satisfaction-copy p[b-ls36li0e4v] {
    margin: 4px 0 9px;

    color: #84928d;
    font-size: .59rem;
}

.star-row[b-ls36li0e4v] {
    display: flex;
    gap: 2px;
}

.star[b-ls36li0e4v] {
    color: #dce4e0;
}

.star.active[b-ls36li0e4v] {
    color: #e0af45;
}

.satisfaction-breakdown[b-ls36li0e4v] {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin-top: 17px;
}

.satisfaction-breakdown > div[b-ls36li0e4v] {
    display: grid;
    grid-template-columns:
        110px
        minmax(0, 1fr)
        42px;

    align-items: center;
    gap: 10px;
}

.satisfaction-breakdown span[b-ls36li0e4v] {
    color: #71827b;
    font-size: .58rem;
}

.satisfaction-breakdown strong[b-ls36li0e4v] {
    color: #31574a;
    font-size: .60rem;
    text-align: right;
}

/* =========================================================
   DEPARTMENT TABLE
   ========================================================= */
.department-panel[b-ls36li0e4v] {
    margin-top: 24px;
}

.executive-dashboard-page[b-ls36li0e4v]  .department-table {
    overflow: hidden;
    border-radius: 16px;
}

.executive-dashboard-page[b-ls36li0e4v]  .department-table .mud-table-head {
    background: #eef6f2;
}

.executive-dashboard-page[b-ls36li0e4v]  .department-table .mud-table-cell {
    padding: 13px 11px;

    border-bottom-color:
        #e9f0ec;

    font-size: .67rem;
}

.rank-badge[b-ls36li0e4v] {
    display: grid;
    width: 30px;
    height: 30px;

    place-items: center;

    border-radius: 10px;

    color: #52675f;
    background: #eef3f0;

    font-weight: 700;
}

.rank-badge.rank-1[b-ls36li0e4v] {
    color: #725315;
    background: #f7d98e;
}

.rank-badge.rank-2[b-ls36li0e4v] {
    color: #52616b;
    background: #dfe8ec;
}

.rank-badge.rank-3[b-ls36li0e4v] {
    color: #845426;
    background: #efd0ad;
}

.department-name[b-ls36li0e4v] {
    display: flex;
    min-width: 210px;

    align-items: center;
    gap: 9px;
}

.department-icon[b-ls36li0e4v] {
    display: grid;
    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    place-items: center;

    border-radius: 11px;

    color: #0a7154;
    background: #e7f4ee;
}

.department-name > span:last-child[b-ls36li0e4v] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.department-name strong[b-ls36li0e4v],
.department-name small[b-ls36li0e4v] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.department-name strong[b-ls36li0e4v] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.department-name small[b-ls36li0e4v] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.success-number[b-ls36li0e4v] {
    color: var(--theme-primary);
}

.pending-number[b-ls36li0e4v] {
    color: #b06d26;
}

.table-score[b-ls36li0e4v] {
    display: inline-flex;
    align-items: center;
    gap: 4px;

    color: #9a721f;
}

.table-score[b-ls36li0e4v]  .mud-icon-root {
    color: #e0ae43;
}

.performance-cell[b-ls36li0e4v] {
    display: grid;
    grid-template-columns:
        minmax(90px, 1fr)
        38px;

    align-items: center;
    gap: 8px;
}

.performance-cell strong[b-ls36li0e4v] {
    color: #31574a;
    font-size: .58rem;
}

/* =========================================================
   PROJECTS
   ========================================================= */
.project-list[b-ls36li0e4v],
.decision-list[b-ls36li0e4v] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.project-card[b-ls36li0e4v] {
    position: relative;

    display: grid;
    grid-template-columns:
        46px
        minmax(0, 1fr)
        auto
        auto;

    width: 100%;
    min-height: 89px;

    align-items: center;
    gap: 11px;

    padding: 12px;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 16px;

    text-align: left;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f9fbfa
        );

    font-family: 'Kanit', sans-serif;
    cursor: pointer;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.project-card:hover[b-ls36li0e4v] {
    transform:
        translateY(-2px);

    border-color:
        rgba(7, 88, 67, .20);

    box-shadow:
        0 12px 27px rgba(5, 62, 46, .08);
}

.project-icon[b-ls36li0e4v] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;

    border-radius: 14px;

    color: #ffffff;
    background: var(--theme-primary);
}

.project-icon.blue[b-ls36li0e4v] {
    background: #2b7fae;
}

.project-icon.gold[b-ls36li0e4v] {
    background: #b9882f;
}

.project-icon.red[b-ls36li0e4v] {
    background: #cf514b;
}

.project-icon.teal[b-ls36li0e4v] {
    background: #27877c;
}

.project-main[b-ls36li0e4v] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.project-title-line[b-ls36li0e4v] {
    display: flex;

    align-items: center;
    gap: 7px;
}

.project-title-line strong[b-ls36li0e4v] {
    overflow: hidden;

    color: var(--theme-ink);
    font-size: .70rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.risk-badge[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;

    padding: 0 7px;

    border-radius: 999px;

    color: #64766e;
    background: #edf2ef;

    font-size: .48rem;
    font-style: normal;
    white-space: nowrap;
}

.risk-badge.high[b-ls36li0e4v] {
    color: #ad403a;
    background: #fee9e8;
}

.risk-badge.medium[b-ls36li0e4v] {
    color: #936219;
    background: #fff1d6;
}

.risk-badge.low[b-ls36li0e4v] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.project-main > small[b-ls36li0e4v] {
    overflow: hidden;

    margin-top: 3px;

    color: var(--theme-muted);
    font-size: .54rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.project-progress-row[b-ls36li0e4v] {
    display: grid;
    grid-template-columns:
        minmax(100px, 1fr)
        38px;

    align-items: center;
    gap: 8px;

    margin-top: 8px;
}

.project-progress-row strong[b-ls36li0e4v] {
    color: #31574a;
    font-size: .56rem;
}

.project-date[b-ls36li0e4v] {
    display: flex;
    min-width: 82px;
    flex-direction: column;

    text-align: right;
}

.project-date small[b-ls36li0e4v] {
    color: #929f99;
    font-size: .49rem;
}

.project-date strong[b-ls36li0e4v] {
    margin-top: 2px;

    color: #556a62;
    font-size: .57rem;
}

.project-arrow[b-ls36li0e4v] {
    color: #98a59f;
}

/* =========================================================
   DECISIONS
   ========================================================= */
.live-badge[b-ls36li0e4v] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 6px;

    padding: 0 8px;

    border-radius: 999px;

    color: #c24c46;
    background: #fdeceb;

    font-size: .51rem;
    font-weight: 800;
}

.live-badge i[b-ls36li0e4v] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #d9524b;

    box-shadow:
        0 0 0 4px rgba(217, 82, 75, .11);
}

.decision-item[b-ls36li0e4v] {
    display: flex;
    width: 100%;
    min-height: 74px;

    align-items: center;

    padding: 11px;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 15px;

    text-align: left;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fafcfa
        );

    font-family: 'Kanit', sans-serif;
    cursor: pointer;
}

.decision-icon[b-ls36li0e4v] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    margin-right: 10px;

    border-radius: 13px;

    color: #b94741;
    background: #fdebea;
}

.decision-item.warning .decision-icon[b-ls36li0e4v] {
    color: #9d6818;
    background: #fff1d5;
}

.decision-item.info .decision-icon[b-ls36li0e4v] {
    color: #2c78a7;
    background: #e7f2f9;
}

.decision-item.success .decision-icon[b-ls36li0e4v] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.decision-copy[b-ls36li0e4v] {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

.decision-copy strong[b-ls36li0e4v] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.decision-copy small[b-ls36li0e4v] {
    overflow: hidden;

    margin: 2px 0;

    color: #84928d;
    font-size: .56rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.decision-copy em[b-ls36li0e4v] {
    color: #9ca7a2;
    font-size: .50rem;
    font-style: normal;
}

.decision-count[b-ls36li0e4v] {
    display: grid;
    min-width: 31px;
    height: 31px;

    place-items: center;

    margin-left: 8px;

    border-radius: 10px;

    color: #ffffff;
    background: #ca514b;

    font-size: .65rem;
    font-weight: 800;
}

.decision-footer[b-ls36li0e4v] {
    margin-top: 15px;
}

.executive-dashboard-page[b-ls36li0e4v]  .decision-button {
    min-height: 43px;

    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;
}

/* =========================================================
   QUICK LINKS
   ========================================================= */
.quick-links-section[b-ls36li0e4v] {
    margin-top: 24px;
}

.quick-links-heading[b-ls36li0e4v] {
    margin-bottom: 11px;
}

.quick-links-heading span[b-ls36li0e4v] {
    color: #9d7a36;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .11em;
}

.quick-links-heading h2[b-ls36li0e4v] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.17rem;
}

.quick-link-card[b-ls36li0e4v] {
    position: relative;

    display: grid;
    grid-template-columns:
        48px
        minmax(0, 1fr)
        auto;

    width: 100%;
    min-height: 94px;

    align-items: center;
    gap: 12px;

    padding: 14px;

    border:
        1px solid var(--border);

    border-radius: 18px;

    text-align: left;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            color-mix(in srgb, var(--theme-bg) 58%, white)
        );

    box-shadow:
        0 11px 28px rgba(5, 62, 46, .055);

    font-family: 'Kanit', sans-serif;
    cursor: pointer;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.quick-link-card:hover[b-ls36li0e4v] {
    transform:
        translateY(-3px);

    border-color:
        rgba(7, 88, 67, .20);

    box-shadow:
        0 16px 34px rgba(5, 62, 46, .10);
}

.quick-link-card > span[b-ls36li0e4v] {
    display: grid;
    width: 48px;
    height: 48px;

    place-items: center;

    border-radius: 15px;

    color: #ffffff;
    background: var(--theme-primary);
}

.quick-link-card.gold > span[b-ls36li0e4v] {
    background: #b9882f;
}

.quick-link-card.blue > span[b-ls36li0e4v] {
    background: #2b7fae;
}

.quick-link-card.red > span[b-ls36li0e4v] {
    background: #cf514b;
}

.quick-link-card > div[b-ls36li0e4v] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.quick-link-card strong[b-ls36li0e4v] {
    color: var(--theme-ink);
    font-size: .70rem;
}

.quick-link-card small[b-ls36li0e4v] {
    overflow: hidden;

    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .54rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.quick-link-arrow[b-ls36li0e4v] {
    color: #99a59f;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1180px) {
    .executive-hero[b-ls36li0e4v] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .hero-control-panel[b-ls36li0e4v] {
        max-width: 600px;
    }
}

@media (max-width: 880px) {
    .panel-heading[b-ls36li0e4v] {
        align-items: stretch;
        flex-direction: column;
    }

    .panel-link-button[b-ls36li0e4v],
    .panel-badge[b-ls36li0e4v],
    .score-badge[b-ls36li0e4v] {
        width: fit-content;
    }

    .project-card[b-ls36li0e4v] {
        grid-template-columns:
            46px
            minmax(0, 1fr)
            auto;
    }

    .project-date[b-ls36li0e4v] {
        grid-column:
            2 / 3;

        align-items: flex-start;
        text-align: left;
    }

    .project-arrow[b-ls36li0e4v] {
        grid-column: 3;
        grid-row: 1 / 3;
    }
}

@media (max-width: 760px) {
    .executive-dashboard-page[b-ls36li0e4v] {
        padding:
            15px 12px 30px;
    }

    .executive-hero[b-ls36li0e4v] {
        padding:
            28px 22px;

        border-radius: 23px;
    }

    .hero-content h1[b-ls36li0e4v] {
        font-size: 2.35rem;
    }

    .hero-meta[b-ls36li0e4v] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-ls36li0e4v] {
        width: 100%;
    }

    .satisfaction-hero[b-ls36li0e4v] {
        align-items: flex-start;
        flex-direction: column;
    }

    .budget-progress-heading[b-ls36li0e4v] {
        flex-direction: column;
    }

    .satisfaction-breakdown > div[b-ls36li0e4v] {
        grid-template-columns:
            95px
            minmax(0, 1fr)
            38px;
    }
}

@media (max-width: 520px) {
    .premium-panel[b-ls36li0e4v] {
        padding: 18px;
        border-radius: 19px;
    }

    .control-summary[b-ls36li0e4v] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .project-card[b-ls36li0e4v] {
        grid-template-columns:
            43px
            minmax(0, 1fr);
    }

    .project-date[b-ls36li0e4v] {
        grid-column:
            2;
    }

    .project-arrow[b-ls36li0e4v] {
        display: none;
    }

    .project-title-line[b-ls36li0e4v] {
        align-items: flex-start;
        flex-direction: column;
    }

    .satisfaction-breakdown > div[b-ls36li0e4v] {
        grid-template-columns:
            minmax(0, 1fr)
            35px;
    }

    .satisfaction-breakdown span[b-ls36li0e4v] {
        grid-column:
            1 / -1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .executive-kpi[b-ls36li0e4v],
    .project-card[b-ls36li0e4v],
    .quick-link-card[b-ls36li0e4v] {
        transition-duration:
            1ms !important;
    }
}
/* /Components/Pages/01Ziticen/01Daskboard/Notifications.razor.rz.scp.css */
.notification-page[b-566e4pa0hi] {
    --emerald-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --emerald-900: var(--theme-dark);
    --emerald-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --emerald-700: var(--theme-primary);
    --emerald-600: color-mix(in srgb, var(--theme-primary) 84%, var(--theme-light));
    --gold-500: var(--theme-accent);
    --gold-300: color-mix(in srgb, var(--theme-accent) 52%, white);
    --surface: #ffffff;
    --page-bg: var(--theme-bg);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;

    padding:
        24px 24px 44px;

    background:
        radial-gradient(
            circle at 1% 0%,
            rgba(201, 166, 93, .12),
            transparent 28rem
        ),
        radial-gradient(
            circle at 100% 4%,
            rgba(10, 106, 80, .09),
            transparent 32rem
        ),
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--theme-bg) 58%, white) 0%,
            var(--theme-bg) 100%
        );

    font-family: 'Kanit', sans-serif;
}

.notification-page[b-566e4pa0hi]  .notification-container {
    width: 100%;
    max-width: 1780px;

    margin: 0 auto;
    padding: 0 !important;
}

/* =========================================================
   HERO
   ========================================================= */
.notification-hero[b-566e4pa0hi] {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(320px, .55fr);

    min-height: 292px;

    align-items: center;
    gap: 28px;

    padding: 34px 38px;

    overflow: hidden;

    border:
        1px solid rgba(231, 207, 152, .22);

    border-radius: 29px;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 84% 0%,
            rgba(201, 166, 93, .20),
            transparent 27%
        ),
        radial-gradient(
            circle at 9% 115%,
            rgba(28, 138, 101, .22),
            transparent 34%
        ),
        linear-gradient(
            138deg,
            var(--theme-dark) 0%,
            color-mix(in srgb, var(--theme-dark) 86%, black) 58%,
            color-mix(in srgb, var(--theme-dark) 72%, black) 100%
        );

    box-shadow:
        0 28px 72px rgba(4, 54, 41, .24);
}

.hero-grid[b-566e4pa0hi] {
    position: absolute;
    inset: 0;

    opacity: .15;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .055) 1px,
            transparent 1px
        );

    background-size: 35px 35px;

    mask-image:
        linear-gradient(
            90deg,
            #000,
            transparent 88%
        );
}

.hero-gold-line[b-566e4pa0hi] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(231, 207, 152, .88),
            transparent
        );

    box-shadow:
        0 0 24px rgba(231, 207, 152, .42);
}

.hero-copy[b-566e4pa0hi] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-566e4pa0hi] {
    display: inline-flex;
    width: fit-content;

    align-items: center;
    gap: 10px;

    margin-bottom: 18px;

    padding:
        8px 13px 8px 8px;

    border:
        1px solid rgba(231, 207, 152, .24);

    border-radius: 999px;

    background:
        rgba(255, 255, 255, .055);

    backdrop-filter:
        blur(12px);
}

.hero-badge > span[b-566e4pa0hi] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);

    background:
        rgba(201, 166, 93, .14);
}

.hero-badge > div[b-566e4pa0hi] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-566e4pa0hi] {
    color:
        rgba(255, 255, 255, .52);

    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-566e4pa0hi] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-copy h1[b-566e4pa0hi] {
    margin: 0;

    color: #ffffff;
    font-size: clamp(2.15rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-copy p[b-566e4pa0hi] {
    max-width: 940px;

    margin: 17px 0 0;

    color:
        rgba(255, 255, 255, .66);

    font-size:
        clamp(.82rem, 1.08vw, 1rem);

    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-566e4pa0hi] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;

    margin-top: 22px;
}

.hero-meta > span[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 37px;

    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border:
        1px solid rgba(255, 255, 255, .10);

    border-radius: 12px;

    color:
        rgba(255, 255, 255, .63);

    background:
        rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-566e4pa0hi] {
    position: relative;
    z-index: 3;

    padding: 20px;

    border:
        1px solid rgba(255, 255, 255, .14);

    border-radius: 22px;

    color: var(--ink);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .985),
            rgba(242, 247, 244, .955)
        );

    box-shadow:
        0 24px 52px rgba(0, 0, 0, .18);
}

.hero-live[b-566e4pa0hi] {
    display: flex;
    align-items: center;
    gap: 11px;

    padding-bottom: 15px;

    border-bottom:
        1px solid rgba(7, 88, 67, .09);
}

.live-dot[b-566e4pa0hi] {
    width: 10px;
    height: 10px;

    border-radius: 50%;

    background: var(--theme-light);

    box-shadow:
        0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-live > div[b-566e4pa0hi] {
    display: flex;
    flex-direction: column;
}

.hero-live strong[b-566e4pa0hi] {
    color: #195d48;
    font-size: .73rem;
}

.hero-live small[b-566e4pa0hi] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .57rem;
}

.hero-action-buttons[b-566e4pa0hi] {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 9px;

    margin-top: 15px;
}

.notification-page[b-566e4pa0hi]  .hero-primary-button {
    min-height: 44px;

    border-radius: 13px !important;

    color: #f6dda4 !important;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;

    box-shadow:
        0 10px 23px rgba(4, 61, 47, .20);
}

.notification-page[b-566e4pa0hi]  .hero-refresh-button {
    width: 44px;
    height: 44px;

    border:
        1px solid rgba(7, 88, 67, .12);

    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));

    background: #ffffff;
}

.hero-timestamp[b-566e4pa0hi] {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-top: 12px;

    color: var(--theme-muted);
    font-size: .57rem;
}

.notification-page[b-566e4pa0hi]  .notification-loading {
    margin:
        -4px 27px 0;

    border-radius:
        0 0 10px 10px;
}

.notification-page[b-566e4pa0hi]  .notification-error {
    margin-top: 18px;

    border-radius: 15px !important;
}

/* =========================================================
   SUMMARY
   ========================================================= */
.summary-grid[b-566e4pa0hi] {
    margin-top: 7px;
}

.summary-card[b-566e4pa0hi] {
    position: relative;

    display: flex;
    min-height: 152px;

    align-items: center;
    gap: 15px;

    padding: 20px;

    overflow: hidden;

    border:
        1px solid var(--border);

    border-radius: 21px;

    color: var(--theme-primary);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(247, 250, 248, .97)
        );

    box-shadow: var(--shadow);

    transition:
        transform .20s ease,
        box-shadow .20s ease;
}

.summary-card:hover[b-566e4pa0hi] {
    transform:
        translateY(-3px);

    box-shadow:
        0 20px 45px rgba(5, 62, 46, .11);
}

.summary-line[b-566e4pa0hi] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;

    opacity: .54;

    background:
        linear-gradient(
            90deg,
            transparent,
            currentColor,
            transparent
        );
}

.summary-card.unread[b-566e4pa0hi] {
    color: #297da9;
}

.summary-card.urgent[b-566e4pa0hi] {
    color: #cc514b;
}

.summary-card.today[b-566e4pa0hi] {
    color: #b6862d;
}

.summary-icon[b-566e4pa0hi] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 17px;

    color: #ffffff;
    background: currentColor;

    box-shadow:
        0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-566e4pa0hi] {
    min-width: 0;
}

.summary-card small[b-566e4pa0hi] {
    color: var(--theme-muted);
    font-size: .70rem;
    font-weight: 550;
}

.summary-card p[b-566e4pa0hi] {
    display: flex;
    align-items: baseline;
    gap: 7px;

    margin: 4px 0 0;
}

.summary-card p strong[b-566e4pa0hi] {
    color: var(--ink);
    font-size: 1.85rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-566e4pa0hi] {
    color: var(--theme-muted);
    font-size: .62rem;
}

.summary-card em[b-566e4pa0hi] {
    display: block;

    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .55rem;
    font-style: normal;
}

/* =========================================================
   FILTER
   ========================================================= */
.filter-panel[b-566e4pa0hi] {
    margin-top: 24px;
    padding: 22px;

    border:
        1px solid var(--border);

    border-radius: 23px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(247, 250, 248, .97)
        );

    box-shadow: var(--shadow);
}

.filter-heading[b-566e4pa0hi] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 17px;
}

.filter-heading > div > span[b-566e4pa0hi] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-566e4pa0hi] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-566e4pa0hi] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .64rem;
}

.clear-filter-button[b-566e4pa0hi],
.toolbar-button[b-566e4pa0hi],
.view-tab[b-566e4pa0hi] {
    font-family: 'Kanit', sans-serif;
    cursor: pointer;
}

.clear-filter-button[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border:
        1px solid rgba(7, 88, 67, .11);

    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-size: .61rem;
}

.filter-grid[b-566e4pa0hi] {
    align-items: center;
}

.notification-page[b-566e4pa0hi]  .premium-field {
    width: 100%;
}

.notification-page[b-566e4pa0hi]  .premium-field .mud-input-outlined-border {
    border-color:
        rgba(7, 88, 67, .13);
}

.notification-page[b-566e4pa0hi]  .search-button {
    min-height: 56px;

    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;
}

/* =========================================================
   WORKSPACE
   ========================================================= */
.notification-workspace[b-566e4pa0hi] {
    margin-top: 24px;

    border:
        1px solid var(--border);

    border-radius: 24px;

    overflow: hidden;

    background: #ffffff;

    box-shadow:
        0 18px 48px rgba(5, 62, 46, .08);
}

.notification-toolbar[b-566e4pa0hi] {
    display: flex;

    align-items: center;
    justify-content: space-between;
    gap: 18px;

    min-height: 68px;

    padding: 12px 17px;

    border-bottom:
        1px solid rgba(7, 88, 67, .09);

    background:
        linear-gradient(
            145deg,
            color-mix(in srgb, var(--theme-bg) 42%, white),
            var(--theme-bg)
        );
}

.view-tabs[b-566e4pa0hi],
.toolbar-actions[b-566e4pa0hi] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-tabs[b-566e4pa0hi] {
    overflow-x: auto;
}

.view-tab[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border:
        1px solid transparent;

    border-radius: 12px;

    color: #657870;
    background: transparent;

    white-space: nowrap;
    font-size: .64rem;

    transition:
        color .17s ease,
        border-color .17s ease,
        background .17s ease;
}

.view-tab em[b-566e4pa0hi] {
    display: grid;
    min-width: 21px;
    height: 21px;

    place-items: center;

    padding: 0 5px;

    border-radius: 999px;

    color: #6b7b75;
    background: var(--theme-border);

    font-size: .52rem;
    font-style: normal;
}

.view-tab.active[b-566e4pa0hi] {
    color: #ffffff;

    border-color:
        rgba(198, 161, 91, .34);

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        );

    box-shadow:
        0 9px 20px rgba(4, 61, 47, .18);
}

.view-tab.active em[b-566e4pa0hi] {
    color: #775719;
    background: #f2d89d;
}

.toolbar-actions[b-566e4pa0hi] {
    justify-content: flex-end;
    flex-wrap: wrap;
}

.selected-count[b-566e4pa0hi] {
    color: #6e7f78;
    font-size: .60rem;
}

.toolbar-button[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    gap: 6px;

    padding: 0 9px;

    border:
        1px solid rgba(7, 88, 67, .11);

    border-radius: 11px;

    color: #5f746b;
    background: #ffffff;

    font-size: .59rem;
}

.toolbar-button.success[b-566e4pa0hi] {
    color: var(--theme-primary);
    background: #eaf7f1;
}

.toolbar-button.danger[b-566e4pa0hi] {
    color: #b24640;
    background: #fff0ef;
}

.workspace-grid[b-566e4pa0hi] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(320px, .65fr);

    min-height: 680px;
}

.notification-list-panel[b-566e4pa0hi] {
    min-width: 0;
    padding: 19px;

    border-right:
        1px solid rgba(7, 88, 67, .09);

    background: #f9fbfa;
}

.list-header[b-566e4pa0hi] {
    display: flex;

    align-items: center;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 13px;
}

.list-header h2[b-566e4pa0hi] {
    margin: 0;

    color: var(--ink);
    font-size: 1rem;
    font-weight: 700;
}

.list-header p[b-566e4pa0hi] {
    margin: 2px 0 0;

    color: #86948e;
    font-size: .59rem;
}

.notification-page[b-566e4pa0hi]  .sort-select {
    width: 155px;
}

.notification-list[b-566e4pa0hi] {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.notification-card[b-566e4pa0hi] {
    position: relative;

    display: grid;
    grid-template-columns:
        25px
        48px
        minmax(0, 1fr)
        auto;

    min-height: 104px;

    align-items: center;
    gap: 11px;

    padding: 13px;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 17px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            color-mix(in srgb, var(--theme-bg) 42%, white)
        );

    box-shadow:
        0 8px 22px rgba(5, 62, 46, .045);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.notification-card:hover[b-566e4pa0hi] {
    transform:
        translateY(-2px);

    border-color:
        rgba(7, 88, 67, .21);

    box-shadow:
        0 13px 29px rgba(5, 62, 46, .085);
}

.notification-card.is-unread[b-566e4pa0hi] {
    border-left:
        4px solid #0d7b5b;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f1faf6
        );
}

.notification-card.priority-critical[b-566e4pa0hi] {
    border-left-color: #cb4e48;
}

.notification-card.priority-high[b-566e4pa0hi] {
    border-left-color: #d49431;
}

.notification-selector[b-566e4pa0hi] {
    display: grid;
    width: 23px;
    height: 23px;

    place-items: center;

    cursor: pointer;
}

.notification-selector input[b-566e4pa0hi] {
    position: absolute;
    opacity: 0;
}

.notification-selector span[b-566e4pa0hi] {
    position: relative;

    display: block;
    width: 18px;
    height: 18px;

    border:
        1px solid #cbd8d2;

    border-radius: 6px;

    background: #ffffff;
}

.notification-selector input:checked + span[b-566e4pa0hi] {
    border-color: #0a7757;
    background: #0a7757;
}

.notification-selector input:checked + span[b-566e4pa0hi]::after {
    content: "";

    position: absolute;
    top: 3px;
    left: 6px;

    width: 4px;
    height: 8px;

    border:
        solid #ffffff;

    border-width:
        0 2px 2px 0;

    transform:
        rotate(45deg);
}

.notification-icon[b-566e4pa0hi],
.notification-main[b-566e4pa0hi] {
    border: 0;
    font-family: 'Kanit', sans-serif;
    cursor: pointer;
}

.notification-icon[b-566e4pa0hi] {
    display: grid;
    width: 48px;
    height: 48px;

    place-items: center;

    border-radius: 15px;

    color: #ffffff;
    background: #0b7657;

    box-shadow:
        0 9px 20px rgba(5, 62, 46, .16);
}

.notification-icon.complaint[b-566e4pa0hi],
.detail-icon.complaint[b-566e4pa0hi] {
    background: #7758a6;
}

.notification-icon.repair[b-566e4pa0hi],
.detail-icon.repair[b-566e4pa0hi] {
    background: #d77f2d;
}

.notification-icon.emergency[b-566e4pa0hi],
.detail-icon.emergency[b-566e4pa0hi] {
    background: #cb4f49;
}

.notification-icon.payment[b-566e4pa0hi],
.detail-icon.payment[b-566e4pa0hi] {
    background: #b4872f;
}

.notification-icon.approval[b-566e4pa0hi],
.detail-icon.approval[b-566e4pa0hi] {
    background: #2c78a7;
}

.notification-icon.news[b-566e4pa0hi],
.detail-icon.news[b-566e4pa0hi] {
    background: #258a80;
}

.notification-icon.system[b-566e4pa0hi],
.detail-icon.system[b-566e4pa0hi] {
    background: #566f80;
}

.notification-main[b-566e4pa0hi] {
    display: flex;
    min-width: 0;

    align-items: flex-start;
    flex-direction: column;

    padding: 0;

    color: inherit;
    text-align: left;
    background: transparent;
}

.notification-title-line[b-566e4pa0hi] {
    display: flex;
    max-width: 100%;

    align-items: center;
    gap: 7px;
}

.notification-title-line strong[b-566e4pa0hi] {
    overflow: hidden;

    color: #223f35;
    font-size: .76rem;
    font-weight: 680;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.unread-dot[b-566e4pa0hi] {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #13a071;

    box-shadow:
        0 0 0 4px rgba(19, 160, 113, .10);
}

.notification-message[b-566e4pa0hi] {
    display: -webkit-box;
    overflow: hidden;

    max-width: 100%;
    margin-top: 4px;

    color: #6e7f78;
    font-size: .63rem;
    line-height: 1.5;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.notification-meta[b-566e4pa0hi] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;

    margin-top: 7px;
}

.notification-meta em[b-566e4pa0hi] {
    display: inline-flex;
    align-items: center;
    gap: 4px;

    color: #94a09b;
    font-size: .53rem;
    font-style: normal;
}

.notification-side[b-566e4pa0hi] {
    display: flex;
    min-width: 92px;

    align-items: flex-end;
    flex-direction: column;
    gap: 8px;
}

.priority-badge[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: #65756f;
    background: #edf2ef;

    font-size: .52rem;
    font-weight: 650;
}

.priority-badge.critical[b-566e4pa0hi] {
    color: #a33d38;
    background: #fee9e8;
}

.priority-badge.high[b-566e4pa0hi] {
    color: #986618;
    background: #fff1d5;
}

.priority-badge.normal[b-566e4pa0hi] {
    color: #0b7255;
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.priority-badge.low[b-566e4pa0hi] {
    color: #60756c;
    background: #edf2ef;
}

.notification-menu[b-566e4pa0hi] {
    display: flex;
    gap: 2px;
}

.notification-page[b-566e4pa0hi]  .list-action-button {
    color: #71817b;
}

.notification-page[b-566e4pa0hi]  .list-action-button.delete {
    color: #ad4b45;
}

.pagination-bar[b-566e4pa0hi] {
    display: flex;

    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top:
        1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.notification-page[b-566e4pa0hi]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-notification[b-566e4pa0hi] {
    display: flex;
    min-height: 480px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-notification > span[b-566e4pa0hi] {
    display: grid;
    width: 72px;
    height: 72px;

    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-notification h3[b-566e4pa0hi] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .88rem;
}

.empty-notification p[b-566e4pa0hi] {
    max-width: 390px;

    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

/* =========================================================
   DETAIL
   ========================================================= */
.notification-detail-panel[b-566e4pa0hi] {
    position: relative;

    min-width: 0;

    padding: 22px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .11),
            transparent 18rem
        ),
        linear-gradient(
            180deg,
            #ffffff,
            color-mix(in srgb, var(--theme-bg) 58%, white)
        );
}

.detail-empty[b-566e4pa0hi] {
    display: flex;
    min-height: 620px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 34px;
    text-align: center;
}

.detail-empty > span[b-566e4pa0hi] {
    display: grid;
    width: 78px;
    height: 78px;

    place-items: center;

    border:
        1px solid rgba(198, 161, 91, .24);

    border-radius: 24px;

    color: #b18a39;

    background:
        linear-gradient(
            145deg,
            #fff9e9,
            #f1e4c4
        );

    box-shadow:
        0 14px 30px rgba(138, 100, 25, .10);
}

.detail-empty h3[b-566e4pa0hi] {
    margin: 16px 0 0;

    color: #345348;
    font-size: .88rem;
}

.detail-empty p[b-566e4pa0hi] {
    max-width: 340px;

    margin: 6px 0 0;

    color: #87958f;
    font-size: .63rem;
    line-height: 1.65;
}

.detail-header[b-566e4pa0hi] {
    display: grid;
    grid-template-columns:
        52px
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: 12px;

    padding-bottom: 17px;

    border-bottom:
        1px solid rgba(7, 88, 67, .09);
}

.detail-icon[b-566e4pa0hi] {
    display: grid;
    width: 52px;
    height: 52px;

    place-items: center;

    border-radius: 16px;

    color: #ffffff;
    background: #0b7657;

    box-shadow:
        0 10px 24px rgba(5, 62, 46, .18);
}

.detail-header small[b-566e4pa0hi] {
    color: #a07c35;
    font-size: .53rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.detail-header h2[b-566e4pa0hi] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1rem;
    font-weight: 720;
    line-height: 1.35;
}

.detail-status-line[b-566e4pa0hi] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 16px;
}

.read-status[b-566e4pa0hi] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    color: #0b7255;
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .52rem;
}

.read-status.read[b-566e4pa0hi] {
    color: #687a72;
    background: #edf2ef;
}

.detail-message[b-566e4pa0hi] {
    margin-top: 19px;

    color: var(--theme-ink);
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.65;
}

.detail-description[b-566e4pa0hi] {
    margin-top: 11px;
    padding: 14px;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 14px;

    color: #697b74;
    background: #f6f9f7;

    font-size: .64rem;
    line-height: 1.75;
}

.detail-information[b-566e4pa0hi] {
    display: grid;
    gap: 0;

    margin: 19px 0 0;

    border:
        1px solid rgba(7, 88, 67, .09);

    border-radius: 15px;

    overflow: hidden;
}

.detail-information > div[b-566e4pa0hi] {
    display: grid;
    grid-template-columns:
        125px
        minmax(0, 1fr);

    gap: 12px;

    padding: 11px 13px;

    border-bottom:
        1px solid rgba(7, 88, 67, .07);
}

.detail-information > div:last-child[b-566e4pa0hi] {
    border-bottom: 0;
}

.detail-information dt[b-566e4pa0hi] {
    color: var(--theme-muted);
    font-size: .58rem;
}

.detail-information dd[b-566e4pa0hi] {
    margin: 0;

    color: #365248;
    font-size: .61rem;
    font-weight: 550;
}

.detail-actions[b-566e4pa0hi] {
    display: flex;
    flex-direction: column;
    gap: 9px;

    margin-top: 19px;
}

.notification-page[b-566e4pa0hi]  .detail-read-button,
.notification-page[b-566e4pa0hi]  .detail-open-button {
    min-height: 43px;
    border-radius: 13px !important;
}

.notification-page[b-566e4pa0hi]  .detail-read-button {
    color: var(--theme-primary) !important;
    border-color:
        rgba(7, 88, 67, .20) !important;
}

.notification-page[b-566e4pa0hi]  .detail-open-button {
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;

    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark)
        ) !important;
}

.detail-security-note[b-566e4pa0hi] {
    display: flex;
    align-items: flex-start;
    gap: 7px;

    margin-top: 17px;
    padding-top: 14px;

    border-top:
        1px dashed rgba(7, 88, 67, .13);

    color: #91a09a;
    font-size: .54rem;
    line-height: 1.55;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1180px) {
    .workspace-grid[b-566e4pa0hi] {
        grid-template-columns:
            minmax(0, 1.3fr)
            minmax(300px, .7fr);
    }

    .notification-toolbar[b-566e4pa0hi] {
        align-items: flex-start;
        flex-direction: column;
    }

    .toolbar-actions[b-566e4pa0hi] {
        justify-content: flex-start;
    }
}

@media (max-width: 980px) {
    .notification-hero[b-566e4pa0hi] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .hero-action-panel[b-566e4pa0hi] {
        max-width: 570px;
    }

    .workspace-grid[b-566e4pa0hi] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .notification-list-panel[b-566e4pa0hi] {
        border-right: 0;
        border-bottom:
            1px solid rgba(7, 88, 67, .09);
    }

    .detail-empty[b-566e4pa0hi] {
        min-height: 330px;
    }
}

@media (max-width: 760px) {
    .notification-page[b-566e4pa0hi] {
        padding:
            15px 12px 30px;
    }

    .notification-hero[b-566e4pa0hi] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-copy h1[b-566e4pa0hi] {
        font-size: 2.25rem;
    }

    .hero-meta[b-566e4pa0hi] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-566e4pa0hi] {
        width: 100%;
    }

    .filter-heading[b-566e4pa0hi],
    .list-header[b-566e4pa0hi] {
        align-items: stretch;
        flex-direction: column;
    }

    .notification-page[b-566e4pa0hi]  .sort-select {
        width: 100%;
    }

    .view-tabs[b-566e4pa0hi] {
        width: 100%;
        padding-bottom: 4px;
    }

    .toolbar-actions[b-566e4pa0hi] {
        width: 100%;
    }

    .notification-card[b-566e4pa0hi] {
        grid-template-columns:
            23px
            45px
            minmax(0, 1fr);

        align-items: start;
    }

    .notification-side[b-566e4pa0hi] {
        grid-column:
            2 / -1;

        width: 100%;
        min-width: 0;

        align-items: center;
        justify-content: space-between;
        flex-direction: row;
    }

    .notification-meta[b-566e4pa0hi] {
        flex-direction: column;
        gap: 4px;
    }

    .pagination-bar[b-566e4pa0hi] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 500px) {
    .notification-card[b-566e4pa0hi] {
        padding: 11px;
        gap: 9px;
    }

    .notification-icon[b-566e4pa0hi] {
        width: 43px;
        height: 43px;
    }

    .filter-panel[b-566e4pa0hi],
    .notification-list-panel[b-566e4pa0hi],
    .notification-detail-panel[b-566e4pa0hi] {
        padding: 16px;
    }

    .detail-information > div[b-566e4pa0hi] {
        grid-template-columns:
            minmax(0, 1fr);

        gap: 3px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-566e4pa0hi],
    .notification-card[b-566e4pa0hi],
    .view-tab[b-566e4pa0hi] {
        transition-duration:
            1ms !important;
    }
}
/* /Components/Pages/01Ziticen/02Citizens/CitizenRegistration.razor.rz.scp.css */
.registration-page[b-xsspfzgvl8] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.registration-page[b-xsspfzgvl8]  .registration-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.registration-hero[b-xsspfzgvl8] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-xsspfzgvl8] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-xsspfzgvl8] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-xsspfzgvl8] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-xsspfzgvl8] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-xsspfzgvl8] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-xsspfzgvl8] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-xsspfzgvl8] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-xsspfzgvl8] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-xsspfzgvl8] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-xsspfzgvl8] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-xsspfzgvl8] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-xsspfzgvl8] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-xsspfzgvl8] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-xsspfzgvl8] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-xsspfzgvl8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.registration-page[b-xsspfzgvl8]  .hero-add-button,
.registration-page[b-xsspfzgvl8]  .search-button,
.registration-page[b-xsspfzgvl8]  .toolbar-add-button,
.registration-page[b-xsspfzgvl8]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.registration-page[b-xsspfzgvl8]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-xsspfzgvl8] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-xsspfzgvl8] {
    opacity: .55;
    cursor: not-allowed;
}

.registration-page[b-xsspfzgvl8]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.registration-page[b-xsspfzgvl8]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-xsspfzgvl8] {
    margin-top: 7px;
}

.summary-card[b-xsspfzgvl8] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-xsspfzgvl8] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-xsspfzgvl8] {
    color: #2c7da8;
}

.summary-card.approved[b-xsspfzgvl8] {
    color: #7658a7;
}

.summary-card.incomplete[b-xsspfzgvl8] {
    color: #c05b4e;
}

.summary-line[b-xsspfzgvl8] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-xsspfzgvl8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-xsspfzgvl8] {
    min-width: 0;
}

.summary-card small[b-xsspfzgvl8] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-xsspfzgvl8] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-xsspfzgvl8] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-xsspfzgvl8] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-xsspfzgvl8] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-xsspfzgvl8],
.registration-list-panel[b-xsspfzgvl8] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-xsspfzgvl8],
.list-toolbar[b-xsspfzgvl8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-xsspfzgvl8],
.panel-kicker[b-xsspfzgvl8] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-xsspfzgvl8],
.list-toolbar h2[b-xsspfzgvl8] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-xsspfzgvl8],
.list-toolbar p[b-xsspfzgvl8] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-xsspfzgvl8] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-xsspfzgvl8] {
    align-items: center;
}

.registration-page[b-xsspfzgvl8]  .premium-field,
.registration-page[b-xsspfzgvl8]  .form-field {
    width: 100%;
}

.registration-page[b-xsspfzgvl8]  .premium-field .mud-input-outlined-border,
.registration-page[b-xsspfzgvl8]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.registration-page[b-xsspfzgvl8]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.registration-page[b-xsspfzgvl8]  .sort-select {
    width: 160px;
}

.registration-page[b-xsspfzgvl8]  .toolbar-add-button {
    min-height: 42px;
}

.registration-page[b-xsspfzgvl8]  .registration-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.registration-page[b-xsspfzgvl8]  .registration-table .mud-table-head {
    background: #eef6f2;
}

.registration-page[b-xsspfzgvl8]  .registration-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.registration-no[b-xsspfzgvl8] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-xsspfzgvl8] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-xsspfzgvl8],
.view-avatar[b-xsspfzgvl8] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-xsspfzgvl8],
.view-avatar.female[b-xsspfzgvl8] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-xsspfzgvl8],
.view-avatar.other[b-xsspfzgvl8] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-xsspfzgvl8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-xsspfzgvl8],
.person-name small[b-xsspfzgvl8] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-xsspfzgvl8] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-xsspfzgvl8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-xsspfzgvl8] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-xsspfzgvl8] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-xsspfzgvl8],
.area-cell[b-xsspfzgvl8],
.date-cell[b-xsspfzgvl8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-xsspfzgvl8] {
    gap: 3px;
}

.contact-cell span[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-xsspfzgvl8],
.date-cell strong[b-xsspfzgvl8] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-xsspfzgvl8],
.date-cell small[b-xsspfzgvl8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-xsspfzgvl8],
.document-chip[b-xsspfzgvl8],
.status-chip[b-xsspfzgvl8] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-xsspfzgvl8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-xsspfzgvl8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-xsspfzgvl8] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-xsspfzgvl8] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-xsspfzgvl8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-xsspfzgvl8] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-xsspfzgvl8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-xsspfzgvl8] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-xsspfzgvl8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-xsspfzgvl8] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-xsspfzgvl8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-xsspfzgvl8] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.registration-page[b-xsspfzgvl8]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.registration-page[b-xsspfzgvl8]  .row-action.view {
    color: #2d79a2;
}

.registration-page[b-xsspfzgvl8]  .row-action.edit {
    color: var(--theme-primary);
}

.registration-page[b-xsspfzgvl8]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.registration-page[b-xsspfzgvl8]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-xsspfzgvl8] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-xsspfzgvl8] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-xsspfzgvl8] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-xsspfzgvl8] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-xsspfzgvl8] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.registration-form-modal[b-xsspfzgvl8],
.registration-view-modal[b-xsspfzgvl8],
.delete-modal[b-xsspfzgvl8] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-xsspfzgvl8 .22s ease-out;
}

@keyframes modalAppear-b-xsspfzgvl8 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.registration-form-modal[b-xsspfzgvl8] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-xsspfzgvl8] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-xsspfzgvl8] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-xsspfzgvl8] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-xsspfzgvl8] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-xsspfzgvl8] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-xsspfzgvl8] {
    margin-top: 24px;
}

.form-section-title > span[b-xsspfzgvl8] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-xsspfzgvl8] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-xsspfzgvl8] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-xsspfzgvl8] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-xsspfzgvl8] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-xsspfzgvl8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.registration-page[b-xsspfzgvl8]  .cancel-button,
.registration-page[b-xsspfzgvl8]  .save-button,
.registration-page[b-xsspfzgvl8]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.registration-page[b-xsspfzgvl8]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.registration-page[b-xsspfzgvl8]  .save-button {
    min-width: 170px;
}

.registration-view-modal[b-xsspfzgvl8] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-xsspfzgvl8] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-xsspfzgvl8] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-xsspfzgvl8] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-xsspfzgvl8] {
    padding: 61px 24px 25px;
}

.view-heading[b-xsspfzgvl8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-xsspfzgvl8] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-xsspfzgvl8] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-xsspfzgvl8] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-xsspfzgvl8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-xsspfzgvl8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-xsspfzgvl8] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-xsspfzgvl8],
.view-address small[b-xsspfzgvl8],
.view-note small[b-xsspfzgvl8] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-xsspfzgvl8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-xsspfzgvl8] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-xsspfzgvl8] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-xsspfzgvl8] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-xsspfzgvl8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-xsspfzgvl8] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-xsspfzgvl8] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-xsspfzgvl8] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-xsspfzgvl8] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-xsspfzgvl8] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-xsspfzgvl8] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-xsspfzgvl8] {
    color: #963b36;
}

.delete-warning[b-xsspfzgvl8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-xsspfzgvl8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.registration-page[b-xsspfzgvl8]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .registration-hero[b-xsspfzgvl8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-xsspfzgvl8] {
        max-width: 570px;
    }

    .list-toolbar[b-xsspfzgvl8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-xsspfzgvl8] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .registration-page[b-xsspfzgvl8] {
        padding: 15px 12px 30px;
    }

    .registration-hero[b-xsspfzgvl8] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-xsspfzgvl8] {
        font-size: 2.3rem;
    }

    .hero-meta[b-xsspfzgvl8] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-xsspfzgvl8] {
        width: 100%;
    }

    .filter-heading[b-xsspfzgvl8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-xsspfzgvl8] {
        align-items: stretch;
        flex-direction: column;
    }

    .registration-page[b-xsspfzgvl8]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-xsspfzgvl8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-xsspfzgvl8] {
        align-items: end;
        padding: 0;
    }

    .registration-form-modal[b-xsspfzgvl8],
    .registration-view-modal[b-xsspfzgvl8] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-xsspfzgvl8] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-xsspfzgvl8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-xsspfzgvl8],
    .registration-list-panel[b-xsspfzgvl8] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-xsspfzgvl8] {
        align-items: flex-start;
    }

    .modal-icon[b-xsspfzgvl8] {
        display: none;
    }

    .modal-footer[b-xsspfzgvl8] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .registration-page[b-xsspfzgvl8]  .save-button {
        min-width: 0;
    }

    .view-heading[b-xsspfzgvl8] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-xsspfzgvl8],
    .registration-form-modal[b-xsspfzgvl8],
    .registration-view-modal[b-xsspfzgvl8],
    .delete-modal[b-xsspfzgvl8] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}
/* /Components/Pages/01Ziticen/02Citizens/Citizens.razor.rz.scp.css */
.citizen-page[b-f45mpn7tf3] {
    --emerald-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --emerald-900: var(--theme-dark);
    --emerald-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --emerald-700: var(--theme-primary);
    --gold-500: var(--theme-accent);
    --gold-300: color-mix(in srgb, var(--theme-accent) 52%, white);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);
    min-height: 100%;
    padding: 24px 24px 44px;
    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);
    font-family: 'Kanit', sans-serif;
}

.citizen-page[b-f45mpn7tf3]  .citizen-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.citizen-hero[b-f45mpn7tf3] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 290px;
    align-items: center;
    gap: 28px;
    padding: 36px 38px;
    overflow: hidden;
    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;
    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);
    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-f45mpn7tf3] {
    position: absolute;
    inset: 0;
    opacity: .15;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-f45mpn7tf3] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(231,207,152,.88), transparent);
    box-shadow: 0 0 24px rgba(231,207,152,.42);
}

.hero-content[b-f45mpn7tf3],
.hero-action-panel[b-f45mpn7tf3] { position: relative; z-index: 2; }

.hero-badge[b-f45mpn7tf3] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;
    border: 1px solid rgba(231,207,152,.24);
    border-radius: 999px;
    background: rgba(255,255,255,.055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-f45mpn7tf3] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201,166,93,.14);
}

.hero-badge > div[b-f45mpn7tf3],
.hero-status > div[b-f45mpn7tf3] { display: flex; flex-direction: column; }
.hero-badge small[b-f45mpn7tf3] { color: rgba(255,255,255,.52); font-size: .53rem; letter-spacing: .11em; }
.hero-badge strong[b-f45mpn7tf3] { color: color-mix(in srgb, var(--theme-accent) 62%, white); font-size: .68rem; }
.hero-content h1[b-f45mpn7tf3] { margin: 0; color: #fff; font-size: clamp(2.2rem, 3.8vw, 4.2rem); font-weight: 800; line-height: 1.04; letter-spacing: -.035em; }
.hero-content p[b-f45mpn7tf3] { max-width: 920px; margin: 17px 0 0; color: rgba(255,255,255,.66); font-size: clamp(.83rem,1.08vw,1rem); line-height: 1.75; }

.hero-meta[b-f45mpn7tf3] { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 23px; }
.hero-meta > span[b-f45mpn7tf3] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    color: rgba(255,255,255,.63);
    background: rgba(255,255,255,.045);
    font-size: .63rem;
}

.hero-action-panel[b-f45mpn7tf3] {
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 22px;
    color: var(--ink);
    background: linear-gradient(145deg, rgba(255,255,255,.985), rgba(242,247,244,.955));
    box-shadow: 0 24px 52px rgba(0,0,0,.18);
}

.hero-status[b-f45mpn7tf3] { display: flex; align-items: center; gap: 11px; margin-bottom: 3px; padding-bottom: 14px; border-bottom: 1px solid rgba(7,88,67,.09); }
.status-dot[b-f45mpn7tf3] { width: 10px; height: 10px; border-radius: 50%; background: var(--theme-light); box-shadow: 0 0 0 6px rgba(50,205,135,.12); }
.hero-status strong[b-f45mpn7tf3] { color: #195d48; font-size: .72rem; }
.hero-status small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .56rem; }

.citizen-page[b-f45mpn7tf3]  .add-citizen-button,
.citizen-page[b-f45mpn7tf3]  .toolbar-add-button,
.citizen-page[b-f45mpn7tf3]  .search-button,
.citizen-page[b-f45mpn7tf3]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4,61,47,.20);
}

.citizen-page[b-f45mpn7tf3]  .add-citizen-button { min-height: 45px; }
.citizen-page[b-f45mpn7tf3]  .search-button { min-height: 56px; }
.citizen-page[b-f45mpn7tf3]  .toolbar-add-button { min-height: 42px; }
.citizen-page[b-f45mpn7tf3]  .save-button { min-height: 42px; min-width: 160px; }

.refresh-button[b-f45mpn7tf3],
.clear-filter-button[b-f45mpn7tf3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid rgba(7,88,67,.12);
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;
    font-family: 'Kanit', sans-serif;
    cursor: pointer;
}
.refresh-button[b-f45mpn7tf3] { min-height: 42px; font-size: .64rem; }
.clear-filter-button[b-f45mpn7tf3] { min-height: 36px; padding: 0 10px; font-size: .61rem; }
.refresh-button:disabled[b-f45mpn7tf3] { opacity: .55; cursor: not-allowed; }

.citizen-page[b-f45mpn7tf3]  .page-loading { margin: -4px 27px 0; border-radius: 0 0 10px 10px; }
.citizen-page[b-f45mpn7tf3]  .page-error { margin-top: 18px; border-radius: 15px !important; }

.summary-grid[b-f45mpn7tf3] { margin-top: 7px; }
.summary-card[b-f45mpn7tf3] {
    position: relative;
    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 21px;
    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,250,248,.97));
    box-shadow: var(--shadow);
    transition: transform .2s ease, box-shadow .2s ease;
}
.summary-card:hover[b-f45mpn7tf3] { transform: translateY(-3px); box-shadow: 0 20px 45px rgba(5,62,46,.11); }
.summary-card.household[b-f45mpn7tf3] { color: #2c7da8; }
.summary-card.business[b-f45mpn7tf3] { color: #b6862d; }
.summary-card.active[b-f45mpn7tf3] { color: #7658a7; }
.summary-line[b-f45mpn7tf3] { position: absolute; top: 0; left: 20px; right: 20px; height: 2px; opacity: .54; background: linear-gradient(90deg, transparent, currentColor, transparent); }
.summary-icon[b-f45mpn7tf3] { display: grid; flex: 0 0 54px; width: 54px; height: 54px; place-items: center; border-radius: 17px; color: #fff; background: currentColor; box-shadow: 0 11px 24px rgba(0,0,0,.13); }
.summary-card small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .69rem; }
.summary-card p[b-f45mpn7tf3] { display: flex; align-items: baseline; gap: 7px; margin: 4px 0 0; }
.summary-card p strong[b-f45mpn7tf3] { color: var(--ink); font-size: 1.82rem; font-weight: 800; }
.summary-card p span[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .61rem; }
.summary-card em[b-f45mpn7tf3] { display: block; margin-top: 6px; color: var(--theme-muted); font-size: .54rem; font-style: normal; }

.filter-panel[b-f45mpn7tf3],
.directory-panel[b-f45mpn7tf3] {
    margin-top: 24px;
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 23px;
    background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,250,248,.97));
    box-shadow: var(--shadow);
}
.directory-panel[b-f45mpn7tf3] { border-radius: 24px; }
.filter-heading[b-f45mpn7tf3],
.directory-toolbar[b-f45mpn7tf3] { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.filter-heading > div > span[b-f45mpn7tf3],
.panel-kicker[b-f45mpn7tf3] { color: #9c7b38; font-size: .52rem; font-weight: 750; letter-spacing: .11em; }
.filter-heading h2[b-f45mpn7tf3],
.directory-toolbar h2[b-f45mpn7tf3] { margin: 3px 0 0; color: var(--ink); font-size: 1.15rem; }
.filter-heading p[b-f45mpn7tf3],
.directory-toolbar p[b-f45mpn7tf3] { margin: 3px 0 0; color: var(--muted); font-size: .63rem; }
.filter-grid[b-f45mpn7tf3] { align-items: center; }
.citizen-page[b-f45mpn7tf3]  .premium-field,
.citizen-page[b-f45mpn7tf3]  .form-field { width: 100%; }
.citizen-page[b-f45mpn7tf3]  .premium-field .mud-input-outlined-border,
.citizen-page[b-f45mpn7tf3]  .form-field .mud-input-outlined-border { border-color: rgba(7,88,67,.13); }
.directory-actions[b-f45mpn7tf3] { display: flex; align-items: center; gap: 9px; }
.citizen-page[b-f45mpn7tf3]  .sort-select { width: 160px; }

.citizen-page[b-f45mpn7tf3]  .citizen-table { overflow: hidden; border: 1px solid rgba(7,88,67,.08); border-radius: 16px; }
.citizen-page[b-f45mpn7tf3]  .citizen-table .mud-table-head { background: #eef6f2; }
.citizen-page[b-f45mpn7tf3]  .citizen-table .mud-table-cell { padding: 13px 10px; border-bottom-color: var(--theme-border); font-size: .66rem; }

.citizen-profile[b-f45mpn7tf3] { display: flex; min-width: 190px; align-items: center; gap: 9px; }
.citizen-avatar[b-f45mpn7tf3],
.view-avatar[b-f45mpn7tf3] {
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27,96,137,.20);
    font-weight: 700;
}
.citizen-avatar[b-f45mpn7tf3] { flex: 0 0 42px; width: 42px; height: 42px; border: 2px solid rgba(255,255,255,.72); font-size: .70rem; }
.citizen-avatar-image[b-f45mpn7tf3],
.view-avatar-image[b-f45mpn7tf3] {
    object-fit: cover;
    background: #eef5f1;
}
.citizen-avatar.female[b-f45mpn7tf3],
.view-avatar.female[b-f45mpn7tf3] { background: linear-gradient(145deg, #a05ca0, #69406f); }
.citizen-avatar.other[b-f45mpn7tf3],
.view-avatar.other[b-f45mpn7tf3] { background: linear-gradient(145deg, var(--theme-light), #166558); }
.citizen-name[b-f45mpn7tf3],
.contact-cell[b-f45mpn7tf3],
.address-cell[b-f45mpn7tf3],
.updated-cell[b-f45mpn7tf3] { display: flex; min-width: 0; flex-direction: column; }
.citizen-name strong[b-f45mpn7tf3],
.citizen-name small[b-f45mpn7tf3] { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.citizen-name strong[b-f45mpn7tf3] { color: var(--theme-ink); font-size: .68rem; }
.citizen-name small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .52rem; }
.national-id[b-f45mpn7tf3] { color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary)); font-weight: 600; white-space: nowrap; }
.house-code[b-f45mpn7tf3] { display: inline-flex; min-height: 27px; align-items: center; padding: 0 8px; border: 1px solid rgba(7,88,67,.10); border-radius: 8px; color: #557068; background: #f5f8f6; font-size: .57rem; white-space: nowrap; }
.contact-cell[b-f45mpn7tf3] { gap: 3px; }
.contact-cell span[b-f45mpn7tf3] { display: flex; align-items: center; gap: 4px; color: var(--theme-muted); font-size: .56rem; white-space: nowrap; }
.address-cell strong[b-f45mpn7tf3],
.updated-cell strong[b-f45mpn7tf3] { color: #365248; font-size: .59rem; }
.address-cell small[b-f45mpn7tf3],
.updated-cell small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .51rem; }

.status-chip[b-f45mpn7tf3] { display: inline-flex; min-height: 27px; align-items: center; gap: 6px; padding: 0 8px; border-radius: 999px; color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 13%, white); font-size: .54rem; }
.status-chip i[b-f45mpn7tf3] { width: 7px; height: 7px; border-radius: 50%; background: #18a775; box-shadow: 0 0 0 4px rgba(24,167,117,.10); }
.status-chip.inactive[b-f45mpn7tf3] { color: #a4453e; background: #fff0ef; }
.status-chip.inactive i[b-f45mpn7tf3] { background: #ca514b; box-shadow: 0 0 0 4px rgba(202,81,75,.10); }
.row-actions[b-f45mpn7tf3] { display: flex; justify-content: center; gap: 2px; }
.citizen-page[b-f45mpn7tf3]  .row-action { width: 34px; height: 34px; border-radius: 10px; }
.citizen-page[b-f45mpn7tf3]  .row-action.view { color: #2d79a2; }
.citizen-page[b-f45mpn7tf3]  .row-action.edit { color: var(--theme-primary); }
.citizen-page[b-f45mpn7tf3]  .row-action.delete { color: #b54842; }

.pagination-bar[b-f45mpn7tf3] { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 17px; padding-top: 15px; border-top: 1px solid rgba(7,88,67,.08); color: var(--theme-muted); font-size: .58rem; }
.citizen-page[b-f45mpn7tf3]  .premium-pagination .mud-pagination-item { border-radius: 9px; }
.empty-state[b-f45mpn7tf3] { display: flex; min-height: 420px; align-items: center; justify-content: center; flex-direction: column; padding: 30px; text-align: center; }
.empty-state > span[b-f45mpn7tf3] { display: grid; width: 74px; height: 74px; place-items: center; border-radius: 22px; color: var(--theme-muted); background: #edf4f0; }
.empty-state h3[b-f45mpn7tf3] { margin: 14px 0 0; color: #3d5a50; }
.empty-state p[b-f45mpn7tf3] { max-width: 390px; margin: 5px 0 17px; color: var(--theme-muted); font-size: .63rem; }

.modal-backdrop[b-f45mpn7tf3] { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 24px; background: rgba(3,37,29,.62); backdrop-filter: blur(8px); }
.citizen-form-modal[b-f45mpn7tf3],
.citizen-view-modal[b-f45mpn7tf3],
.delete-modal[b-f45mpn7tf3] { width: min(100%,1120px); max-height: calc(100dvh - 48px); overflow: hidden; border: 1px solid rgba(231,207,152,.28); border-radius: 25px; background: #fff; box-shadow: 0 32px 90px rgba(3,37,29,.34); animation: modalAppear-b-f45mpn7tf3 .22s ease-out; }
@keyframes modalAppear-b-f45mpn7tf3 { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

.citizen-form-modal[b-f45mpn7tf3] { display: grid; grid-template-rows: auto minmax(0,1fr) auto; }
.modal-header[b-f45mpn7tf3] { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 20px; border-bottom: 1px solid rgba(7,88,67,.09); background: linear-gradient(145deg,color-mix(in srgb, var(--theme-bg) 42%, white),color-mix(in srgb, var(--theme-bg) 82%, white)); }
.modal-heading[b-f45mpn7tf3] { display: flex; align-items: center; gap: 12px; }
.modal-icon[b-f45mpn7tf3] { display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: color-mix(in srgb, var(--theme-accent) 68%, white); background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark)); box-shadow: 0 10px 24px rgba(4,61,47,.20); }
.modal-heading > div[b-f45mpn7tf3] { display: flex; flex-direction: column; }
.modal-heading small[b-f45mpn7tf3] { color: #9c7932; font-size: .52rem; letter-spacing: .10em; }
.modal-heading h2[b-f45mpn7tf3] { margin: 2px 0 0; color: var(--theme-ink); font-size: 1.05rem; }
.modal-heading p[b-f45mpn7tf3] { margin: 2px 0 0; color: #8b9993; font-size: .57rem; }
.modal-body[b-f45mpn7tf3] { overflow-y: auto; padding: 21px; background: radial-gradient(circle at 100% 0%,rgba(201,166,93,.08),transparent 20rem),#fff; }
.form-section-title[b-f45mpn7tf3] { display: flex; align-items: center; gap: 9px; margin: 5px 0 13px; padding-bottom: 10px; border-bottom: 1px solid rgba(7,88,67,.08); }
.form-section-title:not(:first-child)[b-f45mpn7tf3] { margin-top: 24px; }
.form-section-title > span[b-f45mpn7tf3] { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: #0b7154; background: #e8f5ef; }
.form-section-title > div[b-f45mpn7tf3] { display: flex; flex-direction: column; }
.form-section-title strong[b-f45mpn7tf3] { color: #2d4b40; font-size: .72rem; }
.form-section-title small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .52rem; }
.photo-upload-card[b-f45mpn7tf3] {
    display: flex;
    min-height: 132px;
    align-items: center;
    gap: 16px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 14px;
    background: linear-gradient(145deg,#ffffff,color-mix(in srgb, var(--theme-bg) 58%, white));
}
.photo-preview[b-f45mpn7tf3] {
    display: grid;
    flex: 0 0 96px;
    width: 96px;
    height: 96px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 14px;
    color: #0a7154;
    background: #eaf5ef;
}
.photo-preview.id-card[b-f45mpn7tf3] { width: 132px; flex-basis: 132px; }
.photo-preview img[b-f45mpn7tf3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.photo-upload-content[b-f45mpn7tf3] {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 9px;
}
.photo-upload-content strong[b-f45mpn7tf3] { color: #25483c; font-size: .72rem; }
.photo-file-name[b-f45mpn7tf3] {
    display: block;
    width: 100%;
    min-height: 32px;
    padding: 7px 9px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 10px;
    color: #6d7f77;
    background: color-mix(in srgb, var(--theme-bg) 82%, white);
    font-size: .56rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.photo-actions[b-f45mpn7tf3] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.photo-upload-button[b-f45mpn7tf3],
.photo-remove-button[b-f45mpn7tf3] {
    position: relative;
    display: inline-flex;
    width: auto;
    min-width: 104px;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    overflow: hidden;
    border: 0;
    border-radius: 10px;
    font-family: 'Kanit', sans-serif;
    font-size: .58rem;
    font-weight: 650;
    white-space: nowrap;
    cursor: pointer;
}
.photo-upload-button[b-f45mpn7tf3] {
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 8px 18px rgba(8,112,82,.16);
}
.photo-upload-button:hover[b-f45mpn7tf3] { background: #075f47; }
.photo-upload-button[b-f45mpn7tf3]  .photo-file-input,
.photo-upload-button input[type="file"][b-f45mpn7tf3] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.photo-remove-button[b-f45mpn7tf3] {
    border: 1px solid rgba(181,72,66,.18);
    color: #b54842;
    background: #fff4f2;
}
.photo-remove-button:hover[b-f45mpn7tf3] { background: #ffe9e6; }
.active-switch-card[b-f45mpn7tf3] { display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border: 1px solid rgba(7,88,67,.13); border-radius: 11px; background: color-mix(in srgb, var(--theme-bg) 42%, white); }
.active-switch-card > div[b-f45mpn7tf3] { display: flex; flex-direction: column; }
.active-switch-card strong[b-f45mpn7tf3] { color: #3b574d; font-size: .60rem; }
.active-switch-card small[b-f45mpn7tf3] { color: var(--theme-muted); font-size: .49rem; }
.modal-footer[b-f45mpn7tf3] { display: flex; justify-content: flex-end; gap: 9px; padding: 15px 20px; border-top: 1px solid rgba(7,88,67,.09); background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.citizen-page[b-f45mpn7tf3]  .cancel-button,
.citizen-page[b-f45mpn7tf3]  .confirm-delete-button { min-height: 42px; border-radius: 12px !important; }
.citizen-page[b-f45mpn7tf3]  .cancel-button { color: #657970 !important; border-color: rgba(7,88,67,.16) !important; }

.citizen-view-modal[b-f45mpn7tf3] { width: min(100%,720px); overflow-y: auto; }
.view-cover[b-f45mpn7tf3] { position: relative; display: flex; min-height: 145px; align-items: flex-end; justify-content: center; background: radial-gradient(circle at 50% 120%,rgba(201,166,93,.26),transparent 38%),linear-gradient(145deg,color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)),color-mix(in srgb, var(--theme-dark) 86%, black)); }
.view-close[b-f45mpn7tf3] { position: absolute; top: 13px; right: 13px; display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; color: #fff; background: rgba(255,255,255,.07); cursor: pointer; }
.view-avatar[b-f45mpn7tf3] { width: 112px; height: 112px; margin-bottom: -46px; border: 5px solid #fff; font-size: 1.35rem; box-shadow: 0 15px 34px rgba(3,37,29,.28); }
.view-content[b-f45mpn7tf3] { padding: 61px 24px 25px; }
.view-title[b-f45mpn7tf3] { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.view-title small[b-f45mpn7tf3] { color: #9d7a35; font-size: .51rem; letter-spacing: .10em; }
.view-title h2[b-f45mpn7tf3] { margin: 3px 0 0; color: var(--theme-ink); font-size: 1.25rem; }
.view-title p[b-f45mpn7tf3] { margin: 3px 0 0; color: #87958f; font-size: .60rem; }
.view-info-grid[b-f45mpn7tf3] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 20px; }
.view-info-grid > div[b-f45mpn7tf3] { display: flex; min-height: 70px; justify-content: center; flex-direction: column; padding: 11px 13px; border: 1px solid rgba(7,88,67,.09); border-radius: 13px; background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.view-info-grid span[b-f45mpn7tf3],
.view-address small[b-f45mpn7tf3],
.view-remark small[b-f45mpn7tf3] { color: #8b9993; font-size: .52rem; }
.view-info-grid strong[b-f45mpn7tf3] { margin-top: 3px; color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .64rem; }
.view-id-card-photo[b-f45mpn7tf3] {
    margin-top: 14px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.09);
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}
.view-id-card-photo small[b-f45mpn7tf3] {
    display: block;
    margin-bottom: 8px;
    color: #8b9993;
    font-size: .52rem;
}
.view-id-card-photo img[b-f45mpn7tf3] {
    display: block;
    width: 100%;
    max-height: 260px;
    object-fit: contain;
    border-radius: 11px;
    background: #fff;
}
.view-address[b-f45mpn7tf3] { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 14px; border: 1px solid rgba(7,88,67,.09); border-radius: 14px; background: #f5f9f7; }
.view-address-icon[b-f45mpn7tf3] { display: grid; flex: 0 0 40px; width: 40px; height: 40px; place-items: center; border-radius: 12px; color: #0a7154; background: #e6f4ed; }
.view-address > div[b-f45mpn7tf3] { display: flex; flex-direction: column; }
.view-address strong[b-f45mpn7tf3] { margin-top: 3px; color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .62rem; line-height: 1.7; }
.view-remark[b-f45mpn7tf3] { margin-top: 13px; padding: 13px; border: 1px dashed rgba(7,88,67,.15); border-radius: 13px; }
.view-remark p[b-f45mpn7tf3] { margin: 4px 0 0; color: var(--theme-muted); font-size: .61rem; }

.delete-modal[b-f45mpn7tf3] { width: min(100%,440px); padding: 27px; text-align: center; }
.delete-icon[b-f45mpn7tf3] { display: grid; width: 68px; height: 68px; place-items: center; margin: 0 auto; border-radius: 21px; color: #fff; background: linear-gradient(145deg,#e36b65,#ad3d38); box-shadow: 0 13px 30px rgba(173,61,56,.22); }
.delete-modal h2[b-f45mpn7tf3] { margin: 17px 0 0; color: #3f3532; }
.delete-modal p[b-f45mpn7tf3] { margin: 8px 0 0; color: #7b716e; font-size: .65rem; line-height: 1.65; }
.delete-modal p strong[b-f45mpn7tf3] { color: #963b36; }
.delete-warning[b-f45mpn7tf3] { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 15px; padding: 10px; border: 1px solid rgba(186,70,62,.12); border-radius: 12px; color: #a34a43; background: #fff3f1; font-size: .57rem; }
.delete-actions[b-f45mpn7tf3] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 18px; }
.citizen-page[b-f45mpn7tf3]  .confirm-delete-button { color: #fff !important; background: linear-gradient(145deg,#d95f59,#a93c37) !important; box-shadow: 0 9px 21px rgba(169,60,55,.18); }

@media (max-width: 1150px) {
    .citizen-hero[b-f45mpn7tf3] { grid-template-columns: minmax(0,1fr); }
    .hero-action-panel[b-f45mpn7tf3] { max-width: 570px; }
    .directory-toolbar[b-f45mpn7tf3] { align-items: stretch; flex-direction: column; }
    .directory-actions[b-f45mpn7tf3] { justify-content: flex-end; }
}

@media (max-width: 760px) {
    .citizen-page[b-f45mpn7tf3] { padding: 15px 12px 30px; }
    .citizen-hero[b-f45mpn7tf3] { padding: 27px 21px; border-radius: 23px; }
    .hero-content h1[b-f45mpn7tf3] { font-size: 2.3rem; }
    .hero-meta[b-f45mpn7tf3] { flex-direction: column; }
    .hero-meta > span[b-f45mpn7tf3] { width: 100%; }
    .filter-heading[b-f45mpn7tf3],
    .directory-actions[b-f45mpn7tf3] { align-items: stretch; flex-direction: column; }
    .citizen-page[b-f45mpn7tf3]  .sort-select { width: 100%; }
    .pagination-bar[b-f45mpn7tf3] { align-items: flex-start; flex-direction: column; }
    .modal-backdrop[b-f45mpn7tf3] { align-items: end; padding: 0; }
    .citizen-form-modal[b-f45mpn7tf3],
    .citizen-view-modal[b-f45mpn7tf3] { width: 100%; max-height: 94dvh; border-radius: 23px 23px 0 0; }
    .delete-modal[b-f45mpn7tf3] { width: calc(100% - 24px); margin-bottom: 12px; }
    .view-info-grid[b-f45mpn7tf3] { grid-template-columns: minmax(0,1fr); }
}

@media (max-width: 520px) {
    .filter-panel[b-f45mpn7tf3],
    .directory-panel[b-f45mpn7tf3] { padding: 17px; border-radius: 19px; }
    .modal-icon[b-f45mpn7tf3] { display: none; }
    .modal-footer[b-f45mpn7tf3] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .citizen-page[b-f45mpn7tf3]  .save-button { min-width: 0; }
    .view-title[b-f45mpn7tf3] { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-f45mpn7tf3],
    .citizen-form-modal[b-f45mpn7tf3],
    .citizen-view-modal[b-f45mpn7tf3],
    .delete-modal[b-f45mpn7tf3] { animation-duration: 1ms !important; transition-duration: 1ms !important; }
}
/* /Components/Pages/01Ziticen/02Citizens/CommunityAddresses.razor.rz.scp.css */
.community-page[b-y1290l2k2m] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.community-page[b-y1290l2k2m]  .community-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.community-hero[b-y1290l2k2m] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-y1290l2k2m] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-y1290l2k2m] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;

    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-y1290l2k2m] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-y1290l2k2m] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-y1290l2k2m] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-y1290l2k2m] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-y1290l2k2m] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-y1290l2k2m] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.15rem, 3.8vw, 4.15rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-y1290l2k2m] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-y1290l2k2m] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-y1290l2k2m] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-y1290l2k2m] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-y1290l2k2m] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-y1290l2k2m] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-y1290l2k2m] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.community-page[b-y1290l2k2m]  .hero-add-button,
.community-page[b-y1290l2k2m]  .search-button,
.community-page[b-y1290l2k2m]  .toolbar-add-button,
.community-page[b-y1290l2k2m]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.community-page[b-y1290l2k2m]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-y1290l2k2m] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-y1290l2k2m] {
    opacity: .55;
    cursor: not-allowed;
}

.community-page[b-y1290l2k2m]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.community-page[b-y1290l2k2m]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-y1290l2k2m] {
    margin-top: 7px;
}

.summary-card[b-y1290l2k2m] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-y1290l2k2m] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.households[b-y1290l2k2m] {
    color: #2c7da8;
}

.summary-card.population[b-y1290l2k2m] {
    color: #7658a7;
}

.summary-card.media[b-y1290l2k2m] {
    color: #c05b4e;
}

.summary-line[b-y1290l2k2m] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-y1290l2k2m] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;

    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-y1290l2k2m] {
    min-width: 0;
}

.summary-card small[b-y1290l2k2m] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-y1290l2k2m] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-y1290l2k2m] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-y1290l2k2m] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-y1290l2k2m] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-y1290l2k2m],
.community-list-panel[b-y1290l2k2m] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-y1290l2k2m],
.list-toolbar[b-y1290l2k2m] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 17px;
}

.filter-heading > div > span[b-y1290l2k2m],
.panel-kicker[b-y1290l2k2m] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-y1290l2k2m],
.list-toolbar h2[b-y1290l2k2m] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-y1290l2k2m],
.list-toolbar p[b-y1290l2k2m] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-y1290l2k2m] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-y1290l2k2m] {
    align-items: center;
}

.community-page[b-y1290l2k2m]  .premium-field,
.community-page[b-y1290l2k2m]  .form-field {
    width: 100%;
}

.community-page[b-y1290l2k2m]  .premium-field .mud-input-outlined-border,
.community-page[b-y1290l2k2m]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.community-page[b-y1290l2k2m]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.community-page[b-y1290l2k2m]  .sort-select {
    width: 180px;
}

.community-page[b-y1290l2k2m]  .toolbar-add-button {
    min-height: 42px;
}

.community-page[b-y1290l2k2m]  .community-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.community-page[b-y1290l2k2m]  .community-table .mud-table-head {
    background: #eef6f2;
}

.community-page[b-y1290l2k2m]  .community-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.community-code[b-y1290l2k2m] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-y1290l2k2m] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-y1290l2k2m],
.mini-photo-empty[b-y1290l2k2m] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-y1290l2k2m] {
    cursor: zoom-in;
}

.mini-photo-button img[b-y1290l2k2m] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button small[b-y1290l2k2m] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.map[b-y1290l2k2m] {
    color: #9c7b38;
}

.community-name-cell[b-y1290l2k2m] {
    display: flex;
    min-width: 175px;
    flex-direction: column;
    gap: 5px;
}

.community-name-cell strong[b-y1290l2k2m] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.type-chip[b-y1290l2k2m],
.status-chip[b-y1290l2k2m],
.view-type-chip[b-y1290l2k2m] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-y1290l2k2m] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.village[b-y1290l2k2m] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.rural[b-y1290l2k2m] {
    color: #4f7b3c;
    background: #edf7e8;
}

.type-chip.housing[b-y1290l2k2m] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.market[b-y1290l2k2m] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.riverside[b-y1290l2k2m] {
    color: #287795;
    background: #e5f4f8;
}

.address-cell[b-y1290l2k2m],
.population-cell[b-y1290l2k2m],
.leader-cell[b-y1290l2k2m],
.area-cell[b-y1290l2k2m] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.address-cell strong[b-y1290l2k2m],
.leader-cell strong[b-y1290l2k2m],
.area-cell strong[b-y1290l2k2m] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
}

.address-cell small[b-y1290l2k2m],
.leader-cell small[b-y1290l2k2m],
.area-cell small[b-y1290l2k2m] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.population-cell[b-y1290l2k2m] {
    gap: 4px;
}

.population-cell span[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: #536c63;
    font-size: .53rem;
    white-space: nowrap;
}

.facility-icons[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 5px;
}

.facility-icons span[b-y1290l2k2m] {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;

    border-radius: 9px;
}

.facility-icons .available[b-y1290l2k2m] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.facility-icons .unavailable[b-y1290l2k2m] {
    color: #a8b1ad;
    background: #f0f3f1;
}

.status-chip[b-y1290l2k2m] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-y1290l2k2m] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.active[b-y1290l2k2m] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.inactive[b-y1290l2k2m] {
    color: #7c8480;
    background: #ecefed;
}

.row-actions[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.community-page[b-y1290l2k2m]  .row-action {
    width: 34px;
    height: 34px;

    border-radius: 10px;
}

.community-page[b-y1290l2k2m]  .row-action.view {
    color: #2d79a2;
}

.community-page[b-y1290l2k2m]  .row-action.edit {
    color: var(--theme-primary);
}

.community-page[b-y1290l2k2m]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.community-page[b-y1290l2k2m]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-y1290l2k2m] {
    display: flex;
    min-height: 420px;

    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-y1290l2k2m] {
    display: grid;
    width: 74px;
    height: 74px;

    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-y1290l2k2m] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-y1290l2k2m] {
    max-width: 390px;

    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-y1290l2k2m] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.community-form-modal[b-y1290l2k2m],
.community-view-modal[b-y1290l2k2m],
.delete-modal[b-y1290l2k2m] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);

    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-y1290l2k2m .22s ease-out;
}

@keyframes modalAppear-b-y1290l2k2m {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.community-form-modal[b-y1290l2k2m] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-y1290l2k2m] {
    display: grid;
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-y1290l2k2m] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-y1290l2k2m] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-y1290l2k2m] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-y1290l2k2m] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-y1290l2k2m] {
    margin-top: 24px;
}

.form-section-title > span[b-y1290l2k2m] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-y1290l2k2m] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-y1290l2k2m] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-y1290l2k2m] {
    display: flex;
    min-height: 70px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-y1290l2k2m] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-y1290l2k2m] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.photo-upload-grid[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-y1290l2k2m] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-y1290l2k2m] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-y1290l2k2m] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-y1290l2k2m] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-y1290l2k2m] {
    display: grid;
    min-height: 260px;

    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.photo-preview img[b-y1290l2k2m] {
    width: 100%;
    height: 100%;
    max-height: 350px;

    object-fit: contain;
}

.photo-empty[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-y1290l2k2m] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-y1290l2k2m] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-y1290l2k2m] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-y1290l2k2m],
.remove-photo-button[b-y1290l2k2m] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-y1290l2k2m] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-y1290l2k2m] {
    display: none;
}

.remove-photo-button[b-y1290l2k2m] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.community-page[b-y1290l2k2m]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.remark-grid[b-y1290l2k2m] {
    margin-top: 10px;
}

.modal-footer[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.community-page[b-y1290l2k2m]  .cancel-button,
.community-page[b-y1290l2k2m]  .save-button,
.community-page[b-y1290l2k2m]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.community-page[b-y1290l2k2m]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.community-page[b-y1290l2k2m]  .save-button {
    min-width: 170px;
}

.community-view-modal[b-y1290l2k2m] {
    width: min(100%, 840px);
    overflow-y: auto;
}

.view-cover[b-y1290l2k2m] {
    position: relative;

    min-height: 260px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-y1290l2k2m] {
    width: 100%;
    height: 260px;

    object-fit: cover;
}

.view-cover-empty[b-y1290l2k2m] {
    display: grid;
    height: 260px;

    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-y1290l2k2m] {
    font-size: 5rem;
}

.view-cover-overlay[b-y1290l2k2m] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .85));
}

.view-close[b-y1290l2k2m] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-y1290l2k2m] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-y1290l2k2m] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-y1290l2k2m] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.45rem;
}

.view-cover-title p[b-y1290l2k2m] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-y1290l2k2m] {
    padding: 22px;
}

.view-toolbar[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-y1290l2k2m] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-type-chip[b-y1290l2k2m] {
    color: #7658a7;
    background: #f0eafb;
}

.view-summary-grid[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;

    margin-top: 16px;
}

.view-summary-grid article[b-y1290l2k2m] {
    display: flex;
    min-height: 78px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-y1290l2k2m] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-y1290l2k2m] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-y1290l2k2m],
.view-info-grid span[b-y1290l2k2m],
.boundary-panel small[b-y1290l2k2m],
.view-note small[b-y1290l2k2m] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-y1290l2k2m] {
    margin-top: 2px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .72rem;
}

.view-info-grid[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;

    margin-top: 15px;
}

.view-info-grid > div[b-y1290l2k2m] {
    display: flex;
    min-height: 78px;

    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-y1290l2k2m] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.65;
}

.facility-detail-grid[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;

    margin-top: 15px;
}

.facility-detail-grid > div[b-y1290l2k2m] {
    display: flex;
    min-height: 68px;

    align-items: center;
    gap: 9px;

    padding: 11px;

    border-radius: 13px;
}

.facility-detail-grid > div.available[b-y1290l2k2m] {
    color: var(--theme-primary);
    background: #eaf7f1;
}

.facility-detail-grid > div.unavailable[b-y1290l2k2m] {
    color: #909b96;
    background: #f0f3f1;
}

.facility-detail-grid span[b-y1290l2k2m] {
    display: flex;
    flex-direction: column;
}

.facility-detail-grid strong[b-y1290l2k2m] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
}

.facility-detail-grid small[b-y1290l2k2m] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .48rem;
}

.boundary-panel[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, .85fr);

    gap: 13px;

    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.boundary-panel p[b-y1290l2k2m] {
    margin: 5px 0 0;

    color: #657870;
    font-size: .60rem;
    line-height: 1.7;
}

.boundary-map-button[b-y1290l2k2m] {
    position: relative;

    min-height: 190px;
    padding: 0;
    overflow: hidden;

    border: 0;
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.boundary-map-button img[b-y1290l2k2m] {
    width: 100%;
    height: 100%;
    min-height: 190px;

    object-fit: cover;
}

.boundary-map-button > span[b-y1290l2k2m] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 31px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .51rem;
}

.boundary-map-empty[b-y1290l2k2m] {
    display: flex;
    min-height: 190px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.boundary-map-empty .mud-icon-root[b-y1290l2k2m] {
    font-size: 2.3rem;
}

.view-note[b-y1290l2k2m] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-y1290l2k2m] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-y1290l2k2m] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-y1290l2k2m] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;

    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-y1290l2k2m] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-y1290l2k2m] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-y1290l2k2m] {
    display: grid;
    min-height: 0;

    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-y1290l2k2m] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;

    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-y1290l2k2m] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-y1290l2k2m] {
    display: grid;
    width: 68px;
    height: 68px;

    place-items: center;

    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);

    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-y1290l2k2m] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-y1290l2k2m] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-y1290l2k2m] {
    color: #963b36;
}

.delete-warning[b-y1290l2k2m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-y1290l2k2m] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;

    margin-top: 18px;
}

.community-page[b-y1290l2k2m]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;

    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .community-hero[b-y1290l2k2m] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-y1290l2k2m] {
        max-width: 570px;
    }

    .list-toolbar[b-y1290l2k2m] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-y1290l2k2m] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .community-page[b-y1290l2k2m] {
        padding: 15px 12px 30px;
    }

    .community-hero[b-y1290l2k2m] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-y1290l2k2m] {
        font-size: 2.2rem;
    }

    .hero-meta[b-y1290l2k2m] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-y1290l2k2m] {
        width: 100%;
    }

    .filter-heading[b-y1290l2k2m] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-y1290l2k2m] {
        align-items: stretch;
        flex-direction: column;
    }

    .community-page[b-y1290l2k2m]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-y1290l2k2m] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-y1290l2k2m],
    .boundary-panel[b-y1290l2k2m] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-y1290l2k2m],
    .facility-detail-grid[b-y1290l2k2m] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-y1290l2k2m] {
        align-items: end;
        padding: 0;
    }

    .community-form-modal[b-y1290l2k2m],
    .community-view-modal[b-y1290l2k2m] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-y1290l2k2m] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-y1290l2k2m] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-y1290l2k2m],
    .community-list-panel[b-y1290l2k2m] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-y1290l2k2m] {
        align-items: flex-start;
    }

    .modal-icon[b-y1290l2k2m] {
        display: none;
    }

    .modal-footer[b-y1290l2k2m] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .community-page[b-y1290l2k2m]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-y1290l2k2m],
    .view-info-grid[b-y1290l2k2m] {
        align-items: stretch;
        grid-template-columns: minmax(0, 1fr);
    }

    .view-toolbar[b-y1290l2k2m] {
        display: flex;
        flex-direction: column;
    }

    .image-preview-backdrop[b-y1290l2k2m] {
        padding: 0;
    }

    .image-preview-modal[b-y1290l2k2m] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-y1290l2k2m],
    .community-form-modal[b-y1290l2k2m],
    .community-view-modal[b-y1290l2k2m],
    .delete-modal[b-y1290l2k2m] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}
/* /Components/Pages/01Ziticen/02Citizens/Households.razor.rz.scp.css */
.household-page[b-qzb6afwgt7] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;
    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);
    font-family: 'Kanit', sans-serif;
}

.household-page[b-qzb6afwgt7]  .household-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.household-hero[b-qzb6afwgt7] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;
    padding: 36px 38px;
    overflow: hidden;
    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;
    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);
    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-qzb6afwgt7] {
    position: absolute;
    inset: 0;
    opacity: .15;
    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-qzb6afwgt7] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-qzb6afwgt7] { position: relative; z-index: 2; }

.hero-badge[b-qzb6afwgt7] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;
    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-qzb6afwgt7] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.hero-badge small[b-qzb6afwgt7] { color: rgba(255, 255, 255, .52); font-size: .53rem; letter-spacing: .11em; }
.hero-badge strong[b-qzb6afwgt7] { color: color-mix(in srgb, var(--theme-accent) 62%, white); font-size: .68rem; font-weight: 650; }
.hero-content h1[b-qzb6afwgt7] { margin: 0; color: #fff; font-size: clamp(2.2rem, 3.8vw, 4.2rem); font-weight: 800; line-height: 1.04; letter-spacing: -.035em; }
.hero-content p[b-qzb6afwgt7] { max-width: 940px; margin: 17px 0 0; color: rgba(255, 255, 255, .66); font-size: clamp(.83rem, 1.08vw, 1rem); font-weight: 300; line-height: 1.75; }

.hero-meta[b-qzb6afwgt7] { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 23px; }
.hero-meta > span[b-qzb6afwgt7] { display: inline-flex; min-height: 37px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid rgba(255,255,255,.10); border-radius: 12px; color: rgba(255,255,255,.63); background: rgba(255,255,255,.045); font-size: .63rem; }

.hero-action-panel[b-qzb6afwgt7] {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 22px;
    color: var(--ink);
    background: linear-gradient(145deg, rgba(255,255,255,.985), rgba(242,247,244,.955));
    box-shadow: 0 24px 52px rgba(0,0,0,.18);
}

.hero-status[b-qzb6afwgt7] { display: flex; align-items: center; gap: 11px; margin-bottom: 3px; padding-bottom: 14px; border-bottom: 1px solid rgba(7,88,67,.09); }
.status-dot[b-qzb6afwgt7] { width: 10px; height: 10px; border-radius: 50%; background: var(--theme-light); box-shadow: 0 0 0 6px rgba(50,205,135,.12); }
.hero-status > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.hero-status strong[b-qzb6afwgt7] { color: #195d48; font-size: .72rem; }
.hero-status small[b-qzb6afwgt7] { margin-top: 2px; color: var(--theme-muted); font-size: .56rem; }

.household-page[b-qzb6afwgt7]  .hero-add-button,
.household-page[b-qzb6afwgt7]  .search-button,
.household-page[b-qzb6afwgt7]  .toolbar-add-button,
.household-page[b-qzb6afwgt7]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4,61,47,.20);
}

.household-page[b-qzb6afwgt7]  .hero-add-button { min-height: 45px; }
.hero-refresh-button[b-qzb6afwgt7] { display: flex; min-height: 42px; align-items: center; justify-content: center; gap: 7px; border: 1px solid rgba(7,88,67,.12); border-radius: 13px; color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary)); background: #fff; font-family: 'Kanit', sans-serif; font-size: .64rem; cursor: pointer; }
.hero-refresh-button:disabled[b-qzb6afwgt7] { opacity: .55; cursor: not-allowed; }
.household-page[b-qzb6afwgt7]  .page-loading { margin: -4px 27px 0; border-radius: 0 0 10px 10px; }
.household-page[b-qzb6afwgt7]  .page-error { margin-top: 18px; border-radius: 15px !important; }

.summary-grid[b-qzb6afwgt7] { margin-top: 7px; }
.summary-card[b-qzb6afwgt7] { position: relative; display: flex; min-height: 150px; align-items: center; gap: 15px; padding: 20px; overflow: hidden; border: 1px solid var(--border); border-radius: 21px; color: var(--theme-primary); background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,250,248,.97)); box-shadow: var(--shadow); transition: transform .20s ease, box-shadow .20s ease; }
.summary-card:hover[b-qzb6afwgt7] { transform: translateY(-3px); box-shadow: 0 20px 45px rgba(5,62,46,.11); }
.summary-card.members[b-qzb6afwgt7] { color: #2c7da8; }
.summary-card.vulnerable[b-qzb6afwgt7] { color: #c05b4e; }
.summary-card.business[b-qzb6afwgt7] { color: #7658a7; }
.summary-line[b-qzb6afwgt7] { position: absolute; top: 0; left: 20px; right: 20px; height: 2px; opacity: .54; background: linear-gradient(90deg, transparent, currentColor, transparent); }
.summary-icon[b-qzb6afwgt7] { display: grid; flex: 0 0 54px; width: 54px; height: 54px; place-items: center; border-radius: 17px; color: #fff; background: currentColor; box-shadow: 0 11px 24px rgba(0,0,0,.13); }
.summary-card small[b-qzb6afwgt7] { color: var(--theme-muted); font-size: .69rem; font-weight: 560; }
.summary-card p[b-qzb6afwgt7] { display: flex; align-items: baseline; gap: 7px; margin: 4px 0 0; }
.summary-card p strong[b-qzb6afwgt7] { color: var(--ink); font-size: 1.82rem; font-weight: 800; letter-spacing: -.03em; }
.summary-card p span[b-qzb6afwgt7] { color: var(--theme-muted); font-size: .61rem; }
.summary-card em[b-qzb6afwgt7] { display: block; margin-top: 6px; color: var(--theme-muted); font-size: .54rem; font-style: normal; }

.filter-panel[b-qzb6afwgt7],
.household-list-panel[b-qzb6afwgt7] { margin-top: 24px; padding: 22px; border: 1px solid var(--border); border-radius: 23px; background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,250,248,.97)); box-shadow: var(--shadow); }
.filter-heading[b-qzb6afwgt7],
.list-toolbar[b-qzb6afwgt7] { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.filter-heading > div > span[b-qzb6afwgt7],
.panel-kicker[b-qzb6afwgt7] { color: #9c7b38; font-size: .52rem; font-weight: 750; letter-spacing: .11em; }
.filter-heading h2[b-qzb6afwgt7],
.list-toolbar h2[b-qzb6afwgt7] { margin: 3px 0 0; color: var(--ink); font-size: 1.15rem; font-weight: 720; }
.filter-heading p[b-qzb6afwgt7],
.list-toolbar p[b-qzb6afwgt7] { margin: 3px 0 0; color: var(--muted); font-size: .63rem; }
.clear-filter-button[b-qzb6afwgt7] { display: inline-flex; min-height: 36px; align-items: center; gap: 6px; padding: 0 10px; border: 1px solid rgba(7,88,67,.11); border-radius: 11px; color: var(--theme-muted); background: #f6f9f7; font-family: 'Kanit', sans-serif; font-size: .61rem; cursor: pointer; }
.filter-grid[b-qzb6afwgt7] { align-items: center; }
.household-page[b-qzb6afwgt7]  .premium-field,
.household-page[b-qzb6afwgt7]  .form-field { width: 100%; }
.household-page[b-qzb6afwgt7]  .premium-field .mud-input-outlined-border,
.household-page[b-qzb6afwgt7]  .form-field .mud-input-outlined-border { border-color: rgba(7,88,67,.13); }
.household-page[b-qzb6afwgt7]  .search-button { min-height: 56px; }
.toolbar-actions[b-qzb6afwgt7] { display: flex; align-items: center; gap: 9px; }
.household-page[b-qzb6afwgt7]  .sort-select { width: 180px; }
.household-page[b-qzb6afwgt7]  .toolbar-add-button { min-height: 42px; }

.household-page[b-qzb6afwgt7]  .household-table { overflow: hidden; border: 1px solid rgba(7,88,67,.08); border-radius: 16px; }
.household-page[b-qzb6afwgt7]  .household-table .mud-table-head { background: #eef6f2; }
.household-page[b-qzb6afwgt7]  .household-table .mud-table-cell { padding: 13px 10px; border-bottom-color: var(--theme-border); font-size: .63rem; }

.photo-pair-mini[b-qzb6afwgt7] { display: flex; min-width: 122px; align-items: center; gap: 6px; }
.mini-photo-button[b-qzb6afwgt7] { position: relative; display: grid; width: 62px; height: 54px; place-items: center; padding: 0; overflow: hidden; border: 1px solid rgba(7,88,67,.13); border-radius: 11px; color: #678078; background: #edf5f1; cursor: pointer; }
.mini-photo-button.person[b-qzb6afwgt7] { width: 48px; }
.mini-photo-button img[b-qzb6afwgt7] { width: 100%; height: 100%; object-fit: cover; }
.mini-photo-button small[b-qzb6afwgt7] { position: absolute; right: 3px; bottom: 3px; left: 3px; padding: 2px 3px; border-radius: 5px; color: #fff; background: rgba(3,45,36,.78); font-size: .39rem; line-height: 1; text-align: center; }

.household-no[b-qzb6afwgt7] { display: inline-flex; min-height: 28px; align-items: center; padding: 0 8px; border: 1px solid rgba(7,88,67,.11); border-radius: 9px; color: var(--theme-primary); background: #f0f8f4; font-size: .54rem; font-weight: 700; white-space: nowrap; }
.house-code[b-qzb6afwgt7] { display: block; margin-top: 4px; color: var(--theme-muted); font-size: .49rem; }
.head-profile[b-qzb6afwgt7] { display: flex; min-width: 185px; align-items: center; gap: 9px; }
.head-avatar[b-qzb6afwgt7] { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(145deg,#2c83b1,#17597e); box-shadow: 0 8px 19px rgba(27,96,137,.20); font-size: .68rem; font-weight: 700; }
.head-name[b-qzb6afwgt7] { display: flex; min-width: 0; flex-direction: column; }
.head-name strong[b-qzb6afwgt7],
.head-name small[b-qzb6afwgt7] { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.head-name strong[b-qzb6afwgt7] { color: var(--theme-ink); font-size: .66rem; }
.head-name small[b-qzb6afwgt7] { margin-top: 2px; color: var(--theme-muted); font-size: .50rem; }
.address-cell[b-qzb6afwgt7],
.member-cell[b-qzb6afwgt7] { display: flex; min-width: 145px; flex-direction: column; }
.address-cell strong[b-qzb6afwgt7],
.member-cell strong[b-qzb6afwgt7] { color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .58rem; }
.address-cell small[b-qzb6afwgt7],
.member-cell small[b-qzb6afwgt7] { margin-top: 2px; color: var(--theme-muted); font-size: .49rem; }
.type-chip[b-qzb6afwgt7],
.status-chip[b-qzb6afwgt7],
.tag[b-qzb6afwgt7] { display: inline-flex; min-height: 27px; align-items: center; gap: 5px; padding: 0 8px; border-radius: 999px; font-size: .50rem; font-weight: 620; white-space: nowrap; }
.type-chip[b-qzb6afwgt7] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 13%, white); }
.ownership-text[b-qzb6afwgt7] { display: block; margin-top: 4px; color: #85928d; font-size: .48rem; }
.tag-list[b-qzb6afwgt7] { display: flex; min-width: 125px; flex-wrap: wrap; gap: 4px; }
.tag.vulnerable[b-qzb6afwgt7] { color: #aa453e; background: #fff0ef; }
.tag.business[b-qzb6afwgt7] { color: #7658a7; background: #f0eafb; }
.tag.income[b-qzb6afwgt7] { color: #94651b; background: #fff1d7; }
.utility-list[b-qzb6afwgt7] { display: flex; gap: 5px; }
.utility-list span[b-qzb6afwgt7] { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 9px; }
.utility-list .ok[b-qzb6afwgt7] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 13%, white); }
.utility-list .missing[b-qzb6afwgt7] { color: #aa453e; background: #fff0ef; }
.status-chip[b-qzb6afwgt7] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.inactive[b-qzb6afwgt7] { color: #6c7680; background: #e9eef1; }
.status-chip i[b-qzb6afwgt7] { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(100,120,111,.09); }
.row-actions[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: center; gap: 2px; }
.household-page[b-qzb6afwgt7]  .row-action { width: 34px; height: 34px; border-radius: 10px; }
.household-page[b-qzb6afwgt7]  .row-action.view { color: #2d79a2; }
.household-page[b-qzb6afwgt7]  .row-action.edit { color: var(--theme-primary); }
.household-page[b-qzb6afwgt7]  .row-action.delete { color: #b54842; }
.pagination-bar[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 17px; padding-top: 15px; border-top: 1px solid rgba(7,88,67,.08); color: var(--theme-muted); font-size: .58rem; }
.household-page[b-qzb6afwgt7]  .premium-pagination .mud-pagination-item { border-radius: 9px; }

.empty-state[b-qzb6afwgt7] { display: flex; min-height: 420px; align-items: center; justify-content: center; flex-direction: column; padding: 30px; text-align: center; }
.empty-state > span[b-qzb6afwgt7] { display: grid; width: 74px; height: 74px; place-items: center; border-radius: 22px; color: var(--theme-muted); background: #edf4f0; }
.empty-state h3[b-qzb6afwgt7] { margin: 14px 0 0; color: #3d5a50; font-size: .89rem; }
.empty-state p[b-qzb6afwgt7] { max-width: 390px; margin: 5px 0 17px; color: var(--theme-muted); font-size: .63rem; line-height: 1.6; }

.modal-backdrop[b-qzb6afwgt7] { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 24px; background: rgba(3,37,29,.62); backdrop-filter: blur(8px); }
.household-form-modal[b-qzb6afwgt7],
.household-view-modal[b-qzb6afwgt7],
.delete-modal[b-qzb6afwgt7] { width: min(100%, 1140px); max-height: calc(100dvh - 48px); overflow: hidden; border: 1px solid rgba(231,207,152,.28); border-radius: 25px; background: #fff; box-shadow: 0 32px 90px rgba(3,37,29,.34); animation: modalAppear-b-qzb6afwgt7 .22s ease-out; }
@keyframes modalAppear-b-qzb6afwgt7 { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
.household-form-modal[b-qzb6afwgt7] { display: grid; grid-template-rows: auto minmax(0,1fr) auto; }
.modal-header[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 20px; border-bottom: 1px solid rgba(7,88,67,.09); background: linear-gradient(145deg,color-mix(in srgb, var(--theme-bg) 42%, white),color-mix(in srgb, var(--theme-bg) 82%, white)); }
.modal-heading[b-qzb6afwgt7] { display: flex; align-items: center; gap: 12px; }
.modal-icon[b-qzb6afwgt7] { display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: color-mix(in srgb, var(--theme-accent) 68%, white); background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark)); box-shadow: 0 10px 24px rgba(4,61,47,.20); }
.modal-heading > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.modal-heading small[b-qzb6afwgt7] { color: #9c7932; font-size: .52rem; font-weight: 760; letter-spacing: .10em; }
.modal-heading h2[b-qzb6afwgt7] { margin: 2px 0 0; color: var(--theme-ink); font-size: 1.05rem; }
.modal-heading p[b-qzb6afwgt7] { margin: 2px 0 0; color: #8b9993; font-size: .57rem; }
.modal-body[b-qzb6afwgt7] { overflow-y: auto; padding: 21px; background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 20rem), #fff; }
.form-section-title[b-qzb6afwgt7] { display: flex; align-items: center; gap: 9px; margin: 5px 0 13px; padding-bottom: 10px; border-bottom: 1px solid rgba(7,88,67,.08); }
.form-section-title:not(:first-child)[b-qzb6afwgt7] { margin-top: 24px; }
.form-section-title > span[b-qzb6afwgt7] { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: #0b7154; background: #e8f5ef; }
.form-section-title > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.form-section-title strong[b-qzb6afwgt7] { color: #2d4b40; font-size: .72rem; }
.form-section-title small[b-qzb6afwgt7] { margin-top: 1px; color: var(--theme-muted); font-size: .52rem; }
.switch-card[b-qzb6afwgt7] { display: flex; min-height: 70px; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid rgba(7,88,67,.13); border-radius: 12px; background: color-mix(in srgb, var(--theme-bg) 42%, white); }
.switch-card > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.switch-card strong[b-qzb6afwgt7] { color: #3b574d; font-size: .60rem; }
.switch-card small[b-qzb6afwgt7] { margin-top: 2px; color: var(--theme-muted); font-size: .49rem; line-height: 1.45; }
.remark-grid[b-qzb6afwgt7] { margin-top: 20px; }
.modal-footer[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 15px 20px; border-top: 1px solid rgba(7,88,67,.09); background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.household-page[b-qzb6afwgt7]  .cancel-button,
.household-page[b-qzb6afwgt7]  .save-button,
.household-page[b-qzb6afwgt7]  .delete-confirm-button { min-height: 42px; border-radius: 12px !important; }
.household-page[b-qzb6afwgt7]  .cancel-button { color: #657970 !important; border-color: rgba(7,88,67,.16) !important; }
.household-page[b-qzb6afwgt7]  .save-button { min-width: 180px; }

.photo-upload-grid[b-qzb6afwgt7] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.photo-upload-card[b-qzb6afwgt7] { padding: 14px; border: 1px solid rgba(7,88,67,.12); border-radius: 17px; background: linear-gradient(145deg,color-mix(in srgb, var(--theme-bg) 42%, white),color-mix(in srgb, var(--theme-bg) 82%, white)); }
.photo-upload-heading[b-qzb6afwgt7] { display: flex; align-items: center; gap: 10px; }
.photo-upload-heading > span[b-qzb6afwgt7] { display: grid; flex: 0 0 40px; width: 40px; height: 40px; place-items: center; border-radius: 13px; color: #f0d493; background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark)); }
.photo-upload-heading > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.photo-upload-heading strong[b-qzb6afwgt7] { color: var(--theme-ink); font-size: .68rem; }
.photo-upload-heading small[b-qzb6afwgt7] { margin-top: 2px; color: #8c9a94; font-size: .52rem; }
.photo-preview[b-qzb6afwgt7] { display: grid; min-height: 270px; place-items: center; margin-top: 13px; overflow: hidden; border: 1px dashed rgba(7,88,67,.19); border-radius: 15px; background: linear-gradient(145deg,#edf5f1,#f9fbfa); }
.person-preview[b-qzb6afwgt7] { min-height: 320px; }
.photo-preview img[b-qzb6afwgt7] { width: 100%; height: 100%; max-height: 360px; object-fit: contain; background: #e9f0ed; }
.photo-empty[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 30px; color: #82938d; text-align: center; }
.photo-empty .mud-icon-root[b-qzb6afwgt7] { margin-bottom: 9px; font-size: 2.5rem; }
.photo-empty strong[b-qzb6afwgt7] { color: #557068; font-size: .66rem; }
.photo-empty small[b-qzb6afwgt7] { margin-top: 4px; font-size: .50rem; }
.photo-upload-actions[b-qzb6afwgt7] { display: flex; align-items: center; gap: 8px; margin-top: 11px; }
.file-picker-button[b-qzb6afwgt7],
.remove-photo-button[b-qzb6afwgt7] { display: inline-flex; min-height: 39px; align-items: center; justify-content: center; gap: 6px; padding: 0 12px; border-radius: 11px; font-family: 'Kanit', sans-serif; font-size: .57rem; cursor: pointer; }
.file-picker-button[b-qzb6afwgt7] { flex: 1; color: #f4d997; background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark)); }
.file-picker-button input[type="file"][b-qzb6afwgt7] { display: none; }
.remove-photo-button[b-qzb6afwgt7] { border: 1px solid rgba(179,68,61,.16); color: #a64640; background: #fff4f2; }

.household-view-modal[b-qzb6afwgt7] { width: min(100%,780px); overflow-y: auto; }
.view-cover[b-qzb6afwgt7] { position: relative; height: 270px; overflow: hidden; background: linear-gradient(145deg,color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)),color-mix(in srgb, var(--theme-dark) 86%, black)); }
.view-cover > img[b-qzb6afwgt7] { width: 100%; height: 100%; object-fit: cover; }
.view-cover-empty[b-qzb6afwgt7] { display: grid; width: 100%; height: 100%; place-items: center; color: rgba(255,255,255,.45); }
.view-cover-empty .mud-icon-root[b-qzb6afwgt7] { font-size: 5rem; }
.view-close[b-qzb6afwgt7] { position: absolute; top: 13px; right: 13px; display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; color: #fff; background: rgba(3,45,36,.55); cursor: pointer; }
.view-head-photo[b-qzb6afwgt7] { position: absolute; left: 24px; bottom: -52px; display: grid; width: 112px; height: 112px; place-items: center; overflow: hidden; border: 5px solid #fff; border-radius: 24px; color: #fff; background: linear-gradient(145deg,#2c83b1,#17597e); box-shadow: 0 15px 32px rgba(3,45,36,.24); font-size: 1.2rem; }
.view-head-photo img[b-qzb6afwgt7] { width: 100%; height: 100%; object-fit: cover; }
.view-content[b-qzb6afwgt7] { padding: 70px 24px 25px; }
.view-heading[b-qzb6afwgt7] { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.view-heading small[b-qzb6afwgt7] { color: #9d7a35; font-size: .53rem; font-weight: 750; letter-spacing: .08em; }
.view-heading h2[b-qzb6afwgt7] { margin: 3px 0 0; color: var(--theme-ink); font-size: 1.25rem; }
.view-heading p[b-qzb6afwgt7] { margin: 3px 0 0; color: #87958f; font-size: .60rem; }
.view-status-row[b-qzb6afwgt7] { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.view-head-card[b-qzb6afwgt7] { margin-top: 16px; padding: 14px; border: 1px solid rgba(7,88,67,.09); border-radius: 14px; background: #f5f9f7; }
.view-head-card > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.view-head-card span[b-qzb6afwgt7],
.view-info-grid span[b-qzb6afwgt7],
.view-note small[b-qzb6afwgt7],
.location-card span[b-qzb6afwgt7] { color: #8b9993; font-size: .52rem; }
.view-head-card strong[b-qzb6afwgt7] { margin-top: 3px; color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .72rem; }
.view-head-card small[b-qzb6afwgt7] { margin-top: 3px; color: var(--theme-muted); font-size: .54rem; }
.view-info-grid[b-qzb6afwgt7] { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 13px; }
.view-info-grid > div[b-qzb6afwgt7] { display: flex; min-height: 70px; justify-content: center; flex-direction: column; padding: 11px 13px; border: 1px solid rgba(7,88,67,.09); border-radius: 13px; background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.view-info-grid strong[b-qzb6afwgt7] { margin-top: 3px; color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .64rem; }
.utility-panel[b-qzb6afwgt7] { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 13px; }
.utility-panel > div[b-qzb6afwgt7] { display: flex; min-height: 68px; align-items: center; gap: 10px; padding: 11px; border-radius: 13px; }
.utility-panel .available[b-qzb6afwgt7] { color: var(--theme-primary); background: #eff9f4; }
.utility-panel .unavailable[b-qzb6afwgt7] { color: #aa453e; background: #fff4f2; }
.utility-panel span[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.utility-panel strong[b-qzb6afwgt7] { color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .60rem; }
.utility-panel small[b-qzb6afwgt7] { margin-top: 2px; color: #8b9993; font-size: .49rem; }
.location-card[b-qzb6afwgt7] { display: flex; align-items: center; gap: 10px; margin-top: 13px; padding: 13px; border: 1px solid rgba(7,88,67,.09); border-radius: 13px; background: color-mix(in srgb, var(--theme-bg) 58%, white); color: var(--theme-primary); }
.location-card > div[b-qzb6afwgt7] { display: flex; flex-direction: column; }
.location-card strong[b-qzb6afwgt7] { margin-top: 3px; color: color-mix(in srgb, var(--theme-ink) 80%, white); font-size: .62rem; }
.view-note[b-qzb6afwgt7] { margin-top: 13px; padding: 13px; border: 1px dashed rgba(7,88,67,.15); border-radius: 13px; }
.view-note p[b-qzb6afwgt7] { margin: 4px 0 0; color: var(--theme-muted); font-size: .61rem; line-height: 1.65; }

.image-preview-backdrop[b-qzb6afwgt7] { position: fixed; inset: 0; z-index: 5000; display: grid; place-items: center; padding: 24px; background: rgba(2,24,19,.86); backdrop-filter: blur(10px); }
.image-preview-modal[b-qzb6afwgt7] { display: grid; grid-template-rows: auto minmax(0,1fr); width: min(1100px,96vw); max-height: 94dvh; overflow: hidden; border: 1px solid rgba(231,207,152,.30); border-radius: 22px; background: #fff; box-shadow: 0 35px 100px rgba(0,0,0,.45); }
.image-preview-header[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 17px; border-bottom: 1px solid rgba(7,88,67,.10); background: linear-gradient(145deg,color-mix(in srgb, var(--theme-bg) 58%, white),#eef5f1); }
.image-preview-header small[b-qzb6afwgt7] { color: #9c7932; font-size: .49rem; font-weight: 750; letter-spacing: .10em; }
.image-preview-header h3[b-qzb6afwgt7] { margin: 2px 0 0; color: var(--theme-ink); font-size: .84rem; }
.image-preview-body[b-qzb6afwgt7] { display: grid; min-height: 0; place-items: center; padding: 15px; overflow: auto; background: #eef3f0; }
.image-preview-body img[b-qzb6afwgt7] { max-width: 100%; max-height: calc(94dvh - 95px); object-fit: contain; border-radius: 12px; box-shadow: 0 15px 42px rgba(3,45,36,.20); }

.delete-modal[b-qzb6afwgt7] { width: min(100%,440px); padding: 27px; text-align: center; }
.delete-icon[b-qzb6afwgt7] { display: grid; width: 68px; height: 68px; place-items: center; margin: 0 auto; border-radius: 21px; color: #fff; background: linear-gradient(145deg,#e36b65,#ad3d38); box-shadow: 0 13px 30px rgba(173,61,56,.22); }
.delete-modal h2[b-qzb6afwgt7] { margin: 17px 0 0; color: #3f3532; font-size: 1.08rem; }
.delete-modal p[b-qzb6afwgt7] { margin: 8px 0 0; color: #7b716e; font-size: .65rem; line-height: 1.65; }
.delete-modal p strong[b-qzb6afwgt7] { color: #963b36; }
.delete-warning[b-qzb6afwgt7] { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 15px; padding: 10px; border: 1px solid rgba(186,70,62,.12); border-radius: 12px; color: #a34a43; background: #fff3f1; font-size: .57rem; }
.delete-actions[b-qzb6afwgt7] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 18px; }
.household-page[b-qzb6afwgt7]  .delete-confirm-button { color: #fff !important; background: linear-gradient(145deg,#d95f59,#a93c37) !important; box-shadow: 0 9px 21px rgba(169,60,55,.18); }

@media (max-width: 1150px) {
    .household-hero[b-qzb6afwgt7] { grid-template-columns: minmax(0,1fr); }
    .hero-action-panel[b-qzb6afwgt7] { max-width: 570px; }
    .list-toolbar[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .toolbar-actions[b-qzb6afwgt7] { justify-content: flex-end; }
}

@media (max-width: 760px) {
    .household-page[b-qzb6afwgt7] { padding: 15px 12px 30px; }
    .household-hero[b-qzb6afwgt7] { padding: 27px 21px; border-radius: 23px; }
    .hero-content h1[b-qzb6afwgt7] { font-size: 2.3rem; }
    .hero-meta[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .hero-meta > span[b-qzb6afwgt7] { width: 100%; }
    .filter-heading[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .toolbar-actions[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .household-page[b-qzb6afwgt7]  .sort-select { width: 100%; }
    .pagination-bar[b-qzb6afwgt7] { align-items: flex-start; flex-direction: column; }
    .modal-backdrop[b-qzb6afwgt7] { align-items: end; padding: 0; }
    .household-form-modal[b-qzb6afwgt7],
    .household-view-modal[b-qzb6afwgt7] { width: 100%; max-height: 94dvh; border-radius: 23px 23px 0 0; }
    .delete-modal[b-qzb6afwgt7] { width: calc(100% - 24px); margin-bottom: 12px; }
    .photo-upload-grid[b-qzb6afwgt7],
    .view-info-grid[b-qzb6afwgt7],
    .utility-panel[b-qzb6afwgt7] { grid-template-columns: minmax(0,1fr); }
    .view-cover[b-qzb6afwgt7] { height: 220px; }
}

@media (max-width: 520px) {
    .filter-panel[b-qzb6afwgt7],
    .household-list-panel[b-qzb6afwgt7] { padding: 17px; border-radius: 19px; }
    .modal-header[b-qzb6afwgt7] { align-items: flex-start; }
    .modal-icon[b-qzb6afwgt7] { display: none; }
    .modal-footer[b-qzb6afwgt7] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .household-page[b-qzb6afwgt7]  .save-button { min-width: 0; }
    .view-heading[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .photo-upload-actions[b-qzb6afwgt7] { align-items: stretch; flex-direction: column; }
    .image-preview-backdrop[b-qzb6afwgt7] { padding: 0; }
    .image-preview-modal[b-qzb6afwgt7] { width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
}
/* /Components/Pages/01Ziticen/02Citizens/IdentityVerification.razor.rz.scp.css */
.verification-page[b-4vjkrczbwy] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.verification-page[b-4vjkrczbwy]  .verification-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.verification-hero[b-4vjkrczbwy] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-4vjkrczbwy] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-4vjkrczbwy] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-4vjkrczbwy] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-4vjkrczbwy] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-4vjkrczbwy] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-4vjkrczbwy] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-4vjkrczbwy] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-4vjkrczbwy] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.15rem, 3.8vw, 4.15rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-4vjkrczbwy] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-4vjkrczbwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-4vjkrczbwy] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-4vjkrczbwy] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-4vjkrczbwy] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.verification-page[b-4vjkrczbwy]  .hero-add-button,
.verification-page[b-4vjkrczbwy]  .search-button,
.verification-page[b-4vjkrczbwy]  .toolbar-add-button,
.verification-page[b-4vjkrczbwy]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.verification-page[b-4vjkrczbwy]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-4vjkrczbwy] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-4vjkrczbwy] {
    opacity: .55;
    cursor: not-allowed;
}

.verification-page[b-4vjkrczbwy]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.verification-page[b-4vjkrczbwy]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-4vjkrczbwy] {
    margin-top: 7px;
}

.summary-card[b-4vjkrczbwy] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-4vjkrczbwy] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.waiting[b-4vjkrczbwy] {
    color: #2c7da8;
}

.summary-card.verified[b-4vjkrczbwy] {
    color: #7658a7;
}

.summary-card.risk[b-4vjkrczbwy] {
    color: #c05b4e;
}

.summary-line[b-4vjkrczbwy] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-4vjkrczbwy] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-4vjkrczbwy] {
    min-width: 0;
}

.summary-card small[b-4vjkrczbwy] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-4vjkrczbwy] {
    display: flex;
    align-items: baseline;
    gap: 7px;

    margin: 4px 0 0;
}

.summary-card p strong[b-4vjkrczbwy] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-4vjkrczbwy] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-4vjkrczbwy] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-4vjkrczbwy],
.verification-list-panel[b-4vjkrczbwy] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-4vjkrczbwy],
.list-toolbar[b-4vjkrczbwy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 17px;
}

.filter-heading > div > span[b-4vjkrczbwy],
.panel-kicker[b-4vjkrczbwy] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-4vjkrczbwy],
.list-toolbar h2[b-4vjkrczbwy] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-4vjkrczbwy],
.list-toolbar p[b-4vjkrczbwy] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-4vjkrczbwy] {
    align-items: center;
}

.verification-page[b-4vjkrczbwy]  .premium-field,
.verification-page[b-4vjkrczbwy]  .form-field {
    width: 100%;
}

.verification-page[b-4vjkrczbwy]  .premium-field .mud-input-outlined-border,
.verification-page[b-4vjkrczbwy]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.verification-page[b-4vjkrczbwy]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.verification-page[b-4vjkrczbwy]  .sort-select {
    width: 170px;
}

.verification-page[b-4vjkrczbwy]  .toolbar-add-button {
    min-height: 42px;
}

.verification-page[b-4vjkrczbwy]  .verification-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.verification-page[b-4vjkrczbwy]  .verification-table .mud-table-head {
    background: #eef6f2;
}

.verification-page[b-4vjkrczbwy]  .verification-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .64rem;
}

.verification-no[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-4vjkrczbwy] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-4vjkrczbwy],
.view-avatar[b-4vjkrczbwy] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-4vjkrczbwy],
.view-avatar.female[b-4vjkrczbwy] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-4vjkrczbwy],
.view-avatar.other[b-4vjkrczbwy] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-4vjkrczbwy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-4vjkrczbwy],
.person-name small[b-4vjkrczbwy] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-4vjkrczbwy] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.person-name small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .51rem;
}

.national-id[b-4vjkrczbwy] {
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.method-chip[b-4vjkrczbwy],
.risk-chip[b-4vjkrczbwy],
.status-chip[b-4vjkrczbwy],
.score-badge[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .51rem;
    font-weight: 620;
    white-space: nowrap;
}

.method-chip[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.method-chip.document[b-4vjkrczbwy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.method-chip.face[b-4vjkrczbwy] {
    color: #7658a7;
    background: #f0eafb;
}

.method-chip.otp[b-4vjkrczbwy] {
    color: #95671d;
    background: #fff1d7;
}

.method-chip.officer[b-4vjkrczbwy] {
    color: #5b6874;
    background: #eaf0f4;
}

.check-result-list[b-4vjkrczbwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    min-width: 150px;
}

.check-result-list span[b-4vjkrczbwy] {
    display: inline-flex;
    align-items: center;
    gap: 3px;

    padding: 3px 5px;

    border-radius: 7px;
    font-size: .48rem;
}

.check-result-list .passed[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.check-result-list .failed[b-4vjkrczbwy] {
    color: #aa453e;
    background: #fff0ef;
}

.score-cell[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: minmax(80px, 1fr) 38px;
    align-items: center;
    gap: 7px;

    min-width: 125px;
}

.score-cell strong[b-4vjkrczbwy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.risk-chip.low[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.risk-chip.medium[b-4vjkrczbwy] {
    color: #94651b;
    background: #fff1d7;
}

.risk-chip.high[b-4vjkrczbwy] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip[b-4vjkrczbwy] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-4vjkrczbwy] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-4vjkrczbwy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-4vjkrczbwy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.verified[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-4vjkrczbwy] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.expired[b-4vjkrczbwy] {
    color: #6c7680;
    background: #e9eef1;
}

.reviewer-cell[b-4vjkrczbwy] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.reviewer-cell strong[b-4vjkrczbwy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
}

.reviewer-cell small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
}

.row-actions[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.verification-page[b-4vjkrczbwy]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.verification-page[b-4vjkrczbwy]  .row-action.view {
    color: #2d79a2;
}

.verification-page[b-4vjkrczbwy]  .row-action.edit {
    color: var(--theme-primary);
}

.verification-page[b-4vjkrczbwy]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.verification-page[b-4vjkrczbwy]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-4vjkrczbwy] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-4vjkrczbwy] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-4vjkrczbwy] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-4vjkrczbwy] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-4vjkrczbwy] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.verification-form-modal[b-4vjkrczbwy],
.verification-view-modal[b-4vjkrczbwy],
.delete-modal[b-4vjkrczbwy] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-4vjkrczbwy .22s ease-out;
}

@keyframes modalAppear-b-4vjkrczbwy {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.verification-form-modal[b-4vjkrczbwy] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-4vjkrczbwy] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-4vjkrczbwy] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-4vjkrczbwy] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-4vjkrczbwy] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-4vjkrczbwy] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-4vjkrczbwy] {
    margin-top: 24px;
}

.form-section-title > span[b-4vjkrczbwy] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-4vjkrczbwy] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-4vjkrczbwy] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-4vjkrczbwy] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-4vjkrczbwy] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.verification-page[b-4vjkrczbwy]  .cancel-button,
.verification-page[b-4vjkrczbwy]  .save-button,
.verification-page[b-4vjkrczbwy]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.verification-page[b-4vjkrczbwy]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.verification-page[b-4vjkrczbwy]  .save-button {
    min-width: 180px;
}

.verification-view-modal[b-4vjkrczbwy] {
    width: min(100%, 760px);
    overflow-y: auto;
}

.view-cover[b-4vjkrczbwy] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-4vjkrczbwy] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-4vjkrczbwy] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-4vjkrczbwy] {
    padding: 61px 24px 25px;
}

.view-heading[b-4vjkrczbwy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-4vjkrczbwy] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-4vjkrczbwy] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-4vjkrczbwy] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-4vjkrczbwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.score-badge[b-4vjkrczbwy] {
    color: #7658a7;
    background: #f0eafb;
}

.verification-check-grid[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.verification-check-grid > div[b-4vjkrczbwy] {
    display: flex;
    min-height: 70px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.verification-check-grid > div.passed[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: #eff9f4;
}

.verification-check-grid > div.failed[b-4vjkrczbwy] {
    color: #aa453e;
    background: #fff4f2;
}

.verification-check-grid span[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.verification-check-grid strong[b-4vjkrczbwy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.verification-check-grid small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: #8b9993;
    font-size: .50rem;
}

.view-info-grid[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-4vjkrczbwy] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-4vjkrczbwy],
.view-note small[b-4vjkrczbwy] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-4vjkrczbwy] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-note[b-4vjkrczbwy] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note.danger[b-4vjkrczbwy] {
    border-color: rgba(181, 71, 64, .22);
    background: #fff5f3;
}

.view-note p[b-4vjkrczbwy] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-4vjkrczbwy] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-4vjkrczbwy] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-4vjkrczbwy] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-4vjkrczbwy] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-4vjkrczbwy] {
    color: #963b36;
}

.delete-warning[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.verification-page[b-4vjkrczbwy]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .verification-hero[b-4vjkrczbwy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-4vjkrczbwy] {
        max-width: 570px;
    }

    .list-toolbar[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-4vjkrczbwy] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .verification-page[b-4vjkrczbwy] {
        padding: 15px 12px 30px;
    }

    .verification-hero[b-4vjkrczbwy] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-4vjkrczbwy] {
        font-size: 2.2rem;
    }

    .hero-meta[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-4vjkrczbwy] {
        width: 100%;
    }

    .filter-heading[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .verification-page[b-4vjkrczbwy]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-4vjkrczbwy] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-4vjkrczbwy] {
        align-items: end;
        padding: 0;
    }

    .verification-form-modal[b-4vjkrczbwy],
    .verification-view-modal[b-4vjkrczbwy] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-4vjkrczbwy] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-4vjkrczbwy],
    .verification-check-grid[b-4vjkrczbwy] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-4vjkrczbwy],
    .verification-list-panel[b-4vjkrczbwy] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-4vjkrczbwy] {
        align-items: flex-start;
    }

    .modal-icon[b-4vjkrczbwy] {
        display: none;
    }

    .modal-footer[b-4vjkrczbwy] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .verification-page[b-4vjkrczbwy]  .save-button {
        min-width: 0;
    }

    .view-heading[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-4vjkrczbwy],
    .verification-form-modal[b-4vjkrczbwy],
    .verification-view-modal[b-4vjkrczbwy],
    .delete-modal[b-4vjkrczbwy] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PHOTO VERIFICATION
   ========================================================= */
.photo-pair-mini[b-4vjkrczbwy] {
    display: flex;
    min-width: 118px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-4vjkrczbwy] {
    position: relative;

    display: grid;
    width: 52px;
    height: 56px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 11px;

    color: #678078;
    background: #edf5f1;

    cursor: pointer;
}

.mini-photo-button.card[b-4vjkrczbwy] {
    width: 60px;
}

.mini-photo-button img[b-4vjkrczbwy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mini-photo-button.card img[b-4vjkrczbwy] {
    object-fit: cover;
}

.mini-photo-button small[b-4vjkrczbwy] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .40rem;
    line-height: 1;
    text-align: center;
}

.photo-upload-grid[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-4vjkrczbwy] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background:
        linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-4vjkrczbwy] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-4vjkrczbwy] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-4vjkrczbwy] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-4vjkrczbwy] {
    margin-top: 2px;
    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-4vjkrczbwy] {
    position: relative;

    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background:
        linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.member-preview[b-4vjkrczbwy] {
    min-height: 320px;
}

.id-card-preview[b-4vjkrczbwy] {
    min-height: 250px;
}

.photo-preview img[b-4vjkrczbwy] {
    width: 100%;
    height: 100%;
    max-height: 360px;

    object-fit: contain;
    background: #e9f0ed;
}

.member-preview img[b-4vjkrczbwy] {
    object-fit: contain;
}

.photo-empty[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-4vjkrczbwy] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-4vjkrczbwy] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-4vjkrczbwy] {
    margin-top: 4px;
    font-size: .50rem;
}

.photo-upload-actions[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-4vjkrczbwy],
.remove-photo-button[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-4vjkrczbwy] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-4vjkrczbwy] {
    display: none;
}

.remove-photo-button[b-4vjkrczbwy] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.verification-page[b-4vjkrczbwy]  .photo-security-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.photo-comparison-panel[b-4vjkrczbwy] {
    margin-top: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background:
        radial-gradient(circle at 50% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), var(--theme-bg));
}

.comparison-heading[b-4vjkrczbwy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.comparison-heading small[b-4vjkrczbwy] {
    color: #9d7a35;
    font-size: .50rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.comparison-heading h3[b-4vjkrczbwy] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.comparison-heading p[b-4vjkrczbwy] {
    margin: 2px 0 0;
    color: #88968f;
    font-size: .52rem;
}

.face-match-chip[b-4vjkrczbwy] {
    display: inline-flex;
    min-height: 31px;
    align-items: center;
    gap: 5px;

    padding: 0 10px;

    border-radius: 999px;

    font-size: .52rem;
    font-weight: 650;
    white-space: nowrap;
}

.face-match-chip.matched[b-4vjkrczbwy] {
    color: var(--theme-primary);
    background: #e5f6ee;
}

.face-match-chip.not-matched[b-4vjkrczbwy] {
    color: #aa453e;
    background: #fff0ef;
}

.comparison-grid[b-4vjkrczbwy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 108px minmax(0, 1fr);

    align-items: center;
    gap: 14px;

    margin-top: 14px;
}

.comparison-photo[b-4vjkrczbwy] {
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background: #fff;
}

.comparison-label[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    gap: 5px;

    margin-bottom: 8px;

    color: #48655b;
    font-size: .55rem;
    font-weight: 650;
}

.comparison-image-button[b-4vjkrczbwy] {
    display: grid;
    width: 100%;
    height: 285px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 0;
    border-radius: 12px;

    background: #eaf1ee;
    cursor: zoom-in;
}

.comparison-photo.card .comparison-image-button[b-4vjkrczbwy] {
    height: 230px;
}

.comparison-image-button img[b-4vjkrczbwy] {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.comparison-empty[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    color: #84958e;
    font-size: .57rem;
}

.comparison-empty .mud-icon-root[b-4vjkrczbwy] {
    font-size: 2.2rem;
}

.comparison-score[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
}

.score-ring[b-4vjkrczbwy] {
    display: grid;
    width: 96px;
    height: 96px;
    place-items: center;
    align-content: center;

    border-radius: 50%;

    background:
        radial-gradient(circle, #fff 58%, transparent 60%),
        conic-gradient(
            var(--theme-primary) calc(var(--score) * 1%),
            #dfe9e4 0
        );

    box-shadow: 0 10px 25px rgba(4, 61, 47, .11);
}

.score-ring strong[b-4vjkrczbwy] {
    color: #154a39;
    font-size: 1rem;
    line-height: 1;
}

.score-ring small[b-4vjkrczbwy] {
    margin-top: 3px;
    color: #83918b;
    font-size: .42rem;
}

.comparison-arrow[b-4vjkrczbwy] {
    color: #b38d43;
}

.image-preview-backdrop[b-4vjkrczbwy] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-4vjkrczbwy] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;

    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-4vjkrczbwy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-4vjkrczbwy] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-4vjkrczbwy] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-4vjkrczbwy] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-4vjkrczbwy] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;

    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

@media (max-width: 800px) {
    .photo-upload-grid[b-4vjkrczbwy],
    .comparison-grid[b-4vjkrczbwy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .comparison-score[b-4vjkrczbwy] {
        flex-direction: row;
    }

    .comparison-photo.card .comparison-image-button[b-4vjkrczbwy],
    .comparison-image-button[b-4vjkrczbwy] {
        height: auto;
        min-height: 220px;
        max-height: 360px;
    }

    .photo-upload-actions[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .comparison-heading[b-4vjkrczbwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-4vjkrczbwy] {
        padding: 0;
    }

    .image-preview-modal[b-4vjkrczbwy] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;
        border-radius: 0;
    }
}
/* /Components/Pages/01Ziticen/03requests/AllRequests.razor.rz.scp.css */
.request-page[b-6xwjrq777k] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.request-page[b-6xwjrq777k]  .request-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.request-hero[b-6xwjrq777k] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-6xwjrq777k] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-6xwjrq777k] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-6xwjrq777k] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-6xwjrq777k] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-6xwjrq777k] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-6xwjrq777k] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-6xwjrq777k] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-6xwjrq777k] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-6xwjrq777k] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-6xwjrq777k] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-6xwjrq777k] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-6xwjrq777k] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-6xwjrq777k] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-6xwjrq777k] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-6xwjrq777k] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-6xwjrq777k] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-6xwjrq777k] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.request-page[b-6xwjrq777k]  .hero-add-button,
.request-page[b-6xwjrq777k]  .search-button,
.request-page[b-6xwjrq777k]  .toolbar-add-button,
.request-page[b-6xwjrq777k]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.request-page[b-6xwjrq777k]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-6xwjrq777k] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-6xwjrq777k] {
    opacity: .55;
    cursor: not-allowed;
}

.request-page[b-6xwjrq777k]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.request-page[b-6xwjrq777k]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-6xwjrq777k] {
    margin-top: 7px;
}

.summary-card[b-6xwjrq777k] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-6xwjrq777k] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-6xwjrq777k] {
    color: #2c7da8;
}

.summary-card.pending[b-6xwjrq777k] {
    color: #7658a7;
}

.summary-card.urgent[b-6xwjrq777k] {
    color: #c05b4e;
}

.summary-line[b-6xwjrq777k] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-6xwjrq777k] {
    min-width: 0;
}

.summary-card small[b-6xwjrq777k] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-6xwjrq777k] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-6xwjrq777k] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-6xwjrq777k] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-6xwjrq777k] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-6xwjrq777k],
.request-list-panel[b-6xwjrq777k] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-6xwjrq777k],
.list-toolbar[b-6xwjrq777k] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-6xwjrq777k],
.panel-kicker[b-6xwjrq777k] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-6xwjrq777k],
.list-toolbar h2[b-6xwjrq777k] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-6xwjrq777k],
.list-toolbar p[b-6xwjrq777k] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-6xwjrq777k] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-6xwjrq777k] {
    align-items: center;
}

.request-page[b-6xwjrq777k]  .premium-field,
.request-page[b-6xwjrq777k]  .form-field {
    width: 100%;
}

.request-page[b-6xwjrq777k]  .premium-field .mud-input-outlined-border,
.request-page[b-6xwjrq777k]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.request-page[b-6xwjrq777k]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.request-page[b-6xwjrq777k]  .sort-select {
    width: 170px;
}

.request-page[b-6xwjrq777k]  .toolbar-add-button {
    min-height: 42px;
}

.request-page[b-6xwjrq777k]  .request-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.request-page[b-6xwjrq777k]  .request-table .mud-table-head {
    background: #eef6f2;
}

.request-page[b-6xwjrq777k]  .request-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.request-no[b-6xwjrq777k] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-6xwjrq777k] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-6xwjrq777k],
.mini-photo-empty[b-6xwjrq777k] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-6xwjrq777k] {
    cursor: zoom-in;
}

.mini-photo-button img[b-6xwjrq777k] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-6xwjrq777k] {
    object-fit: cover;
}

.mini-photo-button small[b-6xwjrq777k] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-6xwjrq777k] {
    color: #9c7b38;
}

.applicant-cell[b-6xwjrq777k] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-6xwjrq777k] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-6xwjrq777k],
.applicant-cell small[b-6xwjrq777k] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-6xwjrq777k] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-6xwjrq777k] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-6xwjrq777k] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-6xwjrq777k] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-6xwjrq777k],
.channel-chip[b-6xwjrq777k],
.priority-chip[b-6xwjrq777k],
.status-chip[b-6xwjrq777k] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-6xwjrq777k] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-6xwjrq777k],
.type-chip.construction[b-6xwjrq777k] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-6xwjrq777k],
.type-chip.food_license[b-6xwjrq777k],
.type-chip.tax[b-6xwjrq777k] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-6xwjrq777k] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-6xwjrq777k],
.type-chip.environment[b-6xwjrq777k] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-6xwjrq777k] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-6xwjrq777k],
.date-cell[b-6xwjrq777k] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-6xwjrq777k],
.date-cell strong[b-6xwjrq777k] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-6xwjrq777k],
.date-cell small[b-6xwjrq777k] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-6xwjrq777k] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-6xwjrq777k] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-6xwjrq777k] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-6xwjrq777k] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-6xwjrq777k] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-6xwjrq777k] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-6xwjrq777k] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-6xwjrq777k] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-6xwjrq777k] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-6xwjrq777k] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-6xwjrq777k] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-6xwjrq777k] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-6xwjrq777k] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-6xwjrq777k] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-6xwjrq777k] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-6xwjrq777k] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.request-page[b-6xwjrq777k]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.request-page[b-6xwjrq777k]  .row-action.view {
    color: #2d79a2;
}

.request-page[b-6xwjrq777k]  .row-action.edit {
    color: var(--theme-primary);
}

.request-page[b-6xwjrq777k]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.request-page[b-6xwjrq777k]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-6xwjrq777k] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-6xwjrq777k] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-6xwjrq777k] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-6xwjrq777k] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-6xwjrq777k] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.request-form-modal[b-6xwjrq777k],
.request-view-modal[b-6xwjrq777k],
.delete-modal[b-6xwjrq777k] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-6xwjrq777k .22s ease-out;
}

@keyframes modalAppear-b-6xwjrq777k {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.request-form-modal[b-6xwjrq777k] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-6xwjrq777k] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-6xwjrq777k] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-6xwjrq777k] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-6xwjrq777k] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-6xwjrq777k] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-6xwjrq777k] {
    margin-top: 24px;
}

.form-section-title > span[b-6xwjrq777k] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-6xwjrq777k] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-6xwjrq777k] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-6xwjrq777k] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-6xwjrq777k] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-6xwjrq777k] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-6xwjrq777k] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-6xwjrq777k] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-6xwjrq777k] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-6xwjrq777k] {
    min-height: 310px;
}

.photo-preview img[b-6xwjrq777k] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-6xwjrq777k] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-6xwjrq777k] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-6xwjrq777k] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-6xwjrq777k],
.remove-photo-button[b-6xwjrq777k] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-6xwjrq777k] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-6xwjrq777k] {
    display: none;
}

.remove-photo-button[b-6xwjrq777k] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.request-page[b-6xwjrq777k]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.request-page[b-6xwjrq777k]  .cancel-button,
.request-page[b-6xwjrq777k]  .save-button,
.request-page[b-6xwjrq777k]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.request-page[b-6xwjrq777k]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.request-page[b-6xwjrq777k]  .save-button {
    min-width: 170px;
}

.request-view-modal[b-6xwjrq777k] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-6xwjrq777k] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-6xwjrq777k] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-6xwjrq777k] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-6xwjrq777k] {
    font-size: 5rem;
}

.view-cover-overlay[b-6xwjrq777k] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-6xwjrq777k] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-6xwjrq777k] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-6xwjrq777k] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-6xwjrq777k] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-6xwjrq777k] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-6xwjrq777k] {
    padding: 22px;
}

.view-toolbar[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-6xwjrq777k] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-6xwjrq777k] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-6xwjrq777k] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-6xwjrq777k],
.view-info-grid span[b-6xwjrq777k],
.view-description small[b-6xwjrq777k],
.attachment-heading small[b-6xwjrq777k],
.view-note small[b-6xwjrq777k] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-6xwjrq777k] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-6xwjrq777k] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-6xwjrq777k] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-6xwjrq777k] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-6xwjrq777k] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-6xwjrq777k] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-6xwjrq777k] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-6xwjrq777k] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-6xwjrq777k] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-6xwjrq777k] {
    background: #f3efe5;
}

.attachment-card img[b-6xwjrq777k] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-6xwjrq777k] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-6xwjrq777k] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-6xwjrq777k] {
    font-size: 2.3rem;
}

.view-note[b-6xwjrq777k] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-6xwjrq777k] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-6xwjrq777k] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-6xwjrq777k] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-6xwjrq777k] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-6xwjrq777k] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-6xwjrq777k] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-6xwjrq777k] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-6xwjrq777k] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-6xwjrq777k] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-6xwjrq777k] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-6xwjrq777k] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-6xwjrq777k] {
    color: #963b36;
}

.delete-warning[b-6xwjrq777k] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.request-page[b-6xwjrq777k]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .request-hero[b-6xwjrq777k] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-6xwjrq777k] {
        max-width: 570px;
    }

    .list-toolbar[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-6xwjrq777k] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .request-page[b-6xwjrq777k] {
        padding: 15px 12px 30px;
    }

    .request-hero[b-6xwjrq777k] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-6xwjrq777k] {
        font-size: 2.3rem;
    }

    .hero-meta[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-6xwjrq777k] {
        width: 100%;
    }

    .filter-heading[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }

    .request-page[b-6xwjrq777k]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-6xwjrq777k] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-6xwjrq777k],
    .attachment-grid[b-6xwjrq777k] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-6xwjrq777k],
    .view-info-grid[b-6xwjrq777k] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-6xwjrq777k] {
        align-items: end;
        padding: 0;
    }

    .request-form-modal[b-6xwjrq777k],
    .request-view-modal[b-6xwjrq777k] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-6xwjrq777k] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-6xwjrq777k],
    .request-list-panel[b-6xwjrq777k] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-6xwjrq777k] {
        align-items: flex-start;
    }

    .modal-icon[b-6xwjrq777k] {
        display: none;
    }

    .modal-footer[b-6xwjrq777k] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .request-page[b-6xwjrq777k]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-6xwjrq777k] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-6xwjrq777k] {
        padding: 0;
    }

    .image-preview-modal[b-6xwjrq777k] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-6xwjrq777k],
    .request-form-modal[b-6xwjrq777k],
    .request-view-modal[b-6xwjrq777k],
    .delete-modal[b-6xwjrq777k] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   ALL REQUEST STATUS OVERVIEW
   ========================================================= */
.status-overview[b-6xwjrq777k] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-6xwjrq777k] {
    display: flex;
    min-height: 88px;
    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #ffffff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.status-overview-card:hover[b-6xwjrq777k],
.status-overview-card.active[b-6xwjrq777k] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .27);
    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-6xwjrq777k] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-6xwjrq777k] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-6xwjrq777k] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-6xwjrq777k] {
    margin-top: 2px;
    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-6xwjrq777k] {
    background: #2d78a4;
}

.status-overview-card.review > span[b-6xwjrq777k] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-6xwjrq777k] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-6xwjrq777k] {
    background: var(--theme-primary);
}

.status-overview-card.cancelled > span[b-6xwjrq777k] {
    background: #aa453e;
}

.status-overview-card.active[b-6xwjrq777k] {
    background: linear-gradient(145deg, #eff8f4, #ffffff);
}

@media (max-width: 1200px) {
    .status-overview[b-6xwjrq777k] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .status-overview[b-6xwjrq777k] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/01Ziticen/03requests/NewRequests.razor.rz.scp.css */
.request-page[b-em0qbi0zj9] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.request-page[b-em0qbi0zj9]  .request-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.request-hero[b-em0qbi0zj9] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-em0qbi0zj9] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-em0qbi0zj9] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-em0qbi0zj9] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-em0qbi0zj9] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-em0qbi0zj9] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-em0qbi0zj9] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-em0qbi0zj9] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-em0qbi0zj9] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-em0qbi0zj9] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-em0qbi0zj9] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-em0qbi0zj9] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-em0qbi0zj9] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-em0qbi0zj9] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-em0qbi0zj9] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-em0qbi0zj9] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-em0qbi0zj9] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-em0qbi0zj9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.request-page[b-em0qbi0zj9]  .hero-add-button,
.request-page[b-em0qbi0zj9]  .search-button,
.request-page[b-em0qbi0zj9]  .toolbar-add-button,
.request-page[b-em0qbi0zj9]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.request-page[b-em0qbi0zj9]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-em0qbi0zj9] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-em0qbi0zj9] {
    opacity: .55;
    cursor: not-allowed;
}

.request-page[b-em0qbi0zj9]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.request-page[b-em0qbi0zj9]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-em0qbi0zj9] {
    margin-top: 7px;
}

.summary-card[b-em0qbi0zj9] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-em0qbi0zj9] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-em0qbi0zj9] {
    color: #2c7da8;
}

.summary-card.pending[b-em0qbi0zj9] {
    color: #7658a7;
}

.summary-card.urgent[b-em0qbi0zj9] {
    color: #c05b4e;
}

.summary-line[b-em0qbi0zj9] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-em0qbi0zj9] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-em0qbi0zj9] {
    min-width: 0;
}

.summary-card small[b-em0qbi0zj9] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-em0qbi0zj9] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-em0qbi0zj9] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-em0qbi0zj9] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-em0qbi0zj9] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-em0qbi0zj9],
.request-list-panel[b-em0qbi0zj9] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-em0qbi0zj9],
.list-toolbar[b-em0qbi0zj9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-em0qbi0zj9],
.panel-kicker[b-em0qbi0zj9] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-em0qbi0zj9],
.list-toolbar h2[b-em0qbi0zj9] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-em0qbi0zj9],
.list-toolbar p[b-em0qbi0zj9] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-em0qbi0zj9] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-em0qbi0zj9] {
    align-items: center;
}

.request-page[b-em0qbi0zj9]  .premium-field,
.request-page[b-em0qbi0zj9]  .form-field {
    width: 100%;
}

.request-page[b-em0qbi0zj9]  .premium-field .mud-input-outlined-border,
.request-page[b-em0qbi0zj9]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.request-page[b-em0qbi0zj9]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.request-page[b-em0qbi0zj9]  .sort-select {
    width: 170px;
}

.request-page[b-em0qbi0zj9]  .toolbar-add-button {
    min-height: 42px;
}

.request-page[b-em0qbi0zj9]  .request-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.request-page[b-em0qbi0zj9]  .request-table .mud-table-head {
    background: #eef6f2;
}

.request-page[b-em0qbi0zj9]  .request-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.request-no[b-em0qbi0zj9] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-em0qbi0zj9] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-em0qbi0zj9],
.mini-photo-empty[b-em0qbi0zj9] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-em0qbi0zj9] {
    cursor: zoom-in;
}

.mini-photo-button img[b-em0qbi0zj9] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-em0qbi0zj9] {
    object-fit: cover;
}

.mini-photo-button small[b-em0qbi0zj9] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-em0qbi0zj9] {
    color: #9c7b38;
}

.applicant-cell[b-em0qbi0zj9] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-em0qbi0zj9] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-em0qbi0zj9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-em0qbi0zj9],
.applicant-cell small[b-em0qbi0zj9] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-em0qbi0zj9] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-em0qbi0zj9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-em0qbi0zj9] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-em0qbi0zj9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-em0qbi0zj9],
.channel-chip[b-em0qbi0zj9],
.priority-chip[b-em0qbi0zj9],
.status-chip[b-em0qbi0zj9] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-em0qbi0zj9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-em0qbi0zj9],
.type-chip.construction[b-em0qbi0zj9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-em0qbi0zj9],
.type-chip.food_license[b-em0qbi0zj9],
.type-chip.tax[b-em0qbi0zj9] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-em0qbi0zj9] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-em0qbi0zj9],
.type-chip.environment[b-em0qbi0zj9] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-em0qbi0zj9] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-em0qbi0zj9],
.date-cell[b-em0qbi0zj9] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-em0qbi0zj9],
.date-cell strong[b-em0qbi0zj9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-em0qbi0zj9],
.date-cell small[b-em0qbi0zj9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-em0qbi0zj9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-em0qbi0zj9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-em0qbi0zj9] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-em0qbi0zj9] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-em0qbi0zj9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-em0qbi0zj9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-em0qbi0zj9] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-em0qbi0zj9] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-em0qbi0zj9] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-em0qbi0zj9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-em0qbi0zj9] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-em0qbi0zj9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-em0qbi0zj9] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-em0qbi0zj9] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-em0qbi0zj9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-em0qbi0zj9] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.request-page[b-em0qbi0zj9]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.request-page[b-em0qbi0zj9]  .row-action.view {
    color: #2d79a2;
}

.request-page[b-em0qbi0zj9]  .row-action.edit {
    color: var(--theme-primary);
}

.request-page[b-em0qbi0zj9]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.request-page[b-em0qbi0zj9]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-em0qbi0zj9] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-em0qbi0zj9] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-em0qbi0zj9] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-em0qbi0zj9] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-em0qbi0zj9] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.request-form-modal[b-em0qbi0zj9],
.request-view-modal[b-em0qbi0zj9],
.delete-modal[b-em0qbi0zj9] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-em0qbi0zj9 .22s ease-out;
}

@keyframes modalAppear-b-em0qbi0zj9 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.request-form-modal[b-em0qbi0zj9] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-em0qbi0zj9] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-em0qbi0zj9] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-em0qbi0zj9] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-em0qbi0zj9] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-em0qbi0zj9] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-em0qbi0zj9] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-em0qbi0zj9] {
    margin-top: 24px;
}

.form-section-title > span[b-em0qbi0zj9] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-em0qbi0zj9] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-em0qbi0zj9] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-em0qbi0zj9] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-em0qbi0zj9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-em0qbi0zj9] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-em0qbi0zj9] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-em0qbi0zj9] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-em0qbi0zj9] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-em0qbi0zj9] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-em0qbi0zj9] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-em0qbi0zj9] {
    min-height: 310px;
}

.photo-preview img[b-em0qbi0zj9] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-em0qbi0zj9] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-em0qbi0zj9] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-em0qbi0zj9] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-em0qbi0zj9],
.remove-photo-button[b-em0qbi0zj9] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-em0qbi0zj9] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-em0qbi0zj9] {
    display: none;
}

.remove-photo-button[b-em0qbi0zj9] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.request-page[b-em0qbi0zj9]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.request-page[b-em0qbi0zj9]  .cancel-button,
.request-page[b-em0qbi0zj9]  .save-button,
.request-page[b-em0qbi0zj9]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.request-page[b-em0qbi0zj9]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.request-page[b-em0qbi0zj9]  .save-button {
    min-width: 170px;
}

.request-view-modal[b-em0qbi0zj9] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-em0qbi0zj9] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-em0qbi0zj9] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-em0qbi0zj9] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-em0qbi0zj9] {
    font-size: 5rem;
}

.view-cover-overlay[b-em0qbi0zj9] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-em0qbi0zj9] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-em0qbi0zj9] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-em0qbi0zj9] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-em0qbi0zj9] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-em0qbi0zj9] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-em0qbi0zj9] {
    padding: 22px;
}

.view-toolbar[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-em0qbi0zj9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-em0qbi0zj9] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-em0qbi0zj9] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-em0qbi0zj9] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-em0qbi0zj9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-em0qbi0zj9],
.view-info-grid span[b-em0qbi0zj9],
.view-description small[b-em0qbi0zj9],
.attachment-heading small[b-em0qbi0zj9],
.view-note small[b-em0qbi0zj9] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-em0qbi0zj9] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-em0qbi0zj9] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-em0qbi0zj9] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-em0qbi0zj9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-em0qbi0zj9] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-em0qbi0zj9] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-em0qbi0zj9] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-em0qbi0zj9] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-em0qbi0zj9] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-em0qbi0zj9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-em0qbi0zj9] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-em0qbi0zj9] {
    background: #f3efe5;
}

.attachment-card img[b-em0qbi0zj9] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-em0qbi0zj9] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-em0qbi0zj9] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-em0qbi0zj9] {
    font-size: 2.3rem;
}

.view-note[b-em0qbi0zj9] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-em0qbi0zj9] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-em0qbi0zj9] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-em0qbi0zj9] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-em0qbi0zj9] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-em0qbi0zj9] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-em0qbi0zj9] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-em0qbi0zj9] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-em0qbi0zj9] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-em0qbi0zj9] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-em0qbi0zj9] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-em0qbi0zj9] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-em0qbi0zj9] {
    color: #963b36;
}

.delete-warning[b-em0qbi0zj9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-em0qbi0zj9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.request-page[b-em0qbi0zj9]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .request-hero[b-em0qbi0zj9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-em0qbi0zj9] {
        max-width: 570px;
    }

    .list-toolbar[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-em0qbi0zj9] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .request-page[b-em0qbi0zj9] {
        padding: 15px 12px 30px;
    }

    .request-hero[b-em0qbi0zj9] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-em0qbi0zj9] {
        font-size: 2.3rem;
    }

    .hero-meta[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-em0qbi0zj9] {
        width: 100%;
    }

    .filter-heading[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }

    .request-page[b-em0qbi0zj9]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-em0qbi0zj9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-em0qbi0zj9],
    .attachment-grid[b-em0qbi0zj9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-em0qbi0zj9],
    .view-info-grid[b-em0qbi0zj9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-em0qbi0zj9] {
        align-items: end;
        padding: 0;
    }

    .request-form-modal[b-em0qbi0zj9],
    .request-view-modal[b-em0qbi0zj9] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-em0qbi0zj9] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-em0qbi0zj9],
    .request-list-panel[b-em0qbi0zj9] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-em0qbi0zj9] {
        align-items: flex-start;
    }

    .modal-icon[b-em0qbi0zj9] {
        display: none;
    }

    .modal-footer[b-em0qbi0zj9] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .request-page[b-em0qbi0zj9]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-em0qbi0zj9] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-em0qbi0zj9] {
        padding: 0;
    }

    .image-preview-modal[b-em0qbi0zj9] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-em0qbi0zj9],
    .request-form-modal[b-em0qbi0zj9],
    .request-view-modal[b-em0qbi0zj9],
    .delete-modal[b-em0qbi0zj9] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}
/* /Components/Pages/01Ziticen/03requests/RequestTracking.razor.rz.scp.css */
.tracking-page[b-6sy3lqjfdb] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.tracking-page[b-6sy3lqjfdb]  .tracking-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.tracking-hero[b-6sy3lqjfdb] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-6sy3lqjfdb] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-6sy3lqjfdb] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-6sy3lqjfdb] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-6sy3lqjfdb] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-6sy3lqjfdb] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-6sy3lqjfdb] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-6sy3lqjfdb] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-6sy3lqjfdb] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-6sy3lqjfdb] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-6sy3lqjfdb] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-6sy3lqjfdb] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-6sy3lqjfdb] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-6sy3lqjfdb] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.tracking-page[b-6sy3lqjfdb]  .hero-add-button,
.tracking-page[b-6sy3lqjfdb]  .search-button,
.tracking-page[b-6sy3lqjfdb]  .toolbar-add-button,
.tracking-page[b-6sy3lqjfdb]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.tracking-page[b-6sy3lqjfdb]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-6sy3lqjfdb] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-6sy3lqjfdb] {
    opacity: .55;
    cursor: not-allowed;
}

.tracking-page[b-6sy3lqjfdb]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.tracking-page[b-6sy3lqjfdb]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-6sy3lqjfdb] {
    margin-top: 7px;
}

.summary-card[b-6sy3lqjfdb] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-6sy3lqjfdb] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-6sy3lqjfdb] {
    color: #2c7da8;
}

.summary-card.pending[b-6sy3lqjfdb] {
    color: #7658a7;
}

.summary-card.urgent[b-6sy3lqjfdb] {
    color: #c05b4e;
}

.summary-line[b-6sy3lqjfdb] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-6sy3lqjfdb] {
    min-width: 0;
}

.summary-card small[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-6sy3lqjfdb] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-6sy3lqjfdb] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-6sy3lqjfdb] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-6sy3lqjfdb],
.tracking-list-panel[b-6sy3lqjfdb] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-6sy3lqjfdb],
.list-toolbar[b-6sy3lqjfdb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-6sy3lqjfdb],
.panel-kicker[b-6sy3lqjfdb] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-6sy3lqjfdb],
.list-toolbar h2[b-6sy3lqjfdb] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-6sy3lqjfdb],
.list-toolbar p[b-6sy3lqjfdb] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-6sy3lqjfdb] {
    align-items: center;
}

.tracking-page[b-6sy3lqjfdb]  .premium-field,
.tracking-page[b-6sy3lqjfdb]  .form-field {
    width: 100%;
}

.tracking-page[b-6sy3lqjfdb]  .premium-field .mud-input-outlined-border,
.tracking-page[b-6sy3lqjfdb]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.tracking-page[b-6sy3lqjfdb]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.tracking-page[b-6sy3lqjfdb]  .sort-select {
    width: 170px;
}

.tracking-page[b-6sy3lqjfdb]  .toolbar-add-button {
    min-height: 42px;
}

.tracking-page[b-6sy3lqjfdb]  .tracking-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.tracking-page[b-6sy3lqjfdb]  .tracking-table .mud-table-head {
    background: #eef6f2;
}

.tracking-page[b-6sy3lqjfdb]  .tracking-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.request-no[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-6sy3lqjfdb] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-6sy3lqjfdb],
.mini-photo-empty[b-6sy3lqjfdb] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-6sy3lqjfdb] {
    cursor: zoom-in;
}

.mini-photo-button img[b-6sy3lqjfdb] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-6sy3lqjfdb] {
    object-fit: cover;
}

.mini-photo-button small[b-6sy3lqjfdb] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-6sy3lqjfdb] {
    color: #9c7b38;
}

.applicant-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-6sy3lqjfdb] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-6sy3lqjfdb],
.applicant-cell small[b-6sy3lqjfdb] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-6sy3lqjfdb] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-6sy3lqjfdb] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-6sy3lqjfdb],
.channel-chip[b-6sy3lqjfdb],
.priority-chip[b-6sy3lqjfdb],
.status-chip[b-6sy3lqjfdb] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-6sy3lqjfdb] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-6sy3lqjfdb],
.type-chip.construction[b-6sy3lqjfdb] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-6sy3lqjfdb],
.type-chip.food_license[b-6sy3lqjfdb],
.type-chip.tax[b-6sy3lqjfdb] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-6sy3lqjfdb] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-6sy3lqjfdb],
.type-chip.environment[b-6sy3lqjfdb] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-6sy3lqjfdb] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-6sy3lqjfdb],
.date-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-6sy3lqjfdb],
.date-cell strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-6sy3lqjfdb],
.date-cell small[b-6sy3lqjfdb] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-6sy3lqjfdb] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-6sy3lqjfdb] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-6sy3lqjfdb] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-6sy3lqjfdb] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-6sy3lqjfdb] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-6sy3lqjfdb] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-6sy3lqjfdb] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-6sy3lqjfdb] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-6sy3lqjfdb] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-6sy3lqjfdb] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-6sy3lqjfdb] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-6sy3lqjfdb] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-6sy3lqjfdb] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-6sy3lqjfdb] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.tracking-page[b-6sy3lqjfdb]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.tracking-page[b-6sy3lqjfdb]  .row-action.view {
    color: #2d79a2;
}

.tracking-page[b-6sy3lqjfdb]  .row-action.edit {
    color: var(--theme-primary);
}

.tracking-page[b-6sy3lqjfdb]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.tracking-page[b-6sy3lqjfdb]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-6sy3lqjfdb] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-6sy3lqjfdb] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-6sy3lqjfdb] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-6sy3lqjfdb] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-6sy3lqjfdb] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.tracking-form-modal[b-6sy3lqjfdb],
.tracking-view-modal[b-6sy3lqjfdb],
.delete-modal[b-6sy3lqjfdb] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-6sy3lqjfdb .22s ease-out;
}

@keyframes modalAppear-b-6sy3lqjfdb {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.tracking-form-modal[b-6sy3lqjfdb] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-6sy3lqjfdb] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-6sy3lqjfdb] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-6sy3lqjfdb] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-6sy3lqjfdb] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-6sy3lqjfdb] {
    margin-top: 24px;
}

.form-section-title > span[b-6sy3lqjfdb] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-6sy3lqjfdb] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-6sy3lqjfdb] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-6sy3lqjfdb] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-6sy3lqjfdb] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-6sy3lqjfdb] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-6sy3lqjfdb] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-6sy3lqjfdb] {
    min-height: 310px;
}

.photo-preview img[b-6sy3lqjfdb] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-6sy3lqjfdb] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-6sy3lqjfdb] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-6sy3lqjfdb] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-6sy3lqjfdb],
.remove-photo-button[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-6sy3lqjfdb] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-6sy3lqjfdb] {
    display: none;
}

.remove-photo-button[b-6sy3lqjfdb] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.tracking-page[b-6sy3lqjfdb]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tracking-page[b-6sy3lqjfdb]  .cancel-button,
.tracking-page[b-6sy3lqjfdb]  .save-button,
.tracking-page[b-6sy3lqjfdb]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.tracking-page[b-6sy3lqjfdb]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.tracking-page[b-6sy3lqjfdb]  .save-button {
    min-width: 170px;
}

.tracking-view-modal[b-6sy3lqjfdb] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-6sy3lqjfdb] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-6sy3lqjfdb] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-6sy3lqjfdb] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-6sy3lqjfdb] {
    font-size: 5rem;
}

.view-cover-overlay[b-6sy3lqjfdb] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-6sy3lqjfdb] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-6sy3lqjfdb] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-6sy3lqjfdb] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-6sy3lqjfdb] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-6sy3lqjfdb] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-6sy3lqjfdb] {
    padding: 22px;
}

.view-toolbar[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-6sy3lqjfdb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-6sy3lqjfdb] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-6sy3lqjfdb] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-6sy3lqjfdb],
.view-info-grid span[b-6sy3lqjfdb],
.view-description small[b-6sy3lqjfdb],
.attachment-heading small[b-6sy3lqjfdb],
.view-note small[b-6sy3lqjfdb] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-6sy3lqjfdb] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-6sy3lqjfdb] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-6sy3lqjfdb] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-6sy3lqjfdb] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-6sy3lqjfdb] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-6sy3lqjfdb] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-6sy3lqjfdb] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-6sy3lqjfdb] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-6sy3lqjfdb] {
    background: #f3efe5;
}

.attachment-card img[b-6sy3lqjfdb] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-6sy3lqjfdb] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-6sy3lqjfdb] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-6sy3lqjfdb] {
    font-size: 2.3rem;
}

.view-note[b-6sy3lqjfdb] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-6sy3lqjfdb] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-6sy3lqjfdb] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-6sy3lqjfdb] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-6sy3lqjfdb] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-6sy3lqjfdb] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-6sy3lqjfdb] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-6sy3lqjfdb] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-6sy3lqjfdb] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-6sy3lqjfdb] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-6sy3lqjfdb] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-6sy3lqjfdb] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-6sy3lqjfdb] {
    color: #963b36;
}

.delete-warning[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.tracking-page[b-6sy3lqjfdb]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .tracking-hero[b-6sy3lqjfdb] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-6sy3lqjfdb] {
        max-width: 570px;
    }

    .list-toolbar[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-6sy3lqjfdb] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .tracking-page[b-6sy3lqjfdb] {
        padding: 15px 12px 30px;
    }

    .tracking-hero[b-6sy3lqjfdb] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-6sy3lqjfdb] {
        font-size: 2.3rem;
    }

    .hero-meta[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-6sy3lqjfdb] {
        width: 100%;
    }

    .filter-heading[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }

    .tracking-page[b-6sy3lqjfdb]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-6sy3lqjfdb] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-6sy3lqjfdb],
    .attachment-grid[b-6sy3lqjfdb] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-6sy3lqjfdb],
    .view-info-grid[b-6sy3lqjfdb] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-6sy3lqjfdb] {
        align-items: end;
        padding: 0;
    }

    .tracking-form-modal[b-6sy3lqjfdb],
    .tracking-view-modal[b-6sy3lqjfdb] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-6sy3lqjfdb] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-6sy3lqjfdb],
    .tracking-list-panel[b-6sy3lqjfdb] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-6sy3lqjfdb] {
        align-items: flex-start;
    }

    .modal-icon[b-6sy3lqjfdb] {
        display: none;
    }

    .modal-footer[b-6sy3lqjfdb] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tracking-page[b-6sy3lqjfdb]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-6sy3lqjfdb] {
        padding: 0;
    }

    .image-preview-modal[b-6sy3lqjfdb] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-6sy3lqjfdb],
    .tracking-form-modal[b-6sy3lqjfdb],
    .tracking-view-modal[b-6sy3lqjfdb],
    .delete-modal[b-6sy3lqjfdb] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   REQUEST TRACKING โ€” STATUS OVERVIEW
   ========================================================= */
.status-overview[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-6sy3lqjfdb] {
    display: flex;
    min-height: 88px;
    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.status-overview-card:hover[b-6sy3lqjfdb],
.status-overview-card.selected[b-6sy3lqjfdb] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .27);
    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-6sy3lqjfdb] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-6sy3lqjfdb] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-6sy3lqjfdb] {
    margin-top: 2px;
    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-6sy3lqjfdb] {
    background: #2d78a4;
}

.status-overview-card.review > span[b-6sy3lqjfdb] {
    background: #b17b25;
}

.status-overview-card.progress > span[b-6sy3lqjfdb] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-6sy3lqjfdb] {
    background: #bd7343;
}

.status-overview-card.completed > span[b-6sy3lqjfdb] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-6sy3lqjfdb] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   TRACKING TABLE CELLS
   ========================================================= */
.tracking-number-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 124px;
    flex-direction: column;
}

.tracking-number-cell > span[b-6sy3lqjfdb] {
    display: inline-flex;
    width: fit-content;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 700;
    white-space: nowrap;
}

.tracking-number-cell small[b-6sy3lqjfdb] {
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.request-info-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 4px;
}

.request-info-cell strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.4;
}

.request-info-cell small[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    font-size: .49rem;
}

.progress-cell[b-6sy3lqjfdb] {
    min-width: 155px;
}

.progress-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.progress-heading span[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    font-weight: 750;
}

.progress-heading small[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.department-cell[b-6sy3lqjfdb],
.due-cell[b-6sy3lqjfdb],
.latest-cell[b-6sy3lqjfdb] {
    display: flex;
    min-width: 140px;
    flex-direction: column;
}

.department-cell strong[b-6sy3lqjfdb],
.due-cell strong[b-6sy3lqjfdb],
.latest-cell strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.department-cell small[b-6sy3lqjfdb],
.due-cell small[b-6sy3lqjfdb],
.latest-cell small[b-6sy3lqjfdb] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.latest-cell[b-6sy3lqjfdb] {
    max-width: 190px;
}

.latest-cell small[b-6sy3lqjfdb] {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.due-cell.overdue strong[b-6sy3lqjfdb],
.due-cell.overdue small[b-6sy3lqjfdb] {
    color: #b54842;
}

.overdue-chip[b-6sy3lqjfdb] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;

    margin-top: 4px;
    padding: 0 7px;

    border-radius: 999px;

    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);

    font-size: .45rem;
    font-weight: 700;
    white-space: nowrap;
}

.status-chip.assigned[b-6sy3lqjfdb] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-6sy3lqjfdb] {
    color: #2c70a0;
    background: #e7f2f9;
}

.status-chip.waiting[b-6sy3lqjfdb] {
    color: #a3652d;
    background: #fff1d7;
}

.priority-chip.low[b-6sy3lqjfdb] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-6sy3lqjfdb] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-6sy3lqjfdb] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-6sy3lqjfdb] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-6sy3lqjfdb] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   FORM PROGRESS
   ========================================================= */
.form-progress-preview[b-6sy3lqjfdb] {
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    margin-bottom: 8px;
}

.form-progress-preview span[b-6sy3lqjfdb] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-6sy3lqjfdb] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   TRACKING DETAIL
   ========================================================= */
.tracking-view-modal[b-6sy3lqjfdb] {
    width: min(100%, 940px);
}

.view-progress-panel[b-6sy3lqjfdb],
.tracking-timeline-panel[b-6sy3lqjfdb],
.next-step-panel[b-6sy3lqjfdb],
.attachment-panel[b-6sy3lqjfdb] {
    margin-top: 15px;
    padding: 15px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-6sy3lqjfdb],
.section-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-6sy3lqjfdb],
.section-heading small[b-6sy3lqjfdb] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-6sy3lqjfdb],
.section-heading h3[b-6sy3lqjfdb] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-6sy3lqjfdb] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.section-heading > span[b-6sy3lqjfdb] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.view-progress-panel[b-6sy3lqjfdb]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-6sy3lqjfdb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-top: 10px;
}

.view-progress-footer span[b-6sy3lqjfdb] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #71837b;
    font-size: .52rem;
}

.tracking-timeline[b-6sy3lqjfdb] {
    position: relative;
    margin-top: 15px;
}

.tracking-timeline[b-6sy3lqjfdb]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;

    width: 2px;

    content: "";

    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-6sy3lqjfdb] {
    position: relative;

    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;

    padding-bottom: 14px;
}

.timeline-item:last-child[b-6sy3lqjfdb] {
    padding-bottom: 0;
}

.timeline-marker[b-6sy3lqjfdb] {
    position: relative;
    z-index: 2;

    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;

    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;

    color: #fff;
    background: var(--theme-primary);

    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-6sy3lqjfdb] {
    background: #2d78a4;
}

.timeline-item.review .timeline-marker[b-6sy3lqjfdb] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-6sy3lqjfdb],
.timeline-item.in_progress .timeline-marker[b-6sy3lqjfdb] {
    background: #7658a7;
}

.timeline-item.waiting .timeline-marker[b-6sy3lqjfdb] {
    background: #bd7343;
}

.timeline-item.completed .timeline-marker[b-6sy3lqjfdb] {
    background: var(--theme-primary);
}

.timeline-item.cancelled .timeline-marker[b-6sy3lqjfdb] {
    background: #aa453e;
}

.timeline-content[b-6sy3lqjfdb] {
    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #fff;
}

.timeline-heading[b-6sy3lqjfdb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-6sy3lqjfdb] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-6sy3lqjfdb] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-6sy3lqjfdb] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-6sy3lqjfdb] {
    margin: 8px 0 0;

    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-6sy3lqjfdb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-6sy3lqjfdb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;

    color: #7c8c85;
    font-size: .48rem;
}

.next-step-panel[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.next-step-panel > div[b-6sy3lqjfdb] {
    min-height: 84px;
    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;
}

.next-step-panel small[b-6sy3lqjfdb] {
    color: #8b9993;
    font-size: .51rem;
}

.next-step-panel p[b-6sy3lqjfdb] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .59rem;
    line-height: 1.7;
}

.next-step-panel .delay-reason[b-6sy3lqjfdb] {
    border-color: rgba(181, 72, 66, .18);
    background: #fff5f3;
}

.next-step-panel .delay-reason small[b-6sy3lqjfdb],
.next-step-panel .delay-reason p[b-6sy3lqjfdb] {
    color: #a34a43;
}

.attachment-grid[b-6sy3lqjfdb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-6sy3lqjfdb] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.result[b-6sy3lqjfdb] {
    background: #edf7f1;
}

.attachment-card img[b-6sy3lqjfdb] {
    width: 100%;
    height: 240px;
    object-fit: contain;
}

.attachment-card > span[b-6sy3lqjfdb] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-6sy3lqjfdb] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-6sy3lqjfdb] {
    font-size: 2.3rem;
}

@media (max-width: 1200px) {
    .status-overview[b-6sy3lqjfdb] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .photo-upload-grid[b-6sy3lqjfdb],
    .attachment-grid[b-6sy3lqjfdb],
    .next-step-panel[b-6sy3lqjfdb] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-progress-footer[b-6sy3lqjfdb] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .status-overview[b-6sy3lqjfdb] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .timeline-heading[b-6sy3lqjfdb] {
        align-items: stretch;
        flex-direction: column;
    }
}
/* /Components/Pages/01Ziticen/03requests/ServiceAppointments.razor.rz.scp.css */
.appointment-page[b-pcyrcv6ond] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.appointment-page[b-pcyrcv6ond]  .appointment-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.appointment-hero[b-pcyrcv6ond] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-pcyrcv6ond] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-pcyrcv6ond] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-pcyrcv6ond] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-pcyrcv6ond] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-pcyrcv6ond] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-pcyrcv6ond] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-pcyrcv6ond] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-pcyrcv6ond] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-pcyrcv6ond] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-pcyrcv6ond] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-pcyrcv6ond] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-pcyrcv6ond] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.appointment-page[b-pcyrcv6ond]  .hero-add-button,
.appointment-page[b-pcyrcv6ond]  .search-button,
.appointment-page[b-pcyrcv6ond]  .toolbar-add-button,
.appointment-page[b-pcyrcv6ond]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.appointment-page[b-pcyrcv6ond]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-pcyrcv6ond] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-pcyrcv6ond] {
    opacity: .55;
    cursor: not-allowed;
}

.appointment-page[b-pcyrcv6ond]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.appointment-page[b-pcyrcv6ond]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-pcyrcv6ond] {
    margin-top: 7px;
}

.summary-card[b-pcyrcv6ond] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-pcyrcv6ond] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-pcyrcv6ond] {
    color: #2c7da8;
}

.summary-card.pending[b-pcyrcv6ond] {
    color: #7658a7;
}

.summary-card.urgent[b-pcyrcv6ond] {
    color: #c05b4e;
}

.summary-line[b-pcyrcv6ond] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-pcyrcv6ond] {
    min-width: 0;
}

.summary-card small[b-pcyrcv6ond] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-pcyrcv6ond] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-pcyrcv6ond] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-pcyrcv6ond] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-pcyrcv6ond] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-pcyrcv6ond],
.appointment-list-panel[b-pcyrcv6ond] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-pcyrcv6ond],
.list-toolbar[b-pcyrcv6ond] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-pcyrcv6ond],
.panel-kicker[b-pcyrcv6ond] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-pcyrcv6ond],
.list-toolbar h2[b-pcyrcv6ond] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-pcyrcv6ond],
.list-toolbar p[b-pcyrcv6ond] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-pcyrcv6ond] {
    align-items: center;
}

.appointment-page[b-pcyrcv6ond]  .premium-field,
.appointment-page[b-pcyrcv6ond]  .form-field {
    width: 100%;
}

.appointment-page[b-pcyrcv6ond]  .premium-field .mud-input-outlined-border,
.appointment-page[b-pcyrcv6ond]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.appointment-page[b-pcyrcv6ond]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.appointment-page[b-pcyrcv6ond]  .sort-select {
    width: 170px;
}

.appointment-page[b-pcyrcv6ond]  .toolbar-add-button {
    min-height: 42px;
}

.appointment-page[b-pcyrcv6ond]  .appointment-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.appointment-page[b-pcyrcv6ond]  .appointment-table .mud-table-head {
    background: #eef6f2;
}

.appointment-page[b-pcyrcv6ond]  .appointment-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.request-no[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-pcyrcv6ond] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-pcyrcv6ond],
.mini-photo-empty[b-pcyrcv6ond] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-pcyrcv6ond] {
    cursor: zoom-in;
}

.mini-photo-button img[b-pcyrcv6ond] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-pcyrcv6ond] {
    object-fit: cover;
}

.mini-photo-button small[b-pcyrcv6ond] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-pcyrcv6ond] {
    color: #9c7b38;
}

.applicant-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-pcyrcv6ond] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-pcyrcv6ond],
.applicant-cell small[b-pcyrcv6ond] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-pcyrcv6ond] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-pcyrcv6ond],
.channel-chip[b-pcyrcv6ond],
.priority-chip[b-pcyrcv6ond],
.status-chip[b-pcyrcv6ond] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-pcyrcv6ond] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-pcyrcv6ond],
.type-chip.construction[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-pcyrcv6ond],
.type-chip.food_license[b-pcyrcv6ond],
.type-chip.tax[b-pcyrcv6ond] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-pcyrcv6ond] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-pcyrcv6ond],
.type-chip.environment[b-pcyrcv6ond] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-pcyrcv6ond] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-pcyrcv6ond],
.date-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-pcyrcv6ond],
.date-cell strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-pcyrcv6ond],
.date-cell small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-pcyrcv6ond] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-pcyrcv6ond] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-pcyrcv6ond] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-pcyrcv6ond] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-pcyrcv6ond] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-pcyrcv6ond] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-pcyrcv6ond] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-pcyrcv6ond] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-pcyrcv6ond] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-pcyrcv6ond] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-pcyrcv6ond] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-pcyrcv6ond] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-pcyrcv6ond] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.appointment-page[b-pcyrcv6ond]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.appointment-page[b-pcyrcv6ond]  .row-action.view {
    color: #2d79a2;
}

.appointment-page[b-pcyrcv6ond]  .row-action.edit {
    color: var(--theme-primary);
}

.appointment-page[b-pcyrcv6ond]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.appointment-page[b-pcyrcv6ond]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-pcyrcv6ond] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-pcyrcv6ond] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-pcyrcv6ond] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-pcyrcv6ond] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-pcyrcv6ond] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.appointment-form-modal[b-pcyrcv6ond],
.appointment-view-modal[b-pcyrcv6ond],
.delete-modal[b-pcyrcv6ond] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-pcyrcv6ond .22s ease-out;
}

@keyframes modalAppear-b-pcyrcv6ond {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.appointment-form-modal[b-pcyrcv6ond] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-pcyrcv6ond] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-pcyrcv6ond] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-pcyrcv6ond] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-pcyrcv6ond] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-pcyrcv6ond] {
    margin-top: 24px;
}

.form-section-title > span[b-pcyrcv6ond] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-pcyrcv6ond] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-pcyrcv6ond] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-pcyrcv6ond] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-pcyrcv6ond] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-pcyrcv6ond] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-pcyrcv6ond] {
    min-height: 310px;
}

.photo-preview img[b-pcyrcv6ond] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-pcyrcv6ond] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-pcyrcv6ond] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-pcyrcv6ond] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-pcyrcv6ond],
.remove-photo-button[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-pcyrcv6ond] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-pcyrcv6ond] {
    display: none;
}

.remove-photo-button[b-pcyrcv6ond] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.appointment-page[b-pcyrcv6ond]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.appointment-page[b-pcyrcv6ond]  .cancel-button,
.appointment-page[b-pcyrcv6ond]  .save-button,
.appointment-page[b-pcyrcv6ond]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.appointment-page[b-pcyrcv6ond]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.appointment-page[b-pcyrcv6ond]  .save-button {
    min-width: 170px;
}

.appointment-view-modal[b-pcyrcv6ond] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-pcyrcv6ond] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-pcyrcv6ond] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-pcyrcv6ond] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-pcyrcv6ond] {
    font-size: 5rem;
}

.view-cover-overlay[b-pcyrcv6ond] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-pcyrcv6ond] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-pcyrcv6ond] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-pcyrcv6ond] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-pcyrcv6ond] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-pcyrcv6ond] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-pcyrcv6ond] {
    padding: 22px;
}

.view-toolbar[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-pcyrcv6ond] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-pcyrcv6ond] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-pcyrcv6ond] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-pcyrcv6ond],
.view-info-grid span[b-pcyrcv6ond],
.view-description small[b-pcyrcv6ond],
.attachment-heading small[b-pcyrcv6ond],
.view-note small[b-pcyrcv6ond] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-pcyrcv6ond] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-pcyrcv6ond] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-pcyrcv6ond] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-pcyrcv6ond] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-pcyrcv6ond] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-pcyrcv6ond] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-pcyrcv6ond] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-pcyrcv6ond] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-pcyrcv6ond] {
    background: #f3efe5;
}

.attachment-card img[b-pcyrcv6ond] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-pcyrcv6ond] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-pcyrcv6ond] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-pcyrcv6ond] {
    font-size: 2.3rem;
}

.view-note[b-pcyrcv6ond] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-pcyrcv6ond] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-pcyrcv6ond] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-pcyrcv6ond] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-pcyrcv6ond] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-pcyrcv6ond] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-pcyrcv6ond] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-pcyrcv6ond] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-pcyrcv6ond] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-pcyrcv6ond] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-pcyrcv6ond] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-pcyrcv6ond] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-pcyrcv6ond] {
    color: #963b36;
}

.delete-warning[b-pcyrcv6ond] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.appointment-page[b-pcyrcv6ond]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .appointment-hero[b-pcyrcv6ond] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-pcyrcv6ond] {
        max-width: 570px;
    }

    .list-toolbar[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pcyrcv6ond] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .appointment-page[b-pcyrcv6ond] {
        padding: 15px 12px 30px;
    }

    .appointment-hero[b-pcyrcv6ond] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-pcyrcv6ond] {
        font-size: 2.3rem;
    }

    .hero-meta[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-pcyrcv6ond] {
        width: 100%;
    }

    .filter-heading[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }

    .appointment-page[b-pcyrcv6ond]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-pcyrcv6ond] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-pcyrcv6ond],
    .attachment-grid[b-pcyrcv6ond] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-pcyrcv6ond],
    .view-info-grid[b-pcyrcv6ond] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-pcyrcv6ond] {
        align-items: end;
        padding: 0;
    }

    .appointment-form-modal[b-pcyrcv6ond],
    .appointment-view-modal[b-pcyrcv6ond] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-pcyrcv6ond] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-pcyrcv6ond],
    .appointment-list-panel[b-pcyrcv6ond] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-pcyrcv6ond] {
        align-items: flex-start;
    }

    .modal-icon[b-pcyrcv6ond] {
        display: none;
    }

    .modal-footer[b-pcyrcv6ond] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .appointment-page[b-pcyrcv6ond]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-pcyrcv6ond] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-pcyrcv6ond] {
        padding: 0;
    }

    .image-preview-modal[b-pcyrcv6ond] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-pcyrcv6ond],
    .appointment-form-modal[b-pcyrcv6ond],
    .appointment-view-modal[b-pcyrcv6ond],
    .delete-modal[b-pcyrcv6ond] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   APPOINTMENT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-pcyrcv6ond] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-pcyrcv6ond],
.status-overview-card.selected[b-pcyrcv6ond] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-pcyrcv6ond] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-pcyrcv6ond] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.pending > span[b-pcyrcv6ond] {
    background: #b17b25;
}

.status-overview-card.confirmed > span[b-pcyrcv6ond] {
    background: #2d78a4;
}

.status-overview-card.checkedin > span[b-pcyrcv6ond] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-pcyrcv6ond] {
    background: var(--theme-primary);
}

.status-overview-card.cancelled > span[b-pcyrcv6ond] {
    background: #aa453e;
}

.status-overview-card.selected[b-pcyrcv6ond] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   APPOINTMENT TABLE CELLS
   ========================================================= */
.appointment-number-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.appointment-number-cell > span[b-pcyrcv6ond] {
    display: inline-flex;
    width: fit-content;
    min-height: 29px;

    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 700;
    white-space: nowrap;
}

.appointment-number-cell small[b-pcyrcv6ond] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .51rem;
    font-weight: 700;
}

.service-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.service-cell strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.42;
}

.datetime-cell[b-pcyrcv6ond],
.department-cell[b-pcyrcv6ond],
.officer-cell[b-pcyrcv6ond] {
    display: flex;
    min-width: 140px;
    flex-direction: column;
}

.datetime-cell strong[b-pcyrcv6ond],
.department-cell strong[b-pcyrcv6ond],
.officer-cell strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
}

.datetime-cell small[b-pcyrcv6ond],
.department-cell small[b-pcyrcv6ond],
.officer-cell small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
}

.datetime-cell em[b-pcyrcv6ond] {
    width: fit-content;
    margin-top: 5px;
    padding: 2px 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e7f2f9;

    font-size: .44rem;
    font-style: normal;
}

.reminder-chip[b-pcyrcv6ond] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.reminder-chip.enabled[b-pcyrcv6ond] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.reminder-chip.disabled[b-pcyrcv6ond] {
    color: #8a9590;
    background: #edf1ef;
}

.status-chip.pending[b-pcyrcv6ond] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.confirmed[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.checked_in[b-pcyrcv6ond],
.status-chip.in_service[b-pcyrcv6ond] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-pcyrcv6ond] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.no_show[b-pcyrcv6ond],
.status-chip.cancelled[b-pcyrcv6ond] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-pcyrcv6ond] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-pcyrcv6ond] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-pcyrcv6ond] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-pcyrcv6ond] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   APPOINTMENT FORM
   ========================================================= */
.switch-card[b-pcyrcv6ond] {
    display: flex;
    min-height: 70px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-pcyrcv6ond] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-pcyrcv6ond] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.member-preview[b-pcyrcv6ond] {
    min-height: 320px;
}

.document-preview[b-pcyrcv6ond] {
    min-height: 320px;
}

/* =========================================================
   APPOINTMENT DETAIL TICKET
   ========================================================= */
.appointment-view-modal[b-pcyrcv6ond] {
    width: min(100%, 900px);
}

.appointment-ticket[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns:
        minmax(190px, 1.2fr)
        minmax(145px, .85fr)
        minmax(125px, .7fr)
        minmax(115px, .6fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.appointment-ticket > div[b-pcyrcv6ond] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.ticket-date > span[b-pcyrcv6ond] {
    display: grid;
    flex: 0 0 62px;

    width: 62px;
    height: 62px;

    place-items: center;

    border-radius: 18px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    font-size: 1.45rem;
    font-weight: 800;

    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.ticket-date > div[b-pcyrcv6ond],
.ticket-time > div[b-pcyrcv6ond],
.ticket-counter > div[b-pcyrcv6ond] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.ticket-date strong[b-pcyrcv6ond],
.ticket-time strong[b-pcyrcv6ond],
.ticket-counter strong[b-pcyrcv6ond] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .69rem;
}

.ticket-date small[b-pcyrcv6ond],
.ticket-time small[b-pcyrcv6ond],
.ticket-counter small[b-pcyrcv6ond],
.ticket-queue small[b-pcyrcv6ond] {
    color: #8b9993;
    font-size: .49rem;
}

.ticket-time > .mud-icon-root[b-pcyrcv6ond],
.ticket-counter > .mud-icon-root[b-pcyrcv6ond] {
    color: var(--theme-primary);
}

.ticket-queue[b-pcyrcv6ond] {
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.ticket-queue strong[b-pcyrcv6ond] {
    margin-top: 3px;

    color: #9c7932;
    font-size: 1.35rem;
    letter-spacing: .05em;
}

.view-description[b-pcyrcv6ond],
.reminder-panel[b-pcyrcv6ond],
.attachment-panel[b-pcyrcv6ond],
.view-note[b-pcyrcv6ond] {
    margin-top: 15px;
}

.view-description[b-pcyrcv6ond] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description small[b-pcyrcv6ond],
.section-heading small[b-pcyrcv6ond],
.view-note small[b-pcyrcv6ond] {
    color: #8b9993;
    font-size: .51rem;
}

.view-description p[b-pcyrcv6ond],
.view-note p[b-pcyrcv6ond] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.reminder-panel[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.reminder-panel > div[b-pcyrcv6ond] {
    display: flex;
    min-height: 78px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.reminder-panel > div.disabled[b-pcyrcv6ond] {
    color: #8d9893;
}

.reminder-panel span[b-pcyrcv6ond] {
    display: flex;
    flex-direction: column;
}

.reminder-panel small[b-pcyrcv6ond] {
    color: #8b9993;
    font-size: .49rem;
}

.reminder-panel strong[b-pcyrcv6ond] {
    margin-top: 2px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.55;
}

.attachment-panel[b-pcyrcv6ond] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-pcyrcv6ond] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-pcyrcv6ond] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-pcyrcv6ond] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-pcyrcv6ond] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-pcyrcv6ond] {
    position: relative;

    min-height: 230px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-pcyrcv6ond] {
    background: #f3efe5;
}

.attachment-card img[b-pcyrcv6ond] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-pcyrcv6ond] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-pcyrcv6ond] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-pcyrcv6ond] {
    font-size: 2.3rem;
}

.view-note[b-pcyrcv6ond] {
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-pcyrcv6ond] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .appointment-ticket[b-pcyrcv6ond] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .photo-upload-grid[b-pcyrcv6ond],
    .attachment-grid[b-pcyrcv6ond],
    .reminder-panel[b-pcyrcv6ond] {
        grid-template-columns: minmax(0, 1fr);
    }

    .appointment-ticket[b-pcyrcv6ond] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-pcyrcv6ond] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/01Ziticen/03requests/VideoCallQueue.razor.rz.scp.css */
.video-page[b-jvvliekqea] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.video-page[b-jvvliekqea]  .video-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.video-hero[b-jvvliekqea] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-jvvliekqea] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-jvvliekqea] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-jvvliekqea] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-jvvliekqea] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-jvvliekqea] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-jvvliekqea] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-jvvliekqea] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-jvvliekqea] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-jvvliekqea] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-jvvliekqea] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-jvvliekqea] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-jvvliekqea] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-jvvliekqea] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.video-page[b-jvvliekqea]  .hero-add-button,
.video-page[b-jvvliekqea]  .search-button,
.video-page[b-jvvliekqea]  .toolbar-add-button,
.video-page[b-jvvliekqea]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.video-page[b-jvvliekqea]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-jvvliekqea] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-jvvliekqea] {
    opacity: .55;
    cursor: not-allowed;
}

.video-page[b-jvvliekqea]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.video-page[b-jvvliekqea]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-jvvliekqea] {
    margin-top: 7px;
}

.summary-card[b-jvvliekqea] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-jvvliekqea] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-jvvliekqea] {
    color: #2c7da8;
}

.summary-card.pending[b-jvvliekqea] {
    color: #7658a7;
}

.summary-card.urgent[b-jvvliekqea] {
    color: #c05b4e;
}

.summary-line[b-jvvliekqea] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-jvvliekqea] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-jvvliekqea] {
    min-width: 0;
}

.summary-card small[b-jvvliekqea] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-jvvliekqea] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-jvvliekqea] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-jvvliekqea] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-jvvliekqea] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-jvvliekqea],
.video-list-panel[b-jvvliekqea] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-jvvliekqea],
.list-toolbar[b-jvvliekqea] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-jvvliekqea],
.panel-kicker[b-jvvliekqea] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-jvvliekqea],
.list-toolbar h2[b-jvvliekqea] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-jvvliekqea],
.list-toolbar p[b-jvvliekqea] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-jvvliekqea] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-jvvliekqea] {
    align-items: center;
}

.video-page[b-jvvliekqea]  .premium-field,
.video-page[b-jvvliekqea]  .form-field {
    width: 100%;
}

.video-page[b-jvvliekqea]  .premium-field .mud-input-outlined-border,
.video-page[b-jvvliekqea]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.video-page[b-jvvliekqea]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.video-page[b-jvvliekqea]  .sort-select {
    width: 170px;
}

.video-page[b-jvvliekqea]  .toolbar-add-button {
    min-height: 42px;
}

.video-page[b-jvvliekqea]  .video-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.video-page[b-jvvliekqea]  .video-table .mud-table-head {
    background: #eef6f2;
}

.video-page[b-jvvliekqea]  .video-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.request-no[b-jvvliekqea] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-jvvliekqea] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-jvvliekqea],
.mini-photo-empty[b-jvvliekqea] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-jvvliekqea] {
    cursor: zoom-in;
}

.mini-photo-button img[b-jvvliekqea] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-jvvliekqea] {
    object-fit: cover;
}

.mini-photo-button small[b-jvvliekqea] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-jvvliekqea] {
    color: #9c7b38;
}

.applicant-cell[b-jvvliekqea] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-jvvliekqea] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-jvvliekqea],
.applicant-cell small[b-jvvliekqea] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-jvvliekqea] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-jvvliekqea] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-jvvliekqea],
.channel-chip[b-jvvliekqea],
.priority-chip[b-jvvliekqea],
.status-chip[b-jvvliekqea] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-jvvliekqea],
.type-chip.construction[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-jvvliekqea],
.type-chip.food_license[b-jvvliekqea],
.type-chip.tax[b-jvvliekqea] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-jvvliekqea] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-jvvliekqea],
.type-chip.environment[b-jvvliekqea] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-jvvliekqea] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-jvvliekqea],
.date-cell[b-jvvliekqea] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-jvvliekqea],
.date-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-jvvliekqea],
.date-cell small[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-jvvliekqea] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-jvvliekqea] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-jvvliekqea] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-jvvliekqea] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-jvvliekqea] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-jvvliekqea] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-jvvliekqea] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-jvvliekqea] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-jvvliekqea] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-jvvliekqea] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-jvvliekqea] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.video-page[b-jvvliekqea]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.video-page[b-jvvliekqea]  .row-action.view {
    color: #2d79a2;
}

.video-page[b-jvvliekqea]  .row-action.edit {
    color: var(--theme-primary);
}

.video-page[b-jvvliekqea]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.video-page[b-jvvliekqea]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-jvvliekqea] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-jvvliekqea] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-jvvliekqea] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-jvvliekqea] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-jvvliekqea] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.video-form-modal[b-jvvliekqea],
.video-view-modal[b-jvvliekqea],
.delete-modal[b-jvvliekqea] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-jvvliekqea .22s ease-out;
}

@keyframes modalAppear-b-jvvliekqea {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.video-form-modal[b-jvvliekqea] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-jvvliekqea] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-jvvliekqea] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-jvvliekqea] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-jvvliekqea] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-jvvliekqea] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-jvvliekqea] {
    margin-top: 24px;
}

.form-section-title > span[b-jvvliekqea] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-jvvliekqea] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-jvvliekqea] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-jvvliekqea] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-jvvliekqea] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-jvvliekqea] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-jvvliekqea] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-jvvliekqea] {
    min-height: 310px;
}

.photo-preview img[b-jvvliekqea] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-jvvliekqea] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-jvvliekqea] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-jvvliekqea] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-jvvliekqea],
.remove-photo-button[b-jvvliekqea] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-jvvliekqea] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-jvvliekqea] {
    display: none;
}

.remove-photo-button[b-jvvliekqea] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.video-page[b-jvvliekqea]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.video-page[b-jvvliekqea]  .cancel-button,
.video-page[b-jvvliekqea]  .save-button,
.video-page[b-jvvliekqea]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.video-page[b-jvvliekqea]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.video-page[b-jvvliekqea]  .save-button {
    min-width: 170px;
}

.video-view-modal[b-jvvliekqea] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-jvvliekqea] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-jvvliekqea] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-jvvliekqea] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-jvvliekqea] {
    font-size: 5rem;
}

.view-cover-overlay[b-jvvliekqea] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-jvvliekqea] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-jvvliekqea] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-jvvliekqea] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-jvvliekqea] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-jvvliekqea] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-jvvliekqea] {
    padding: 22px;
}

.view-toolbar[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-jvvliekqea] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-jvvliekqea] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-jvvliekqea],
.view-info-grid span[b-jvvliekqea],
.view-description small[b-jvvliekqea],
.attachment-heading small[b-jvvliekqea],
.view-note small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-jvvliekqea] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-jvvliekqea] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-jvvliekqea] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-jvvliekqea] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-jvvliekqea] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-jvvliekqea] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-jvvliekqea] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-jvvliekqea] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-jvvliekqea] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-jvvliekqea] {
    background: #f3efe5;
}

.attachment-card img[b-jvvliekqea] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-jvvliekqea] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-jvvliekqea] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-jvvliekqea] {
    font-size: 2.3rem;
}

.view-note[b-jvvliekqea] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-jvvliekqea] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-jvvliekqea] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-jvvliekqea] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-jvvliekqea] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-jvvliekqea] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-jvvliekqea] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-jvvliekqea] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-jvvliekqea] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-jvvliekqea] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-jvvliekqea] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-jvvliekqea] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-jvvliekqea] {
    color: #963b36;
}

.delete-warning[b-jvvliekqea] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.video-page[b-jvvliekqea]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .video-hero[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-jvvliekqea] {
        max-width: 570px;
    }

    .list-toolbar[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-jvvliekqea] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .video-page[b-jvvliekqea] {
        padding: 15px 12px 30px;
    }

    .video-hero[b-jvvliekqea] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-jvvliekqea] {
        font-size: 2.3rem;
    }

    .hero-meta[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-jvvliekqea] {
        width: 100%;
    }

    .filter-heading[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }

    .video-page[b-jvvliekqea]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-jvvliekqea] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-jvvliekqea],
    .attachment-grid[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-jvvliekqea],
    .view-info-grid[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-jvvliekqea] {
        align-items: end;
        padding: 0;
    }

    .video-form-modal[b-jvvliekqea],
    .video-view-modal[b-jvvliekqea] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-jvvliekqea] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-jvvliekqea],
    .video-list-panel[b-jvvliekqea] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-jvvliekqea] {
        align-items: flex-start;
    }

    .modal-icon[b-jvvliekqea] {
        display: none;
    }

    .modal-footer[b-jvvliekqea] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .video-page[b-jvvliekqea]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-jvvliekqea] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-jvvliekqea] {
        padding: 0;
    }

    .image-preview-modal[b-jvvliekqea] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-jvvliekqea],
    .video-form-modal[b-jvvliekqea],
    .video-view-modal[b-jvvliekqea],
    .delete-modal[b-jvvliekqea] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   APPOINTMENT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-jvvliekqea] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-jvvliekqea],
.status-overview-card.selected[b-jvvliekqea] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-jvvliekqea] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.pending > span[b-jvvliekqea] {
    background: #b17b25;
}

.status-overview-card.confirmed > span[b-jvvliekqea] {
    background: #2d78a4;
}

.status-overview-card.checkedin > span[b-jvvliekqea] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-jvvliekqea] {
    background: var(--theme-primary);
}

.status-overview-card.cancelled > span[b-jvvliekqea] {
    background: #aa453e;
}

.status-overview-card.selected[b-jvvliekqea] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   APPOINTMENT TABLE CELLS
   ========================================================= */
.appointment-number-cell[b-jvvliekqea] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.appointment-number-cell > span[b-jvvliekqea] {
    display: inline-flex;
    width: fit-content;
    min-height: 29px;

    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 700;
    white-space: nowrap;
}

.appointment-number-cell small[b-jvvliekqea] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .51rem;
    font-weight: 700;
}

.service-cell[b-jvvliekqea] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.service-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.42;
}

.datetime-cell[b-jvvliekqea],
.department-cell[b-jvvliekqea],
.officer-cell[b-jvvliekqea] {
    display: flex;
    min-width: 140px;
    flex-direction: column;
}

.datetime-cell strong[b-jvvliekqea],
.department-cell strong[b-jvvliekqea],
.officer-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
}

.datetime-cell small[b-jvvliekqea],
.department-cell small[b-jvvliekqea],
.officer-cell small[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
}

.datetime-cell em[b-jvvliekqea] {
    width: fit-content;
    margin-top: 5px;
    padding: 2px 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e7f2f9;

    font-size: .44rem;
    font-style: normal;
}

.reminder-chip[b-jvvliekqea] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.reminder-chip.enabled[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.reminder-chip.disabled[b-jvvliekqea] {
    color: #8a9590;
    background: #edf1ef;
}

.status-chip.pending[b-jvvliekqea] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.confirmed[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.checked_in[b-jvvliekqea],
.status-chip.in_service[b-jvvliekqea] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.no_show[b-jvvliekqea],
.status-chip.cancelled[b-jvvliekqea] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-jvvliekqea] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-jvvliekqea] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-jvvliekqea] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   APPOINTMENT FORM
   ========================================================= */
.switch-card[b-jvvliekqea] {
    display: flex;
    min-height: 70px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-jvvliekqea] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-jvvliekqea] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.member-preview[b-jvvliekqea] {
    min-height: 320px;
}

.document-preview[b-jvvliekqea] {
    min-height: 320px;
}

/* =========================================================
   APPOINTMENT DETAIL TICKET
   ========================================================= */
.video-view-modal[b-jvvliekqea] {
    width: min(100%, 900px);
}

.appointment-ticket[b-jvvliekqea] {
    display: grid;
    grid-template-columns:
        minmax(190px, 1.2fr)
        minmax(145px, .85fr)
        minmax(125px, .7fr)
        minmax(115px, .6fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.appointment-ticket > div[b-jvvliekqea] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.ticket-date > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 62px;

    width: 62px;
    height: 62px;

    place-items: center;

    border-radius: 18px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    font-size: 1.45rem;
    font-weight: 800;

    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.ticket-date > div[b-jvvliekqea],
.ticket-time > div[b-jvvliekqea],
.ticket-counter > div[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.ticket-date strong[b-jvvliekqea],
.ticket-time strong[b-jvvliekqea],
.ticket-counter strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .69rem;
}

.ticket-date small[b-jvvliekqea],
.ticket-time small[b-jvvliekqea],
.ticket-counter small[b-jvvliekqea],
.ticket-queue small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .49rem;
}

.ticket-time > .mud-icon-root[b-jvvliekqea],
.ticket-counter > .mud-icon-root[b-jvvliekqea] {
    color: var(--theme-primary);
}

.ticket-queue[b-jvvliekqea] {
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.ticket-queue strong[b-jvvliekqea] {
    margin-top: 3px;

    color: #9c7932;
    font-size: 1.35rem;
    letter-spacing: .05em;
}

.view-description[b-jvvliekqea],
.reminder-panel[b-jvvliekqea],
.attachment-panel[b-jvvliekqea],
.view-note[b-jvvliekqea] {
    margin-top: 15px;
}

.view-description[b-jvvliekqea] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description small[b-jvvliekqea],
.section-heading small[b-jvvliekqea],
.view-note small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .51rem;
}

.view-description p[b-jvvliekqea],
.view-note p[b-jvvliekqea] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.reminder-panel[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.reminder-panel > div[b-jvvliekqea] {
    display: flex;
    min-height: 78px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.reminder-panel > div.disabled[b-jvvliekqea] {
    color: #8d9893;
}

.reminder-panel span[b-jvvliekqea] {
    display: flex;
    flex-direction: column;
}

.reminder-panel small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .49rem;
}

.reminder-panel strong[b-jvvliekqea] {
    margin-top: 2px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.55;
}

.attachment-panel[b-jvvliekqea] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-jvvliekqea] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-jvvliekqea] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-jvvliekqea] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-jvvliekqea] {
    position: relative;

    min-height: 230px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-jvvliekqea] {
    background: #f3efe5;
}

.attachment-card img[b-jvvliekqea] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-jvvliekqea] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-jvvliekqea] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-jvvliekqea] {
    font-size: 2.3rem;
}

.view-note[b-jvvliekqea] {
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-jvvliekqea] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .appointment-ticket[b-jvvliekqea] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .photo-upload-grid[b-jvvliekqea],
    .attachment-grid[b-jvvliekqea],
    .reminder-panel[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }

    .appointment-ticket[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-jvvliekqea] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================================================
   VIDEO CALL QUEUE โ€” SPECIAL COMPONENTS
   ========================================================= */
.summary-card.waiting[b-jvvliekqea] {
    color: #a66b2e;
}

.summary-card.incall[b-jvvliekqea] {
    color: #7658a7;
}

.status-overview-card.waiting > span[b-jvvliekqea] {
    background: #b17b25;
}

.status-overview-card.ready > span[b-jvvliekqea] {
    background: #2d78a4;
}

.status-overview-card.incall > span[b-jvvliekqea] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-jvvliekqea] {
    background: var(--theme-primary);
}

.status-overview-card.missed > span[b-jvvliekqea] {
    background: #aa453e;
}

.queue-number-cell[b-jvvliekqea] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.queue-number-cell > span[b-jvvliekqea] {
    display: inline-flex;
    width: fit-content;
    min-height: 34px;

    align-items: center;

    padding: 0 11px;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .05em;

    box-shadow: 0 8px 18px rgba(4, 61, 47, .16);
}

.queue-number-cell small[b-jvvliekqea] {
    margin-top: 4px;

    color: #8d9994;
    font-size: .46rem;
}

.service-cell[b-jvvliekqea] {
    display: flex;
    min-width: 215px;
    flex-direction: column;
    gap: 5px;
}

.service-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.42;
}

.platform-cell[b-jvvliekqea] {
    display: flex;
    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.platform-cell > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    place-items: center;

    border-radius: 11px;

    color: #fff;
    background: #2d78a4;
}

.platform-cell.teams > span[b-jvvliekqea] {
    background: #7658a7;
}

.platform-cell.zoom > span[b-jvvliekqea] {
    background: #2c83b1;
}

.platform-cell.line > span[b-jvvliekqea] {
    background: #17a65a;
}

.platform-cell.custom > span[b-jvvliekqea] {
    background: #697973;
}

.platform-cell > div[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.platform-cell strong[b-jvvliekqea] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.platform-cell small[b-jvvliekqea] {
    margin-top: 2px;

    overflow: hidden;

    color: var(--theme-muted);
    font-size: .44rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.verification-cell[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 5px;
}

.verification-cell span[b-jvvliekqea] {
    display: grid;
    width: 30px;
    height: 30px;

    place-items: center;

    border-radius: 9px;
}

.verification-cell .ok[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.verification-cell .pending[b-jvvliekqea] {
    color: #a46d27;
    background: #fff1d7;
}

.wait-text[b-jvvliekqea] {
    display: block;
    width: fit-content;

    margin-top: 4px;

    color: #a46d27;
    font-size: .44rem;
}

.status-chip.waiting[b-jvvliekqea] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.confirmed[b-jvvliekqea] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.ready[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in_call[b-jvvliekqea] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-jvvliekqea] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.missed[b-jvvliekqea],
.status-chip.cancelled[b-jvvliekqea] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card.compact[b-jvvliekqea] {
    min-height: 82px;
    padding: 9px;
}

.member-preview[b-jvvliekqea],
.document-preview[b-jvvliekqea] {
    min-height: 320px;
}

/* =========================================================
   VIDEO ROOM DETAIL
   ========================================================= */
.video-view-modal[b-jvvliekqea] {
    width: min(100%, 930px);
}

.call-room-card[b-jvvliekqea] {
    display: grid;
    grid-template-columns:
        minmax(180px, 1fr)
        minmax(170px, .9fr)
        minmax(140px, .75fr)
        minmax(180px, .9fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.call-room-card > div[b-jvvliekqea],
.call-room-card > a[b-jvvliekqea],
.call-room-card > span[b-jvvliekqea] {
    min-height: 105px;
}

.room-platform[b-jvvliekqea],
.room-time[b-jvvliekqea],
.room-code[b-jvvliekqea] {
    display: flex;
    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.room-platform > span[b-jvvliekqea] {
    display: grid;
    flex: 0 0 50px;

    width: 50px;
    height: 50px;

    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.room-platform > div[b-jvvliekqea],
.room-time[b-jvvliekqea],
.room-code[b-jvvliekqea] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.room-platform small[b-jvvliekqea],
.room-time small[b-jvvliekqea],
.room-code small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .48rem;
}

.room-platform strong[b-jvvliekqea],
.room-time strong[b-jvvliekqea],
.room-code strong[b-jvvliekqea] {
    margin-top: 2px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
    line-height: 1.45;
}

.join-room-button[b-jvvliekqea] {
    display: flex;

    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 14px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    font-family: 'Kanit', sans-serif;
    font-size: .62rem;
    font-weight: 650;
    text-decoration: none;

    transition: filter .18s ease, transform .18s ease;
}

.join-room-button:hover[b-jvvliekqea] {
    filter: brightness(1.08);
}

.join-room-button.disabled[b-jvvliekqea] {
    color: #8c9994;
    background: #eef3f0;
}

.verification-panel[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 15px;
}

.verification-panel > div[b-jvvliekqea] {
    display: flex;
    min-height: 78px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.verification-panel > div.pending[b-jvvliekqea] {
    color: #a46d27;
    background: #fffaf1;
}

.verification-panel span[b-jvvliekqea] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.verification-panel small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .49rem;
}

.verification-panel strong[b-jvvliekqea] {
    margin-top: 2px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.view-description[b-jvvliekqea],
.note-grid[b-jvvliekqea],
.attachment-panel[b-jvvliekqea],
.view-note[b-jvvliekqea] {
    margin-top: 15px;
}

.view-description[b-jvvliekqea] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description small[b-jvvliekqea],
.note-grid small[b-jvvliekqea],
.section-heading small[b-jvvliekqea],
.view-note small[b-jvvliekqea] {
    color: #8b9993;
    font-size: .51rem;
}

.view-description p[b-jvvliekqea],
.note-grid p[b-jvvliekqea],
.view-note p[b-jvvliekqea] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.72;
}

.note-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.note-grid > div[b-jvvliekqea] {
    min-height: 92px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-jvvliekqea] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-jvvliekqea] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-jvvliekqea] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-jvvliekqea] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-jvvliekqea] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-jvvliekqea] {
    position: relative;

    min-height: 230px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-jvvliekqea] {
    background: #f3efe5;
}

.attachment-card img[b-jvvliekqea] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-jvvliekqea] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-jvvliekqea] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-jvvliekqea] {
    font-size: 2.3rem;
}

.view-note[b-jvvliekqea] {
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

/* =========================================================
   RESPONSIVE VIDEO QUEUE
   ========================================================= */
@media (max-width: 1200px) {
    .call-room-card[b-jvvliekqea] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .verification-panel[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .call-room-card[b-jvvliekqea],
    .photo-upload-grid[b-jvvliekqea],
    .attachment-grid[b-jvvliekqea],
    .note-grid[b-jvvliekqea] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-jvvliekqea] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/01Ziticen/04complaints/AllComplaints.razor.rz.scp.css */
.all-complaints-page[b-dwszgn3kym] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.all-complaints-page[b-dwszgn3kym]  .all-complaints-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.all-complaints-hero[b-dwszgn3kym] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-dwszgn3kym] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-dwszgn3kym] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-dwszgn3kym] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-dwszgn3kym] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-dwszgn3kym] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-dwszgn3kym] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-dwszgn3kym] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-dwszgn3kym] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-dwszgn3kym] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-dwszgn3kym] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-dwszgn3kym] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-dwszgn3kym] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-dwszgn3kym] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.all-complaints-page[b-dwszgn3kym]  .hero-add-button,
.all-complaints-page[b-dwszgn3kym]  .search-button,
.all-complaints-page[b-dwszgn3kym]  .toolbar-add-button,
.all-complaints-page[b-dwszgn3kym]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.all-complaints-page[b-dwszgn3kym]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-dwszgn3kym] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-dwszgn3kym] {
    opacity: .55;
    cursor: not-allowed;
}

.all-complaints-page[b-dwszgn3kym]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.all-complaints-page[b-dwszgn3kym]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-dwszgn3kym] {
    margin-top: 7px;
}

.summary-card[b-dwszgn3kym] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-dwszgn3kym] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-dwszgn3kym] {
    color: #2c7da8;
}

.summary-card.pending[b-dwszgn3kym] {
    color: #7658a7;
}

.summary-card.urgent[b-dwszgn3kym] {
    color: #c05b4e;
}

.summary-line[b-dwszgn3kym] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-dwszgn3kym] {
    min-width: 0;
}

.summary-card small[b-dwszgn3kym] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-dwszgn3kym] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-dwszgn3kym] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-dwszgn3kym] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-dwszgn3kym] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-dwszgn3kym],
.all-complaints-list-panel[b-dwszgn3kym] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-dwszgn3kym],
.list-toolbar[b-dwszgn3kym] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-dwszgn3kym],
.panel-kicker[b-dwszgn3kym] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-dwszgn3kym],
.list-toolbar h2[b-dwszgn3kym] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-dwszgn3kym],
.list-toolbar p[b-dwszgn3kym] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-dwszgn3kym] {
    align-items: center;
}

.all-complaints-page[b-dwszgn3kym]  .premium-field,
.all-complaints-page[b-dwszgn3kym]  .form-field {
    width: 100%;
}

.all-complaints-page[b-dwszgn3kym]  .premium-field .mud-input-outlined-border,
.all-complaints-page[b-dwszgn3kym]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.all-complaints-page[b-dwszgn3kym]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.all-complaints-page[b-dwszgn3kym]  .sort-select {
    width: 170px;
}

.all-complaints-page[b-dwszgn3kym]  .toolbar-add-button {
    min-height: 42px;
}

.all-complaints-page[b-dwszgn3kym]  .all-complaints-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.all-complaints-page[b-dwszgn3kym]  .all-complaints-table .mud-table-head {
    background: #eef6f2;
}

.all-complaints-page[b-dwszgn3kym]  .all-complaints-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-dwszgn3kym] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-dwszgn3kym],
.mini-photo-empty[b-dwszgn3kym] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-dwszgn3kym] {
    cursor: zoom-in;
}

.mini-photo-button img[b-dwszgn3kym] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-dwszgn3kym] {
    object-fit: cover;
}

.mini-photo-button small[b-dwszgn3kym] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-dwszgn3kym] {
    color: #9c7b38;
}

.applicant-cell[b-dwszgn3kym] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-dwszgn3kym] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-dwszgn3kym],
.applicant-cell small[b-dwszgn3kym] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-dwszgn3kym] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-dwszgn3kym] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-dwszgn3kym] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-dwszgn3kym],
.channel-chip[b-dwszgn3kym],
.priority-chip[b-dwszgn3kym],
.status-chip[b-dwszgn3kym] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-dwszgn3kym] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-dwszgn3kym],
.type-chip.construction[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-dwszgn3kym],
.type-chip.food_license[b-dwszgn3kym],
.type-chip.tax[b-dwszgn3kym] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-dwszgn3kym] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-dwszgn3kym],
.type-chip.environment[b-dwszgn3kym] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-dwszgn3kym] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-dwszgn3kym],
.date-cell[b-dwszgn3kym] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-dwszgn3kym],
.date-cell strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-dwszgn3kym],
.date-cell small[b-dwszgn3kym] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-dwszgn3kym] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-dwszgn3kym] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-dwszgn3kym] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-dwszgn3kym] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-dwszgn3kym] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-dwszgn3kym] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-dwszgn3kym] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-dwszgn3kym] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-dwszgn3kym] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-dwszgn3kym] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-dwszgn3kym] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-dwszgn3kym] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-dwszgn3kym] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.all-complaints-page[b-dwszgn3kym]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.all-complaints-page[b-dwszgn3kym]  .row-action.view {
    color: #2d79a2;
}

.all-complaints-page[b-dwszgn3kym]  .row-action.edit {
    color: var(--theme-primary);
}

.all-complaints-page[b-dwszgn3kym]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.all-complaints-page[b-dwszgn3kym]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-dwszgn3kym] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-dwszgn3kym] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-dwszgn3kym] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-dwszgn3kym] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-dwszgn3kym] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.all-complaints-form-modal[b-dwszgn3kym],
.all-complaints-view-modal[b-dwszgn3kym],
.delete-modal[b-dwszgn3kym] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-dwszgn3kym .22s ease-out;
}

@keyframes modalAppear-b-dwszgn3kym {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.all-complaints-form-modal[b-dwszgn3kym] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-dwszgn3kym] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-dwszgn3kym] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-dwszgn3kym] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-dwszgn3kym] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-dwszgn3kym] {
    margin-top: 24px;
}

.form-section-title > span[b-dwszgn3kym] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-dwszgn3kym] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-dwszgn3kym] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-dwszgn3kym] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-dwszgn3kym] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-dwszgn3kym] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-dwszgn3kym] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-dwszgn3kym] {
    min-height: 310px;
}

.photo-preview img[b-dwszgn3kym] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-dwszgn3kym] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-dwszgn3kym] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-dwszgn3kym] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-dwszgn3kym],
.remove-photo-button[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-dwszgn3kym] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-dwszgn3kym] {
    display: none;
}

.remove-photo-button[b-dwszgn3kym] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.all-complaints-page[b-dwszgn3kym]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.all-complaints-page[b-dwszgn3kym]  .cancel-button,
.all-complaints-page[b-dwszgn3kym]  .save-button,
.all-complaints-page[b-dwszgn3kym]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.all-complaints-page[b-dwszgn3kym]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.all-complaints-page[b-dwszgn3kym]  .save-button {
    min-width: 170px;
}

.all-complaints-view-modal[b-dwszgn3kym] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-dwszgn3kym] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-dwszgn3kym] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-dwszgn3kym] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-dwszgn3kym] {
    font-size: 5rem;
}

.view-cover-overlay[b-dwszgn3kym] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-dwszgn3kym] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-dwszgn3kym] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-dwszgn3kym] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-dwszgn3kym] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-dwszgn3kym] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-dwszgn3kym] {
    padding: 22px;
}

.view-toolbar[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-dwszgn3kym] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-dwszgn3kym] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-dwszgn3kym] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-dwszgn3kym],
.view-info-grid span[b-dwszgn3kym],
.view-description small[b-dwszgn3kym],
.attachment-heading small[b-dwszgn3kym],
.view-note small[b-dwszgn3kym] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-dwszgn3kym] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-dwszgn3kym] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-dwszgn3kym] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-dwszgn3kym] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-dwszgn3kym] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-dwszgn3kym] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-dwszgn3kym] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-dwszgn3kym] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-dwszgn3kym] {
    background: #f3efe5;
}

.attachment-card img[b-dwszgn3kym] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-dwszgn3kym] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-dwszgn3kym] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-dwszgn3kym] {
    font-size: 2.3rem;
}

.view-note[b-dwszgn3kym] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-dwszgn3kym] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-dwszgn3kym] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-dwszgn3kym] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-dwszgn3kym] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-dwszgn3kym] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-dwszgn3kym] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-dwszgn3kym] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-dwszgn3kym] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-dwszgn3kym] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-dwszgn3kym] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-dwszgn3kym] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-dwszgn3kym] {
    color: #963b36;
}

.delete-warning[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.all-complaints-page[b-dwszgn3kym]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .all-complaints-hero[b-dwszgn3kym] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-dwszgn3kym] {
        max-width: 570px;
    }

    .list-toolbar[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-dwszgn3kym] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .all-complaints-page[b-dwszgn3kym] {
        padding: 15px 12px 30px;
    }

    .all-complaints-hero[b-dwszgn3kym] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-dwszgn3kym] {
        font-size: 2.3rem;
    }

    .hero-meta[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-dwszgn3kym] {
        width: 100%;
    }

    .filter-heading[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }

    .all-complaints-page[b-dwszgn3kym]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-dwszgn3kym] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-dwszgn3kym],
    .attachment-grid[b-dwszgn3kym] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-dwszgn3kym],
    .view-info-grid[b-dwszgn3kym] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-dwszgn3kym] {
        align-items: end;
        padding: 0;
    }

    .all-complaints-form-modal[b-dwszgn3kym],
    .all-complaints-view-modal[b-dwszgn3kym] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-dwszgn3kym] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-dwszgn3kym],
    .all-complaints-list-panel[b-dwszgn3kym] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-dwszgn3kym] {
        align-items: flex-start;
    }

    .modal-icon[b-dwszgn3kym] {
        display: none;
    }

    .modal-footer[b-dwszgn3kym] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .all-complaints-page[b-dwszgn3kym]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-dwszgn3kym] {
        padding: 0;
    }

    .image-preview-modal[b-dwszgn3kym] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-dwszgn3kym],
    .all-complaints-form-modal[b-dwszgn3kym],
    .all-complaints-view-modal[b-dwszgn3kym],
    .delete-modal[b-dwszgn3kym] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-dwszgn3kym] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-dwszgn3kym],
.status-overview-card.selected[b-dwszgn3kym] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-dwszgn3kym] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-dwszgn3kym] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-dwszgn3kym] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-dwszgn3kym] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-dwszgn3kym] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-dwszgn3kym] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-dwszgn3kym] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-dwszgn3kym] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-dwszgn3kym] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-dwszgn3kym] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-dwszgn3kym] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-dwszgn3kym] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-dwszgn3kym] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-dwszgn3kym],
.complainant-cell small[b-dwszgn3kym] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-dwszgn3kym] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-dwszgn3kym] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-dwszgn3kym] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-dwszgn3kym] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-dwszgn3kym] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-dwszgn3kym] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-dwszgn3kym] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-dwszgn3kym] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-dwszgn3kym] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-dwszgn3kym] {
    min-width: 116px;
}

.privacy-chip[b-dwszgn3kym] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-dwszgn3kym] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-dwszgn3kym] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-dwszgn3kym] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-dwszgn3kym] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-dwszgn3kym] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-dwszgn3kym],
.status-chip.cancelled[b-dwszgn3kym] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-dwszgn3kym] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-dwszgn3kym] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-dwszgn3kym] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-dwszgn3kym] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-dwszgn3kym] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-dwszgn3kym] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-dwszgn3kym] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-dwszgn3kym] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-dwszgn3kym] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-dwszgn3kym],
.evidence-preview[b-dwszgn3kym] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.all-complaints-view-modal[b-dwszgn3kym] {
    width: min(100%, 920px);
}

.desired-resolution[b-dwszgn3kym],
.screening-panel[b-dwszgn3kym],
.attachment-panel[b-dwszgn3kym] {
    margin-top: 15px;
}

.desired-resolution[b-dwszgn3kym] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-dwszgn3kym],
.screening-panel small[b-dwszgn3kym],
.section-heading small[b-dwszgn3kym] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-dwszgn3kym],
.screening-panel p[b-dwszgn3kym] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-dwszgn3kym] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-dwszgn3kym] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-dwszgn3kym] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-dwszgn3kym] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-dwszgn3kym] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-dwszgn3kym] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-dwszgn3kym] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-dwszgn3kym] {
    background: #f3efe5;
}

.attachment-card img[b-dwszgn3kym] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-dwszgn3kym] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-dwszgn3kym] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-dwszgn3kym] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-dwszgn3kym] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-dwszgn3kym],
    .screening-panel[b-dwszgn3kym],
    .attachment-grid[b-dwszgn3kym] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-dwszgn3kym] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-dwszgn3kym] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-dwszgn3kym] {
    background: #aa453e;
}

.summary-card.overdue[b-dwszgn3kym],
.summary-card.urgent[b-dwszgn3kym] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-dwszgn3kym] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-dwszgn3kym] {
    min-width: 150px;
}

.progress-heading[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-dwszgn3kym] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-dwszgn3kym],
.latest-cell[b-dwszgn3kym] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-dwszgn3kym],
.latest-cell strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-dwszgn3kym],
.latest-cell small[b-dwszgn3kym] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-dwszgn3kym],
.due-cell.overdue small[b-dwszgn3kym] {
    color: #b54842;
}

.overdue-chip[b-dwszgn3kym] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-dwszgn3kym] {
    margin-top: 8px;
}

.form-progress-preview[b-dwszgn3kym] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-dwszgn3kym] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-dwszgn3kym] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-dwszgn3kym],
.complaint-timeline-panel[b-dwszgn3kym] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-dwszgn3kym],
.section-heading[b-dwszgn3kym] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-dwszgn3kym],
.section-heading small[b-dwszgn3kym] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-dwszgn3kym],
.section-heading h3[b-dwszgn3kym] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-dwszgn3kym] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-dwszgn3kym]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-dwszgn3kym] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-dwszgn3kym] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.complaint-timeline[b-dwszgn3kym] {
    position: relative;
    margin-top: 15px;
}

.complaint-timeline[b-dwszgn3kym]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-dwszgn3kym] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-dwszgn3kym] {
    padding-bottom: 0;
}

.timeline-marker[b-dwszgn3kym] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-dwszgn3kym] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-dwszgn3kym] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-dwszgn3kym] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-dwszgn3kym] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-dwszgn3kym] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-dwszgn3kym],
.timeline-item.cancelled .timeline-marker[b-dwszgn3kym] {
    background: #aa453e;
}

.timeline-content[b-dwszgn3kym] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-dwszgn3kym] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-dwszgn3kym] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-dwszgn3kym] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-dwszgn3kym] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-dwszgn3kym] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-dwszgn3kym] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-dwszgn3kym] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-dwszgn3kym] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-dwszgn3kym] {
        align-items: stretch;
        flex-direction: column;
    }
}
/* /Components/Pages/01Ziticen/04complaints/ComplaintAssignments.razor.rz.scp.css */
.assignment-page[b-huefp5jpq0] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.assignment-page[b-huefp5jpq0]  .assignment-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.assignment-hero[b-huefp5jpq0] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-huefp5jpq0] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-huefp5jpq0] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-huefp5jpq0] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-huefp5jpq0] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-huefp5jpq0] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-huefp5jpq0] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-huefp5jpq0] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-huefp5jpq0] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-huefp5jpq0] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-huefp5jpq0] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-huefp5jpq0] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.assignment-page[b-huefp5jpq0]  .hero-add-button,
.assignment-page[b-huefp5jpq0]  .search-button,
.assignment-page[b-huefp5jpq0]  .toolbar-add-button,
.assignment-page[b-huefp5jpq0]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.assignment-page[b-huefp5jpq0]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-huefp5jpq0] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-huefp5jpq0] {
    opacity: .55;
    cursor: not-allowed;
}

.assignment-page[b-huefp5jpq0]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.assignment-page[b-huefp5jpq0]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-huefp5jpq0] {
    margin-top: 7px;
}

.summary-card[b-huefp5jpq0] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-huefp5jpq0] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-huefp5jpq0] {
    color: #2c7da8;
}

.summary-card.pending[b-huefp5jpq0] {
    color: #7658a7;
}

.summary-card.urgent[b-huefp5jpq0] {
    color: #c05b4e;
}

.summary-line[b-huefp5jpq0] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-huefp5jpq0] {
    min-width: 0;
}

.summary-card small[b-huefp5jpq0] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-huefp5jpq0] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-huefp5jpq0] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-huefp5jpq0] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-huefp5jpq0] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-huefp5jpq0],
.assignment-list-panel[b-huefp5jpq0] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-huefp5jpq0],
.list-toolbar[b-huefp5jpq0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-huefp5jpq0],
.panel-kicker[b-huefp5jpq0] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-huefp5jpq0],
.list-toolbar h2[b-huefp5jpq0] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-huefp5jpq0],
.list-toolbar p[b-huefp5jpq0] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-huefp5jpq0] {
    align-items: center;
}

.assignment-page[b-huefp5jpq0]  .premium-field,
.assignment-page[b-huefp5jpq0]  .form-field {
    width: 100%;
}

.assignment-page[b-huefp5jpq0]  .premium-field .mud-input-outlined-border,
.assignment-page[b-huefp5jpq0]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.assignment-page[b-huefp5jpq0]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.assignment-page[b-huefp5jpq0]  .sort-select {
    width: 170px;
}

.assignment-page[b-huefp5jpq0]  .toolbar-add-button {
    min-height: 42px;
}

.assignment-page[b-huefp5jpq0]  .assignment-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.assignment-page[b-huefp5jpq0]  .assignment-table .mud-table-head {
    background: #eef6f2;
}

.assignment-page[b-huefp5jpq0]  .assignment-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-huefp5jpq0] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-huefp5jpq0],
.mini-photo-empty[b-huefp5jpq0] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-huefp5jpq0] {
    cursor: zoom-in;
}

.mini-photo-button img[b-huefp5jpq0] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-huefp5jpq0] {
    object-fit: cover;
}

.mini-photo-button small[b-huefp5jpq0] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-huefp5jpq0] {
    color: #9c7b38;
}

.applicant-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-huefp5jpq0],
.applicant-cell small[b-huefp5jpq0] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-huefp5jpq0] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-huefp5jpq0] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-huefp5jpq0],
.channel-chip[b-huefp5jpq0],
.priority-chip[b-huefp5jpq0],
.status-chip[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-huefp5jpq0],
.type-chip.construction[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-huefp5jpq0],
.type-chip.food_license[b-huefp5jpq0],
.type-chip.tax[b-huefp5jpq0] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-huefp5jpq0],
.type-chip.environment[b-huefp5jpq0] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-huefp5jpq0] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-huefp5jpq0],
.date-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-huefp5jpq0],
.date-cell strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-huefp5jpq0],
.date-cell small[b-huefp5jpq0] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-huefp5jpq0] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-huefp5jpq0] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-huefp5jpq0] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-huefp5jpq0] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-huefp5jpq0] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-huefp5jpq0] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-huefp5jpq0] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-huefp5jpq0] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-huefp5jpq0] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.assignment-page[b-huefp5jpq0]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.assignment-page[b-huefp5jpq0]  .row-action.view {
    color: #2d79a2;
}

.assignment-page[b-huefp5jpq0]  .row-action.edit {
    color: var(--theme-primary);
}

.assignment-page[b-huefp5jpq0]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.assignment-page[b-huefp5jpq0]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-huefp5jpq0] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-huefp5jpq0] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-huefp5jpq0] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-huefp5jpq0] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-huefp5jpq0] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.assignment-form-modal[b-huefp5jpq0],
.assignment-view-modal[b-huefp5jpq0],
.delete-modal[b-huefp5jpq0] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-huefp5jpq0 .22s ease-out;
}

@keyframes modalAppear-b-huefp5jpq0 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.assignment-form-modal[b-huefp5jpq0] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-huefp5jpq0] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-huefp5jpq0] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-huefp5jpq0] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-huefp5jpq0] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-huefp5jpq0] {
    margin-top: 24px;
}

.form-section-title > span[b-huefp5jpq0] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-huefp5jpq0] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-huefp5jpq0] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-huefp5jpq0] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-huefp5jpq0] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-huefp5jpq0] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-huefp5jpq0] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-huefp5jpq0] {
    min-height: 310px;
}

.photo-preview img[b-huefp5jpq0] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-huefp5jpq0] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-huefp5jpq0] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-huefp5jpq0] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-huefp5jpq0],
.remove-photo-button[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-huefp5jpq0] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-huefp5jpq0] {
    display: none;
}

.remove-photo-button[b-huefp5jpq0] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.assignment-page[b-huefp5jpq0]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.assignment-page[b-huefp5jpq0]  .cancel-button,
.assignment-page[b-huefp5jpq0]  .save-button,
.assignment-page[b-huefp5jpq0]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.assignment-page[b-huefp5jpq0]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.assignment-page[b-huefp5jpq0]  .save-button {
    min-width: 170px;
}

.assignment-view-modal[b-huefp5jpq0] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-huefp5jpq0] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-huefp5jpq0] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-huefp5jpq0] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-huefp5jpq0] {
    font-size: 5rem;
}

.view-cover-overlay[b-huefp5jpq0] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-huefp5jpq0] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-huefp5jpq0] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-huefp5jpq0] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-huefp5jpq0] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-huefp5jpq0] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-huefp5jpq0] {
    padding: 22px;
}

.view-toolbar[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-huefp5jpq0] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-huefp5jpq0],
.view-info-grid span[b-huefp5jpq0],
.view-description small[b-huefp5jpq0],
.attachment-heading small[b-huefp5jpq0],
.view-note small[b-huefp5jpq0] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-huefp5jpq0] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-huefp5jpq0] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-huefp5jpq0] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-huefp5jpq0] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-huefp5jpq0] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-huefp5jpq0] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-huefp5jpq0] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-huefp5jpq0] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-huefp5jpq0] {
    background: #f3efe5;
}

.attachment-card img[b-huefp5jpq0] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-huefp5jpq0] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-huefp5jpq0] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-huefp5jpq0] {
    font-size: 2.3rem;
}

.view-note[b-huefp5jpq0] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-huefp5jpq0] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-huefp5jpq0] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-huefp5jpq0] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-huefp5jpq0] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-huefp5jpq0] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-huefp5jpq0] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-huefp5jpq0] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-huefp5jpq0] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-huefp5jpq0] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-huefp5jpq0] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-huefp5jpq0] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-huefp5jpq0] {
    color: #963b36;
}

.delete-warning[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.assignment-page[b-huefp5jpq0]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .assignment-hero[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-huefp5jpq0] {
        max-width: 570px;
    }

    .list-toolbar[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-huefp5jpq0] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .assignment-page[b-huefp5jpq0] {
        padding: 15px 12px 30px;
    }

    .assignment-hero[b-huefp5jpq0] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-huefp5jpq0] {
        font-size: 2.3rem;
    }

    .hero-meta[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-huefp5jpq0] {
        width: 100%;
    }

    .filter-heading[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }

    .assignment-page[b-huefp5jpq0]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-huefp5jpq0] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-huefp5jpq0],
    .attachment-grid[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-huefp5jpq0],
    .view-info-grid[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-huefp5jpq0] {
        align-items: end;
        padding: 0;
    }

    .assignment-form-modal[b-huefp5jpq0],
    .assignment-view-modal[b-huefp5jpq0] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-huefp5jpq0] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-huefp5jpq0],
    .assignment-list-panel[b-huefp5jpq0] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-huefp5jpq0] {
        align-items: flex-start;
    }

    .modal-icon[b-huefp5jpq0] {
        display: none;
    }

    .modal-footer[b-huefp5jpq0] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .assignment-page[b-huefp5jpq0]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-huefp5jpq0] {
        padding: 0;
    }

    .image-preview-modal[b-huefp5jpq0] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-huefp5jpq0],
    .assignment-form-modal[b-huefp5jpq0],
    .assignment-view-modal[b-huefp5jpq0],
    .delete-modal[b-huefp5jpq0] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-huefp5jpq0] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-huefp5jpq0],
.status-overview-card.selected[b-huefp5jpq0] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-huefp5jpq0] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-huefp5jpq0] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-huefp5jpq0] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-huefp5jpq0] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-huefp5jpq0] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-huefp5jpq0] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-huefp5jpq0] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-huefp5jpq0] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-huefp5jpq0] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-huefp5jpq0],
.complainant-cell small[b-huefp5jpq0] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-huefp5jpq0] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-huefp5jpq0] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-huefp5jpq0] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-huefp5jpq0] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-huefp5jpq0] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-huefp5jpq0] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-huefp5jpq0] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-huefp5jpq0] {
    min-width: 116px;
}

.privacy-chip[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-huefp5jpq0] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-huefp5jpq0] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-huefp5jpq0] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-huefp5jpq0],
.status-chip.cancelled[b-huefp5jpq0] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-huefp5jpq0] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-huefp5jpq0] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-huefp5jpq0] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-huefp5jpq0] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-huefp5jpq0] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-huefp5jpq0] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-huefp5jpq0] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-huefp5jpq0],
.evidence-preview[b-huefp5jpq0] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.assignment-view-modal[b-huefp5jpq0] {
    width: min(100%, 920px);
}

.desired-resolution[b-huefp5jpq0],
.screening-panel[b-huefp5jpq0],
.attachment-panel[b-huefp5jpq0] {
    margin-top: 15px;
}

.desired-resolution[b-huefp5jpq0] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-huefp5jpq0],
.screening-panel small[b-huefp5jpq0],
.section-heading small[b-huefp5jpq0] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-huefp5jpq0],
.screening-panel p[b-huefp5jpq0] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-huefp5jpq0] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-huefp5jpq0] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-huefp5jpq0] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-huefp5jpq0] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-huefp5jpq0] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-huefp5jpq0] {
    background: #f3efe5;
}

.attachment-card img[b-huefp5jpq0] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-huefp5jpq0] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-huefp5jpq0] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-huefp5jpq0] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-huefp5jpq0] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-huefp5jpq0],
    .screening-panel[b-huefp5jpq0],
    .attachment-grid[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-huefp5jpq0] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-huefp5jpq0] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-huefp5jpq0] {
    background: #aa453e;
}

.summary-card.overdue[b-huefp5jpq0],
.summary-card.urgent[b-huefp5jpq0] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-huefp5jpq0] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-huefp5jpq0] {
    min-width: 150px;
}

.progress-heading[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-huefp5jpq0] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-huefp5jpq0],
.latest-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-huefp5jpq0],
.latest-cell strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-huefp5jpq0],
.latest-cell small[b-huefp5jpq0] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-huefp5jpq0],
.due-cell.overdue small[b-huefp5jpq0] {
    color: #b54842;
}

.overdue-chip[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-huefp5jpq0] {
    margin-top: 8px;
}

.form-progress-preview[b-huefp5jpq0] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-huefp5jpq0] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-huefp5jpq0] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-huefp5jpq0],
.assignment-timeline-panel[b-huefp5jpq0] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-huefp5jpq0],
.section-heading[b-huefp5jpq0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-huefp5jpq0],
.section-heading small[b-huefp5jpq0] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-huefp5jpq0],
.section-heading h3[b-huefp5jpq0] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-huefp5jpq0] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-huefp5jpq0]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-huefp5jpq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-huefp5jpq0] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.assignment-timeline[b-huefp5jpq0] {
    position: relative;
    margin-top: 15px;
}

.assignment-timeline[b-huefp5jpq0]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-huefp5jpq0] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-huefp5jpq0] {
    padding-bottom: 0;
}

.timeline-marker[b-huefp5jpq0] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-huefp5jpq0] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-huefp5jpq0] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-huefp5jpq0] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-huefp5jpq0] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-huefp5jpq0] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-huefp5jpq0],
.timeline-item.cancelled .timeline-marker[b-huefp5jpq0] {
    background: #aa453e;
}

.timeline-content[b-huefp5jpq0] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-huefp5jpq0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-huefp5jpq0] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-huefp5jpq0] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-huefp5jpq0] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-huefp5jpq0] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-huefp5jpq0] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-huefp5jpq0] {
    color: #2d78a4;
}

.summary-card.progress[b-huefp5jpq0] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-huefp5jpq0] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-huefp5jpq0] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-huefp5jpq0] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-huefp5jpq0] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-huefp5jpq0] {
    background: #aa453e;
}

.assignment-number-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.assignment-number-cell > span[b-huefp5jpq0] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-huefp5jpq0] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-huefp5jpq0],
.assigned-by-cell[b-huefp5jpq0],
.latest-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-huefp5jpq0],
.assigned-by-cell strong[b-huefp5jpq0],
.latest-cell strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-huefp5jpq0],
.assigned-by-cell small[b-huefp5jpq0],
.latest-cell small[b-huefp5jpq0] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-huefp5jpq0] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-huefp5jpq0] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-huefp5jpq0] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-huefp5jpq0],
.status-chip.cancelled[b-huefp5jpq0] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-huefp5jpq0] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-huefp5jpq0] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.assignment-view-modal[b-huefp5jpq0] {
    width: min(100%, 940px);
}

.assignment-banner[b-huefp5jpq0] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.assignment-banner > div[b-huefp5jpq0] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-huefp5jpq0] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-huefp5jpq0],
.banner-officer[b-huefp5jpq0],
.banner-due[b-huefp5jpq0],
.banner-progress[b-huefp5jpq0] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.assignment-banner small[b-huefp5jpq0] {
    color: #8b9993;
    font-size: .48rem;
}

.assignment-banner strong[b-huefp5jpq0] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-huefp5jpq0] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-huefp5jpq0],
.detail-note-grid[b-huefp5jpq0],
.assignment-timeline-panel[b-huefp5jpq0],
.attachment-panel[b-huefp5jpq0] {
    margin-top: 15px;
}

.assignment-instruction[b-huefp5jpq0] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-huefp5jpq0],
.detail-note-grid small[b-huefp5jpq0] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-huefp5jpq0],
.detail-note-grid p[b-huefp5jpq0] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-huefp5jpq0] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.assignment-timeline-panel[b-huefp5jpq0] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.assignment-timeline[b-huefp5jpq0] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.assignment-timeline[b-huefp5jpq0]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-huefp5jpq0] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-huefp5jpq0] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-huefp5jpq0] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-huefp5jpq0],
.timeline-item.cancelled .timeline-marker[b-huefp5jpq0] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-huefp5jpq0],
.evidence-preview[b-huefp5jpq0] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .assignment-banner[b-huefp5jpq0] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .assignment-banner[b-huefp5jpq0],
    .detail-note-grid[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-huefp5jpq0] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-huefp5jpq0] {
    width: 100%;
}

.available-count-card[b-huefp5jpq0] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-huefp5jpq0] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-huefp5jpq0] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-huefp5jpq0] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-huefp5jpq0]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-huefp5jpq0]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-huefp5jpq0] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-huefp5jpq0] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-huefp5jpq0] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-huefp5jpq0] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-huefp5jpq0] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-huefp5jpq0] {
    font-size: 1.55rem;
}

.picker-photo[b-huefp5jpq0] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-huefp5jpq0] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-huefp5jpq0] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-huefp5jpq0] {
    font-size: 2rem;
}

.picker-content[b-huefp5jpq0] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-huefp5jpq0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-huefp5jpq0] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-huefp5jpq0] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-huefp5jpq0] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-huefp5jpq0] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-huefp5jpq0] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-huefp5jpq0] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-huefp5jpq0] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-huefp5jpq0] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-huefp5jpq0] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-huefp5jpq0] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-huefp5jpq0] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-huefp5jpq0] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-huefp5jpq0] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-huefp5jpq0] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-huefp5jpq0] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-huefp5jpq0] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-huefp5jpq0] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-huefp5jpq0] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-huefp5jpq0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-huefp5jpq0] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-huefp5jpq0] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-huefp5jpq0] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-huefp5jpq0] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-huefp5jpq0] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-huefp5jpq0] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-huefp5jpq0] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-huefp5jpq0] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-huefp5jpq0] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-huefp5jpq0] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-huefp5jpq0] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-huefp5jpq0] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-huefp5jpq0] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-huefp5jpq0] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-huefp5jpq0],
    .selected-complaint-panel[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-huefp5jpq0] {
        min-height: 220px;
    }

    .selected-info-grid[b-huefp5jpq0] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-huefp5jpq0] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-huefp5jpq0] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Pages/01Ziticen/04complaints/ComplaintIntake.razor.rz.scp.css */
.complaint-page[b-8a49km6mud] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.complaint-page[b-8a49km6mud]  .complaint-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.complaint-hero[b-8a49km6mud] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-8a49km6mud] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-8a49km6mud] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-8a49km6mud] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-8a49km6mud] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-8a49km6mud] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-8a49km6mud] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-8a49km6mud] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-8a49km6mud] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-8a49km6mud] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-8a49km6mud] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-8a49km6mud] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-8a49km6mud] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-8a49km6mud] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-8a49km6mud] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-8a49km6mud] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-8a49km6mud] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-8a49km6mud] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.complaint-page[b-8a49km6mud]  .hero-add-button,
.complaint-page[b-8a49km6mud]  .search-button,
.complaint-page[b-8a49km6mud]  .toolbar-add-button,
.complaint-page[b-8a49km6mud]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.complaint-page[b-8a49km6mud]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-8a49km6mud] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-8a49km6mud] {
    opacity: .55;
    cursor: not-allowed;
}

.complaint-page[b-8a49km6mud]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.complaint-page[b-8a49km6mud]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-8a49km6mud] {
    margin-top: 7px;
}

.summary-card[b-8a49km6mud] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-8a49km6mud] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-8a49km6mud] {
    color: #2c7da8;
}

.summary-card.pending[b-8a49km6mud] {
    color: #7658a7;
}

.summary-card.urgent[b-8a49km6mud] {
    color: #c05b4e;
}

.summary-line[b-8a49km6mud] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-8a49km6mud] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-8a49km6mud] {
    min-width: 0;
}

.summary-card small[b-8a49km6mud] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-8a49km6mud] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-8a49km6mud] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-8a49km6mud] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-8a49km6mud] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-8a49km6mud],
.complaint-list-panel[b-8a49km6mud] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-8a49km6mud],
.list-toolbar[b-8a49km6mud] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-8a49km6mud],
.panel-kicker[b-8a49km6mud] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-8a49km6mud],
.list-toolbar h2[b-8a49km6mud] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-8a49km6mud],
.list-toolbar p[b-8a49km6mud] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-8a49km6mud] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-8a49km6mud] {
    align-items: center;
}

.complaint-page[b-8a49km6mud]  .premium-field,
.complaint-page[b-8a49km6mud]  .form-field {
    width: 100%;
}

.complaint-page[b-8a49km6mud]  .premium-field .mud-input-outlined-border,
.complaint-page[b-8a49km6mud]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.complaint-page[b-8a49km6mud]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.complaint-page[b-8a49km6mud]  .sort-select {
    width: 170px;
}

.complaint-page[b-8a49km6mud]  .toolbar-add-button {
    min-height: 42px;
}

.complaint-page[b-8a49km6mud]  .complaint-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.complaint-page[b-8a49km6mud]  .complaint-table .mud-table-head {
    background: #eef6f2;
}

.complaint-page[b-8a49km6mud]  .complaint-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-8a49km6mud] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-8a49km6mud] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-8a49km6mud],
.mini-photo-empty[b-8a49km6mud] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-8a49km6mud] {
    cursor: zoom-in;
}

.mini-photo-button img[b-8a49km6mud] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-8a49km6mud] {
    object-fit: cover;
}

.mini-photo-button small[b-8a49km6mud] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-8a49km6mud] {
    color: #9c7b38;
}

.applicant-cell[b-8a49km6mud] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-8a49km6mud] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-8a49km6mud] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-8a49km6mud],
.applicant-cell small[b-8a49km6mud] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-8a49km6mud] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-8a49km6mud] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-8a49km6mud] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-8a49km6mud] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-8a49km6mud],
.channel-chip[b-8a49km6mud],
.priority-chip[b-8a49km6mud],
.status-chip[b-8a49km6mud] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-8a49km6mud] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-8a49km6mud],
.type-chip.construction[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-8a49km6mud],
.type-chip.food_license[b-8a49km6mud],
.type-chip.tax[b-8a49km6mud] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-8a49km6mud] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-8a49km6mud],
.type-chip.environment[b-8a49km6mud] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-8a49km6mud] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-8a49km6mud],
.date-cell[b-8a49km6mud] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-8a49km6mud],
.date-cell strong[b-8a49km6mud] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-8a49km6mud],
.date-cell small[b-8a49km6mud] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-8a49km6mud] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-8a49km6mud] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-8a49km6mud] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-8a49km6mud] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-8a49km6mud] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-8a49km6mud] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-8a49km6mud] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-8a49km6mud] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-8a49km6mud] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-8a49km6mud] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-8a49km6mud] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-8a49km6mud] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-8a49km6mud] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.complaint-page[b-8a49km6mud]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.complaint-page[b-8a49km6mud]  .row-action.view {
    color: #2d79a2;
}

.complaint-page[b-8a49km6mud]  .row-action.edit {
    color: var(--theme-primary);
}

.complaint-page[b-8a49km6mud]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.complaint-page[b-8a49km6mud]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-8a49km6mud] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-8a49km6mud] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-8a49km6mud] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-8a49km6mud] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-8a49km6mud] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.complaint-form-modal[b-8a49km6mud],
.complaint-view-modal[b-8a49km6mud],
.delete-modal[b-8a49km6mud] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-8a49km6mud .22s ease-out;
}

@keyframes modalAppear-b-8a49km6mud {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.complaint-form-modal[b-8a49km6mud] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-8a49km6mud] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-8a49km6mud] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-8a49km6mud] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-8a49km6mud] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-8a49km6mud] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-8a49km6mud] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-8a49km6mud] {
    margin-top: 24px;
}

.form-section-title > span[b-8a49km6mud] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-8a49km6mud] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-8a49km6mud] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-8a49km6mud] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-8a49km6mud] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-8a49km6mud] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-8a49km6mud] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-8a49km6mud] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-8a49km6mud] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-8a49km6mud] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-8a49km6mud] {
    min-height: 310px;
}

.photo-preview img[b-8a49km6mud] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-8a49km6mud] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-8a49km6mud] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-8a49km6mud] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-8a49km6mud] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-8a49km6mud],
.remove-photo-button[b-8a49km6mud] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-8a49km6mud] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-8a49km6mud] {
    display: none;
}

.remove-photo-button[b-8a49km6mud] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.complaint-page[b-8a49km6mud]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-page[b-8a49km6mud]  .cancel-button,
.complaint-page[b-8a49km6mud]  .save-button,
.complaint-page[b-8a49km6mud]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.complaint-page[b-8a49km6mud]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.complaint-page[b-8a49km6mud]  .save-button {
    min-width: 170px;
}

.complaint-view-modal[b-8a49km6mud] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-8a49km6mud] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-8a49km6mud] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-8a49km6mud] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-8a49km6mud] {
    font-size: 5rem;
}

.view-cover-overlay[b-8a49km6mud] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-8a49km6mud] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-8a49km6mud] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-8a49km6mud] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-8a49km6mud] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-8a49km6mud] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-8a49km6mud] {
    padding: 22px;
}

.view-toolbar[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-8a49km6mud] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-8a49km6mud] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-8a49km6mud] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-8a49km6mud] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-8a49km6mud],
.view-info-grid span[b-8a49km6mud],
.view-description small[b-8a49km6mud],
.attachment-heading small[b-8a49km6mud],
.view-note small[b-8a49km6mud] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-8a49km6mud] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-8a49km6mud] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-8a49km6mud] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-8a49km6mud] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-8a49km6mud] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-8a49km6mud] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-8a49km6mud] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-8a49km6mud] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-8a49km6mud] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-8a49km6mud] {
    background: #f3efe5;
}

.attachment-card img[b-8a49km6mud] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-8a49km6mud] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-8a49km6mud] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-8a49km6mud] {
    font-size: 2.3rem;
}

.view-note[b-8a49km6mud] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-8a49km6mud] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-8a49km6mud] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-8a49km6mud] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-8a49km6mud] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-8a49km6mud] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-8a49km6mud] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-8a49km6mud] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-8a49km6mud] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-8a49km6mud] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-8a49km6mud] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-8a49km6mud] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-8a49km6mud] {
    color: #963b36;
}

.delete-warning[b-8a49km6mud] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.complaint-page[b-8a49km6mud]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .complaint-hero[b-8a49km6mud] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-8a49km6mud] {
        max-width: 570px;
    }

    .list-toolbar[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-8a49km6mud] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .complaint-page[b-8a49km6mud] {
        padding: 15px 12px 30px;
    }

    .complaint-hero[b-8a49km6mud] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-8a49km6mud] {
        font-size: 2.3rem;
    }

    .hero-meta[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-8a49km6mud] {
        width: 100%;
    }

    .filter-heading[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }

    .complaint-page[b-8a49km6mud]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-8a49km6mud] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-8a49km6mud],
    .attachment-grid[b-8a49km6mud] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-8a49km6mud],
    .view-info-grid[b-8a49km6mud] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-8a49km6mud] {
        align-items: end;
        padding: 0;
    }

    .complaint-form-modal[b-8a49km6mud],
    .complaint-view-modal[b-8a49km6mud] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-8a49km6mud] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-8a49km6mud],
    .complaint-list-panel[b-8a49km6mud] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-8a49km6mud] {
        align-items: flex-start;
    }

    .modal-icon[b-8a49km6mud] {
        display: none;
    }

    .modal-footer[b-8a49km6mud] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .complaint-page[b-8a49km6mud]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-8a49km6mud] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-8a49km6mud] {
        padding: 0;
    }

    .image-preview-modal[b-8a49km6mud] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-8a49km6mud],
    .complaint-form-modal[b-8a49km6mud],
    .complaint-view-modal[b-8a49km6mud],
    .delete-modal[b-8a49km6mud] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-8a49km6mud] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-8a49km6mud],
.status-overview-card.selected[b-8a49km6mud] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-8a49km6mud] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-8a49km6mud] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-8a49km6mud] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-8a49km6mud] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-8a49km6mud] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-8a49km6mud] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-8a49km6mud] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-8a49km6mud] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-8a49km6mud] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-8a49km6mud] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-8a49km6mud] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-8a49km6mud] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-8a49km6mud] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-8a49km6mud] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-8a49km6mud],
.complainant-cell small[b-8a49km6mud] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-8a49km6mud] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-8a49km6mud] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-8a49km6mud] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-8a49km6mud] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-8a49km6mud] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-8a49km6mud] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-8a49km6mud] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-8a49km6mud] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-8a49km6mud] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-8a49km6mud] {
    min-width: 116px;
}

.privacy-chip[b-8a49km6mud] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-8a49km6mud] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-8a49km6mud] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-8a49km6mud] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-8a49km6mud] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-8a49km6mud] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-8a49km6mud],
.status-chip.cancelled[b-8a49km6mud] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-8a49km6mud] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-8a49km6mud] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-8a49km6mud] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-8a49km6mud] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-8a49km6mud] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-8a49km6mud] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-8a49km6mud] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-8a49km6mud] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-8a49km6mud] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-8a49km6mud] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-8a49km6mud] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-8a49km6mud],
.evidence-preview[b-8a49km6mud] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.complaint-view-modal[b-8a49km6mud] {
    width: min(100%, 920px);
}

.desired-resolution[b-8a49km6mud],
.screening-panel[b-8a49km6mud],
.attachment-panel[b-8a49km6mud] {
    margin-top: 15px;
}

.desired-resolution[b-8a49km6mud] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-8a49km6mud],
.screening-panel small[b-8a49km6mud],
.section-heading small[b-8a49km6mud] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-8a49km6mud],
.screening-panel p[b-8a49km6mud] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-8a49km6mud] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-8a49km6mud] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-8a49km6mud] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-8a49km6mud] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-8a49km6mud] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-8a49km6mud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-8a49km6mud] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-8a49km6mud] {
    background: #f3efe5;
}

.attachment-card img[b-8a49km6mud] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-8a49km6mud] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-8a49km6mud] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-8a49km6mud] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-8a49km6mud] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-8a49km6mud],
    .screening-panel[b-8a49km6mud],
    .attachment-grid[b-8a49km6mud] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-8a49km6mud] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/01Ziticen/04complaints/ComplaintResultSummary.razor.rz.scp.css */
.summary-page[b-q3y7gbbfh9] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.summary-page[b-q3y7gbbfh9]  .summary-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.summary-hero[b-q3y7gbbfh9] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-q3y7gbbfh9] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-q3y7gbbfh9] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-q3y7gbbfh9] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-q3y7gbbfh9] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-q3y7gbbfh9] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-q3y7gbbfh9] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-q3y7gbbfh9] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-q3y7gbbfh9] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-q3y7gbbfh9] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-q3y7gbbfh9] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.summary-page[b-q3y7gbbfh9]  .hero-add-button,
.summary-page[b-q3y7gbbfh9]  .search-button,
.summary-page[b-q3y7gbbfh9]  .toolbar-add-button,
.summary-page[b-q3y7gbbfh9]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.summary-page[b-q3y7gbbfh9]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-q3y7gbbfh9] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-q3y7gbbfh9] {
    opacity: .55;
    cursor: not-allowed;
}

.summary-page[b-q3y7gbbfh9]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.summary-page[b-q3y7gbbfh9]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-q3y7gbbfh9] {
    margin-top: 7px;
}

.summary-card[b-q3y7gbbfh9] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-q3y7gbbfh9] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-q3y7gbbfh9] {
    color: #2c7da8;
}

.summary-card.pending[b-q3y7gbbfh9] {
    color: #7658a7;
}

.summary-card.urgent[b-q3y7gbbfh9] {
    color: #c05b4e;
}

.summary-line[b-q3y7gbbfh9] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-q3y7gbbfh9] {
    min-width: 0;
}

.summary-card small[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-q3y7gbbfh9] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-q3y7gbbfh9] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-q3y7gbbfh9] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-q3y7gbbfh9],
.result-list-panel[b-q3y7gbbfh9] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-q3y7gbbfh9],
.list-toolbar[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-q3y7gbbfh9],
.panel-kicker[b-q3y7gbbfh9] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-q3y7gbbfh9],
.list-toolbar h2[b-q3y7gbbfh9] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-q3y7gbbfh9],
.list-toolbar p[b-q3y7gbbfh9] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-q3y7gbbfh9] {
    align-items: center;
}

.summary-page[b-q3y7gbbfh9]  .premium-field,
.summary-page[b-q3y7gbbfh9]  .form-field {
    width: 100%;
}

.summary-page[b-q3y7gbbfh9]  .premium-field .mud-input-outlined-border,
.summary-page[b-q3y7gbbfh9]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.summary-page[b-q3y7gbbfh9]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.summary-page[b-q3y7gbbfh9]  .sort-select {
    width: 170px;
}

.summary-page[b-q3y7gbbfh9]  .toolbar-add-button {
    min-height: 42px;
}

.summary-page[b-q3y7gbbfh9]  .result-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.summary-page[b-q3y7gbbfh9]  .result-table .mud-table-head {
    background: #eef6f2;
}

.summary-page[b-q3y7gbbfh9]  .result-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-q3y7gbbfh9] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-q3y7gbbfh9],
.mini-photo-empty[b-q3y7gbbfh9] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-q3y7gbbfh9] {
    cursor: zoom-in;
}

.mini-photo-button img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-q3y7gbbfh9] {
    object-fit: cover;
}

.mini-photo-button small[b-q3y7gbbfh9] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-q3y7gbbfh9] {
    color: #9c7b38;
}

.applicant-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-q3y7gbbfh9],
.applicant-cell small[b-q3y7gbbfh9] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-q3y7gbbfh9] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-q3y7gbbfh9],
.channel-chip[b-q3y7gbbfh9],
.priority-chip[b-q3y7gbbfh9],
.status-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-q3y7gbbfh9],
.type-chip.construction[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-q3y7gbbfh9],
.type-chip.food_license[b-q3y7gbbfh9],
.type-chip.tax[b-q3y7gbbfh9] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-q3y7gbbfh9],
.type-chip.environment[b-q3y7gbbfh9] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-q3y7gbbfh9],
.date-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-q3y7gbbfh9],
.date-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-q3y7gbbfh9],
.date-cell small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-q3y7gbbfh9] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-q3y7gbbfh9] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-q3y7gbbfh9] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-q3y7gbbfh9] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-q3y7gbbfh9] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.summary-page[b-q3y7gbbfh9]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.summary-page[b-q3y7gbbfh9]  .row-action.view {
    color: #2d79a2;
}

.summary-page[b-q3y7gbbfh9]  .row-action.edit {
    color: var(--theme-primary);
}

.summary-page[b-q3y7gbbfh9]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.summary-page[b-q3y7gbbfh9]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-q3y7gbbfh9] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-q3y7gbbfh9] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-q3y7gbbfh9] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-q3y7gbbfh9] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-q3y7gbbfh9] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.result-form-modal[b-q3y7gbbfh9],
.result-view-modal[b-q3y7gbbfh9],
.delete-modal[b-q3y7gbbfh9] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-q3y7gbbfh9 .22s ease-out;
}

@keyframes modalAppear-b-q3y7gbbfh9 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.result-form-modal[b-q3y7gbbfh9] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-q3y7gbbfh9] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-q3y7gbbfh9] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-q3y7gbbfh9] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-q3y7gbbfh9] {
    margin-top: 24px;
}

.form-section-title > span[b-q3y7gbbfh9] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-q3y7gbbfh9] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-q3y7gbbfh9] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-q3y7gbbfh9] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-q3y7gbbfh9] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-q3y7gbbfh9] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-q3y7gbbfh9] {
    min-height: 310px;
}

.photo-preview img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-q3y7gbbfh9] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-q3y7gbbfh9] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-q3y7gbbfh9] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-q3y7gbbfh9],
.remove-photo-button[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-q3y7gbbfh9] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-q3y7gbbfh9] {
    display: none;
}

.remove-photo-button[b-q3y7gbbfh9] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.summary-page[b-q3y7gbbfh9]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.summary-page[b-q3y7gbbfh9]  .cancel-button,
.summary-page[b-q3y7gbbfh9]  .save-button,
.summary-page[b-q3y7gbbfh9]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.summary-page[b-q3y7gbbfh9]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.summary-page[b-q3y7gbbfh9]  .save-button {
    min-width: 170px;
}

.result-view-modal[b-q3y7gbbfh9] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-q3y7gbbfh9] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-q3y7gbbfh9] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-q3y7gbbfh9] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 5rem;
}

.view-cover-overlay[b-q3y7gbbfh9] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-q3y7gbbfh9] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-q3y7gbbfh9] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-q3y7gbbfh9] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-q3y7gbbfh9] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-q3y7gbbfh9] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-q3y7gbbfh9] {
    padding: 22px;
}

.view-toolbar[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-q3y7gbbfh9] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-q3y7gbbfh9],
.view-info-grid span[b-q3y7gbbfh9],
.view-description small[b-q3y7gbbfh9],
.attachment-heading small[b-q3y7gbbfh9],
.view-note small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-q3y7gbbfh9] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-q3y7gbbfh9] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-q3y7gbbfh9] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-q3y7gbbfh9] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-q3y7gbbfh9] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-q3y7gbbfh9] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-q3y7gbbfh9] {
    background: #f3efe5;
}

.attachment-card img[b-q3y7gbbfh9] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-q3y7gbbfh9] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-q3y7gbbfh9] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 2.3rem;
}

.view-note[b-q3y7gbbfh9] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-q3y7gbbfh9] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-q3y7gbbfh9] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-q3y7gbbfh9] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-q3y7gbbfh9] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-q3y7gbbfh9] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-q3y7gbbfh9] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-q3y7gbbfh9] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-q3y7gbbfh9] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-q3y7gbbfh9] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-q3y7gbbfh9] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-q3y7gbbfh9] {
    color: #963b36;
}

.delete-warning[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.summary-page[b-q3y7gbbfh9]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .summary-hero[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-q3y7gbbfh9] {
        max-width: 570px;
    }

    .list-toolbar[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-q3y7gbbfh9] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .summary-page[b-q3y7gbbfh9] {
        padding: 15px 12px 30px;
    }

    .summary-hero[b-q3y7gbbfh9] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-q3y7gbbfh9] {
        font-size: 2.3rem;
    }

    .hero-meta[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-q3y7gbbfh9] {
        width: 100%;
    }

    .filter-heading[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }

    .summary-page[b-q3y7gbbfh9]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-q3y7gbbfh9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-q3y7gbbfh9],
    .attachment-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-q3y7gbbfh9],
    .view-info-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-q3y7gbbfh9] {
        align-items: end;
        padding: 0;
    }

    .result-form-modal[b-q3y7gbbfh9],
    .result-view-modal[b-q3y7gbbfh9] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-q3y7gbbfh9] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-q3y7gbbfh9],
    .result-list-panel[b-q3y7gbbfh9] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-q3y7gbbfh9] {
        align-items: flex-start;
    }

    .modal-icon[b-q3y7gbbfh9] {
        display: none;
    }

    .modal-footer[b-q3y7gbbfh9] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .summary-page[b-q3y7gbbfh9]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-q3y7gbbfh9] {
        padding: 0;
    }

    .image-preview-modal[b-q3y7gbbfh9] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-q3y7gbbfh9],
    .result-form-modal[b-q3y7gbbfh9],
    .result-view-modal[b-q3y7gbbfh9],
    .delete-modal[b-q3y7gbbfh9] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-q3y7gbbfh9] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-q3y7gbbfh9],
.status-overview-card.selected[b-q3y7gbbfh9] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-q3y7gbbfh9] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-q3y7gbbfh9] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-q3y7gbbfh9] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-q3y7gbbfh9] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-q3y7gbbfh9] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-q3y7gbbfh9] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-q3y7gbbfh9],
.complainant-cell small[b-q3y7gbbfh9] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-q3y7gbbfh9] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-q3y7gbbfh9] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-q3y7gbbfh9] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-q3y7gbbfh9] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-q3y7gbbfh9] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-q3y7gbbfh9] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-q3y7gbbfh9] {
    min-width: 116px;
}

.privacy-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-q3y7gbbfh9] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-q3y7gbbfh9] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-q3y7gbbfh9],
.status-chip.cancelled[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-q3y7gbbfh9] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-q3y7gbbfh9] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-q3y7gbbfh9] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-q3y7gbbfh9] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-q3y7gbbfh9] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-q3y7gbbfh9],
.evidence-preview[b-q3y7gbbfh9] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.result-view-modal[b-q3y7gbbfh9] {
    width: min(100%, 920px);
}

.desired-resolution[b-q3y7gbbfh9],
.screening-panel[b-q3y7gbbfh9],
.attachment-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
}

.desired-resolution[b-q3y7gbbfh9] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-q3y7gbbfh9],
.screening-panel small[b-q3y7gbbfh9],
.section-heading small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-q3y7gbbfh9],
.screening-panel p[b-q3y7gbbfh9] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-q3y7gbbfh9] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-q3y7gbbfh9] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-q3y7gbbfh9] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-q3y7gbbfh9] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-q3y7gbbfh9] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-q3y7gbbfh9] {
    background: #f3efe5;
}

.attachment-card img[b-q3y7gbbfh9] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-q3y7gbbfh9] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-q3y7gbbfh9] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-q3y7gbbfh9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-q3y7gbbfh9],
    .screening-panel[b-q3y7gbbfh9],
    .attachment-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-q3y7gbbfh9] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-q3y7gbbfh9] {
    background: #aa453e;
}

.summary-card.overdue[b-q3y7gbbfh9],
.summary-card.urgent[b-q3y7gbbfh9] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-q3y7gbbfh9] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-q3y7gbbfh9] {
    min-width: 150px;
}

.progress-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-q3y7gbbfh9],
.latest-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-q3y7gbbfh9],
.latest-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-q3y7gbbfh9],
.latest-cell small[b-q3y7gbbfh9] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-q3y7gbbfh9],
.due-cell.overdue small[b-q3y7gbbfh9] {
    color: #b54842;
}

.overdue-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-q3y7gbbfh9] {
    margin-top: 8px;
}

.form-progress-preview[b-q3y7gbbfh9] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-q3y7gbbfh9] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-q3y7gbbfh9],
.result-history-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-q3y7gbbfh9],
.section-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-q3y7gbbfh9],
.section-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-q3y7gbbfh9],
.section-heading h3[b-q3y7gbbfh9] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-q3y7gbbfh9]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-q3y7gbbfh9] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.result-history-list[b-q3y7gbbfh9] {
    position: relative;
    margin-top: 15px;
}

.result-history-list[b-q3y7gbbfh9]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-q3y7gbbfh9] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-q3y7gbbfh9] {
    padding-bottom: 0;
}

.timeline-marker[b-q3y7gbbfh9] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-q3y7gbbfh9] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-q3y7gbbfh9] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-q3y7gbbfh9] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-q3y7gbbfh9] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-q3y7gbbfh9],
.timeline-item.cancelled .timeline-marker[b-q3y7gbbfh9] {
    background: #aa453e;
}

.timeline-content[b-q3y7gbbfh9] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-q3y7gbbfh9] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-q3y7gbbfh9] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-q3y7gbbfh9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-q3y7gbbfh9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-q3y7gbbfh9] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-q3y7gbbfh9] {
    color: #2d78a4;
}

.summary-card.progress[b-q3y7gbbfh9] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-q3y7gbbfh9] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-q3y7gbbfh9] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-q3y7gbbfh9] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-q3y7gbbfh9] {
    background: #aa453e;
}

.tracking-number-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-q3y7gbbfh9] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-q3y7gbbfh9],
.assigned-by-cell[b-q3y7gbbfh9],
.latest-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-q3y7gbbfh9],
.assigned-by-cell strong[b-q3y7gbbfh9],
.latest-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-q3y7gbbfh9],
.assigned-by-cell small[b-q3y7gbbfh9],
.latest-cell small[b-q3y7gbbfh9] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-q3y7gbbfh9] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-q3y7gbbfh9],
.status-chip.cancelled[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-q3y7gbbfh9] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-q3y7gbbfh9] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.result-view-modal[b-q3y7gbbfh9] {
    width: min(100%, 940px);
}

.tracking-banner[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-q3y7gbbfh9] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-q3y7gbbfh9],
.banner-officer[b-q3y7gbbfh9],
.banner-due[b-q3y7gbbfh9],
.banner-progress[b-q3y7gbbfh9] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-q3y7gbbfh9] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-q3y7gbbfh9],
.detail-note-grid[b-q3y7gbbfh9],
.result-history-panel[b-q3y7gbbfh9],
.attachment-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
}

.assignment-instruction[b-q3y7gbbfh9] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-q3y7gbbfh9],
.detail-note-grid small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-q3y7gbbfh9],
.detail-note-grid p[b-q3y7gbbfh9] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-q3y7gbbfh9] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.result-history-panel[b-q3y7gbbfh9] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.result-history-list[b-q3y7gbbfh9] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.result-history-list[b-q3y7gbbfh9]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-q3y7gbbfh9],
.timeline-item.cancelled .timeline-marker[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-q3y7gbbfh9],
.evidence-preview[b-q3y7gbbfh9] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-q3y7gbbfh9],
    .detail-note-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-q3y7gbbfh9] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-q3y7gbbfh9] {
    width: 100%;
}

.available-count-card[b-q3y7gbbfh9] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-q3y7gbbfh9] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-q3y7gbbfh9] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-q3y7gbbfh9] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-q3y7gbbfh9]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-q3y7gbbfh9]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-q3y7gbbfh9] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-q3y7gbbfh9] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-q3y7gbbfh9] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-q3y7gbbfh9] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-q3y7gbbfh9] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 1.55rem;
}

.picker-photo[b-q3y7gbbfh9] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-q3y7gbbfh9] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 2rem;
}

.picker-content[b-q3y7gbbfh9] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-q3y7gbbfh9] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-q3y7gbbfh9] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-q3y7gbbfh9] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-q3y7gbbfh9] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-q3y7gbbfh9] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-q3y7gbbfh9] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-q3y7gbbfh9] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-q3y7gbbfh9] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-q3y7gbbfh9] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-q3y7gbbfh9] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-q3y7gbbfh9] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-q3y7gbbfh9] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-q3y7gbbfh9] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-q3y7gbbfh9] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-q3y7gbbfh9] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-q3y7gbbfh9] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-q3y7gbbfh9] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-q3y7gbbfh9] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-q3y7gbbfh9] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-q3y7gbbfh9] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-q3y7gbbfh9],
    .selected-complaint-panel[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-q3y7gbbfh9] {
        min-height: 220px;
    }

    .selected-info-grid[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-q3y7gbbfh9] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-q3y7gbbfh9] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-q3y7gbbfh9] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-q3y7gbbfh9] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-q3y7gbbfh9] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-q3y7gbbfh9] {
    color: #b47b22;
}

.summary-card.overdue[b-q3y7gbbfh9] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-q3y7gbbfh9] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-q3y7gbbfh9] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-q3y7gbbfh9] {
    background: #75837d;
}

.status-overview-card.completed > span[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-q3y7gbbfh9] {
    background: #bc4d45;
}

.tracking-number-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-q3y7gbbfh9] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-q3y7gbbfh9],
.progress-cell[b-q3y7gbbfh9],
.followup-cell[b-q3y7gbbfh9],
.latest-cell[b-q3y7gbbfh9],
.department-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-q3y7gbbfh9],
.followup-cell strong[b-q3y7gbbfh9],
.latest-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-q3y7gbbfh9],
.followup-cell small[b-q3y7gbbfh9],
.latest-cell small[b-q3y7gbbfh9] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-q3y7gbbfh9] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-q3y7gbbfh9] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-q3y7gbbfh9] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-q3y7gbbfh9] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-q3y7gbbfh9] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-q3y7gbbfh9] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-q3y7gbbfh9] {
    background: rgba(8, 112, 82, .84);
}

.summary-source-notice[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.summary-source-notice > .mud-icon-root[b-q3y7gbbfh9] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.summary-source-notice > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-source-notice strong[b-q3y7gbbfh9] {
    color: #0a6048;
    font-size: .66rem;
}

.summary-source-notice small[b-q3y7gbbfh9] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-q3y7gbbfh9] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-q3y7gbbfh9] {
    width: 100%;
}

.source-picker-list[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-q3y7gbbfh9] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-q3y7gbbfh9] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-q3y7gbbfh9] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-q3y7gbbfh9] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-q3y7gbbfh9] {
    display: block;
}

.picker-photo[b-q3y7gbbfh9] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-q3y7gbbfh9] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-q3y7gbbfh9] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-q3y7gbbfh9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-q3y7gbbfh9] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-q3y7gbbfh9] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-q3y7gbbfh9],
.picker-meta[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-q3y7gbbfh9] {
    gap: 8px 12px;
}

.picker-meta span[b-q3y7gbbfh9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-q3y7gbbfh9] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-q3y7gbbfh9] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-q3y7gbbfh9] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-q3y7gbbfh9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-q3y7gbbfh9] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-q3y7gbbfh9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-q3y7gbbfh9] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-q3y7gbbfh9] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-q3y7gbbfh9] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-q3y7gbbfh9] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-q3y7gbbfh9] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-q3y7gbbfh9] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-q3y7gbbfh9] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-q3y7gbbfh9] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-q3y7gbbfh9] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-q3y7gbbfh9] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-q3y7gbbfh9] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-q3y7gbbfh9] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: 1.30rem;
}

.result-history-panel[b-q3y7gbbfh9],
.attachment-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.result-history-list[b-q3y7gbbfh9] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.result-history-list[b-q3y7gbbfh9]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-q3y7gbbfh9] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-q3y7gbbfh9] {
    background: #e7f2f9;
}

.attachment-card.after[b-q3y7gbbfh9] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-q3y7gbbfh9],
.after-preview[b-q3y7gbbfh9] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-q3y7gbbfh9],
    .selected-source-panel[b-q3y7gbbfh9],
    .tracking-banner[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-q3y7gbbfh9] {
        min-height: 220px;
    }

    .selected-info-grid[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-q3y7gbbfh9] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-q3y7gbbfh9] {
    color: var(--theme-primary);
}

.summary-card.sla[b-q3y7gbbfh9] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-q3y7gbbfh9] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-q3y7gbbfh9] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-q3y7gbbfh9] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-q3y7gbbfh9] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-q3y7gbbfh9] {
    background: var(--theme-primary);
}

.summary-number-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.summary-number-cell > span[b-q3y7gbbfh9] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.summary-number-cell small[b-q3y7gbbfh9] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-q3y7gbbfh9] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-q3y7gbbfh9] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-q3y7gbbfh9] {
    font-size: .36rem;
}

.resolution-chip[b-q3y7gbbfh9],
.publication-chip[b-q3y7gbbfh9],
.sla-chip[b-q3y7gbbfh9],
.source-sla-chip[b-q3y7gbbfh9] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-q3y7gbbfh9] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-q3y7gbbfh9] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-q3y7gbbfh9] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-q3y7gbbfh9] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-q3y7gbbfh9],
.source-sla-chip.within[b-q3y7gbbfh9] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-q3y7gbbfh9],
.source-sla-chip.over[b-q3y7gbbfh9] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-q3y7gbbfh9],
.closed-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-q3y7gbbfh9],
.closed-cell strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-q3y7gbbfh9],
.closed-cell small[b-q3y7gbbfh9] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-q3y7gbbfh9] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-q3y7gbbfh9] {
    color: #aa453e;
}

.score-cell[b-q3y7gbbfh9] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-q3y7gbbfh9] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-q3y7gbbfh9] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-q3y7gbbfh9] {
    color: #d0a43f;
}

.score-cell small[b-q3y7gbbfh9] {
    color: #8c9893;
    font-size: .47rem;
}

.result-banner[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.result-banner > div[b-q3y7gbbfh9] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.result-banner .banner-department[b-q3y7gbbfh9] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-q3y7gbbfh9] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.result-banner small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .48rem;
}

.result-banner strong[b-q3y7gbbfh9] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: 1.15rem;
}

.summary-highlight[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.summary-highlight small[b-q3y7gbbfh9] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.summary-highlight h3[b-q3y7gbbfh9] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.summary-highlight p[b-q3y7gbbfh9] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.result-history-panel[b-q3y7gbbfh9] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.result-history-list[b-q3y7gbbfh9] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.result-history-list article[b-q3y7gbbfh9] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.result-history-list article > span[b-q3y7gbbfh9] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.result-history-list article > div > div[b-q3y7gbbfh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.result-history-list strong[b-q3y7gbbfh9] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.result-history-list small[b-q3y7gbbfh9] {
    color: #8b9993;
    font-size: .46rem;
}

.result-history-list p[b-q3y7gbbfh9] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.result-history-list em[b-q3y7gbbfh9] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-q3y7gbbfh9] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-q3y7gbbfh9] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-q3y7gbbfh9] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-q3y7gbbfh9] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-q3y7gbbfh9] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-q3y7gbbfh9] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-q3y7gbbfh9] {
    display: block;
}

@media (max-width: 1200px) {
    .result-banner[b-q3y7gbbfh9],
    .three-columns[b-q3y7gbbfh9] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .result-banner[b-q3y7gbbfh9],
    .three-columns[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-q3y7gbbfh9] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   READ-ONLY REPORT MODE + COLORED KPI ICONS
   ========================================================= */
.summary-card[b-q3y7gbbfh9] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);

    border-color: var(--summary-border);
}

.summary-card.total[b-q3y7gbbfh9] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.resolved[b-q3y7gbbfh9] {
    --summary-accent: #2d78a4;
    --summary-soft: #e2f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.sla[b-q3y7gbbfh9] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.satisfaction[b-q3y7gbbfh9] {
    --summary-accent: #b5781d;
    --summary-soft: #fff0cf;
    --summary-border: rgba(181, 120, 29, .22);
}

.summary-card .summary-line[b-q3y7gbbfh9] {
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--summary-accent),
            transparent);
}

.summary-card .summary-icon[b-q3y7gbbfh9] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);

    box-shadow:
        0 11px 25px rgba(5, 62, 46, .11);
}

.summary-page[b-q3y7gbbfh9]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card p strong[b-q3y7gbbfh9] {
    color: var(--summary-accent);
}

.report-mode-badge[b-q3y7gbbfh9] {
    display: flex;
    min-height: 48px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 112, 84, .97),
            rgba(4, 61, 47, .99));

    box-shadow: 0 10px 25px rgba(4, 61, 47, .18);
}

.report-mode-badge > span[b-q3y7gbbfh9] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #5e4314;
    background: #f0d89f;
}

.report-mode-badge > div[b-q3y7gbbfh9] {
    display: flex;
    flex-direction: column;
}

.report-mode-badge strong[b-q3y7gbbfh9] {
    color: #fff;
    font-size: .56rem;
    letter-spacing: .08em;
}

.report-mode-badge small[b-q3y7gbbfh9] {
    margin-top: 1px;
    color: rgba(255, 255, 255, .72);
    font-size: .46rem;
}

.summary-page[b-q3y7gbbfh9]  .report-detail-button {
    min-width: 94px;

    border-color: rgba(8, 112, 84, .25) !important;
    border-radius: 10px !important;

    color: var(--theme-primary) !important;
    background: #edf8f3 !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .48rem !important;
    font-weight: 650 !important;
}

.summary-page[b-q3y7gbbfh9]  .report-detail-button:hover {
    border-color: var(--theme-primary) !important;
    background: #dff3e9 !important;
}

.toolbar-actions[b-q3y7gbbfh9] {
    justify-content: flex-end;
}

@media (max-width: 700px) {
    .report-mode-badge[b-q3y7gbbfh9] {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/04complaints/OperationTracking.razor.rz.scp.css */
.tracking-page[b-iqldbxshvz] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.tracking-page[b-iqldbxshvz]  .tracking-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.tracking-hero[b-iqldbxshvz] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-iqldbxshvz] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-iqldbxshvz] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-iqldbxshvz] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-iqldbxshvz] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-iqldbxshvz] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-iqldbxshvz] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-iqldbxshvz] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-iqldbxshvz] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-iqldbxshvz] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-iqldbxshvz] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-iqldbxshvz] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.tracking-page[b-iqldbxshvz]  .hero-add-button,
.tracking-page[b-iqldbxshvz]  .search-button,
.tracking-page[b-iqldbxshvz]  .toolbar-add-button,
.tracking-page[b-iqldbxshvz]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.tracking-page[b-iqldbxshvz]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-iqldbxshvz] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-iqldbxshvz] {
    opacity: .55;
    cursor: not-allowed;
}

.tracking-page[b-iqldbxshvz]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.tracking-page[b-iqldbxshvz]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-iqldbxshvz] {
    margin-top: 7px;
}

.summary-card[b-iqldbxshvz] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-iqldbxshvz] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-iqldbxshvz] {
    color: #2c7da8;
}

.summary-card.pending[b-iqldbxshvz] {
    color: #7658a7;
}

.summary-card.urgent[b-iqldbxshvz] {
    color: #c05b4e;
}

.summary-line[b-iqldbxshvz] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-iqldbxshvz] {
    min-width: 0;
}

.summary-card small[b-iqldbxshvz] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-iqldbxshvz] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-iqldbxshvz] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-iqldbxshvz] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-iqldbxshvz] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-iqldbxshvz],
.tracking-list-panel[b-iqldbxshvz] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-iqldbxshvz],
.list-toolbar[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-iqldbxshvz],
.panel-kicker[b-iqldbxshvz] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-iqldbxshvz],
.list-toolbar h2[b-iqldbxshvz] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-iqldbxshvz],
.list-toolbar p[b-iqldbxshvz] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-iqldbxshvz] {
    align-items: center;
}

.tracking-page[b-iqldbxshvz]  .premium-field,
.tracking-page[b-iqldbxshvz]  .form-field {
    width: 100%;
}

.tracking-page[b-iqldbxshvz]  .premium-field .mud-input-outlined-border,
.tracking-page[b-iqldbxshvz]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.tracking-page[b-iqldbxshvz]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.tracking-page[b-iqldbxshvz]  .sort-select {
    width: 170px;
}

.tracking-page[b-iqldbxshvz]  .toolbar-add-button {
    min-height: 42px;
}

.tracking-page[b-iqldbxshvz]  .tracking-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.tracking-page[b-iqldbxshvz]  .tracking-table .mud-table-head {
    background: #eef6f2;
}

.tracking-page[b-iqldbxshvz]  .tracking-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-iqldbxshvz] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-iqldbxshvz],
.mini-photo-empty[b-iqldbxshvz] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-iqldbxshvz] {
    cursor: zoom-in;
}

.mini-photo-button img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-iqldbxshvz] {
    object-fit: cover;
}

.mini-photo-button small[b-iqldbxshvz] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-iqldbxshvz] {
    color: #9c7b38;
}

.applicant-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-iqldbxshvz],
.applicant-cell small[b-iqldbxshvz] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-iqldbxshvz] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-iqldbxshvz] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-iqldbxshvz],
.channel-chip[b-iqldbxshvz],
.priority-chip[b-iqldbxshvz],
.status-chip[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-iqldbxshvz],
.type-chip.construction[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-iqldbxshvz],
.type-chip.food_license[b-iqldbxshvz],
.type-chip.tax[b-iqldbxshvz] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-iqldbxshvz],
.type-chip.environment[b-iqldbxshvz] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-iqldbxshvz],
.date-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-iqldbxshvz],
.date-cell strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-iqldbxshvz],
.date-cell small[b-iqldbxshvz] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-iqldbxshvz] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-iqldbxshvz] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-iqldbxshvz] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-iqldbxshvz] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-iqldbxshvz] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-iqldbxshvz] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-iqldbxshvz] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.tracking-page[b-iqldbxshvz]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.tracking-page[b-iqldbxshvz]  .row-action.view {
    color: #2d79a2;
}

.tracking-page[b-iqldbxshvz]  .row-action.edit {
    color: var(--theme-primary);
}

.tracking-page[b-iqldbxshvz]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.tracking-page[b-iqldbxshvz]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-iqldbxshvz] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-iqldbxshvz] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-iqldbxshvz] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-iqldbxshvz] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-iqldbxshvz] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.tracking-form-modal[b-iqldbxshvz],
.tracking-view-modal[b-iqldbxshvz],
.delete-modal[b-iqldbxshvz] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-iqldbxshvz .22s ease-out;
}

@keyframes modalAppear-b-iqldbxshvz {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.tracking-form-modal[b-iqldbxshvz] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-iqldbxshvz] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-iqldbxshvz] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-iqldbxshvz] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-iqldbxshvz] {
    margin-top: 24px;
}

.form-section-title > span[b-iqldbxshvz] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-iqldbxshvz] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-iqldbxshvz] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-iqldbxshvz] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-iqldbxshvz] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-iqldbxshvz] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-iqldbxshvz] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-iqldbxshvz] {
    min-height: 310px;
}

.photo-preview img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-iqldbxshvz] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-iqldbxshvz] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-iqldbxshvz] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-iqldbxshvz],
.remove-photo-button[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-iqldbxshvz] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-iqldbxshvz] {
    display: none;
}

.remove-photo-button[b-iqldbxshvz] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.tracking-page[b-iqldbxshvz]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tracking-page[b-iqldbxshvz]  .cancel-button,
.tracking-page[b-iqldbxshvz]  .save-button,
.tracking-page[b-iqldbxshvz]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.tracking-page[b-iqldbxshvz]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.tracking-page[b-iqldbxshvz]  .save-button {
    min-width: 170px;
}

.tracking-view-modal[b-iqldbxshvz] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-iqldbxshvz] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-iqldbxshvz] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-iqldbxshvz] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-iqldbxshvz] {
    font-size: 5rem;
}

.view-cover-overlay[b-iqldbxshvz] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-iqldbxshvz] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-iqldbxshvz] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-iqldbxshvz] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-iqldbxshvz] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-iqldbxshvz] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-iqldbxshvz] {
    padding: 22px;
}

.view-toolbar[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-iqldbxshvz] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-iqldbxshvz],
.view-info-grid span[b-iqldbxshvz],
.view-description small[b-iqldbxshvz],
.attachment-heading small[b-iqldbxshvz],
.view-note small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-iqldbxshvz] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-iqldbxshvz] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-iqldbxshvz] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-iqldbxshvz] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-iqldbxshvz] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-iqldbxshvz] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-iqldbxshvz] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-iqldbxshvz] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-iqldbxshvz] {
    background: #f3efe5;
}

.attachment-card img[b-iqldbxshvz] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-iqldbxshvz] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-iqldbxshvz] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-iqldbxshvz] {
    font-size: 2.3rem;
}

.view-note[b-iqldbxshvz] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-iqldbxshvz] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-iqldbxshvz] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-iqldbxshvz] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-iqldbxshvz] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-iqldbxshvz] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-iqldbxshvz] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-iqldbxshvz] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-iqldbxshvz] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-iqldbxshvz] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-iqldbxshvz] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-iqldbxshvz] {
    color: #963b36;
}

.delete-warning[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.tracking-page[b-iqldbxshvz]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .tracking-hero[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-iqldbxshvz] {
        max-width: 570px;
    }

    .list-toolbar[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-iqldbxshvz] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .tracking-page[b-iqldbxshvz] {
        padding: 15px 12px 30px;
    }

    .tracking-hero[b-iqldbxshvz] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-iqldbxshvz] {
        font-size: 2.3rem;
    }

    .hero-meta[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-iqldbxshvz] {
        width: 100%;
    }

    .filter-heading[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }

    .tracking-page[b-iqldbxshvz]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-iqldbxshvz] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-iqldbxshvz],
    .attachment-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-iqldbxshvz],
    .view-info-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-iqldbxshvz] {
        align-items: end;
        padding: 0;
    }

    .tracking-form-modal[b-iqldbxshvz],
    .tracking-view-modal[b-iqldbxshvz] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-iqldbxshvz] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-iqldbxshvz],
    .tracking-list-panel[b-iqldbxshvz] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-iqldbxshvz] {
        align-items: flex-start;
    }

    .modal-icon[b-iqldbxshvz] {
        display: none;
    }

    .modal-footer[b-iqldbxshvz] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tracking-page[b-iqldbxshvz]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-iqldbxshvz] {
        padding: 0;
    }

    .image-preview-modal[b-iqldbxshvz] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-iqldbxshvz],
    .tracking-form-modal[b-iqldbxshvz],
    .tracking-view-modal[b-iqldbxshvz],
    .delete-modal[b-iqldbxshvz] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-iqldbxshvz] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-iqldbxshvz],
.status-overview-card.selected[b-iqldbxshvz] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-iqldbxshvz] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-iqldbxshvz] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-iqldbxshvz] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-iqldbxshvz] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-iqldbxshvz] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-iqldbxshvz] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-iqldbxshvz] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-iqldbxshvz] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-iqldbxshvz] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-iqldbxshvz],
.complainant-cell small[b-iqldbxshvz] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-iqldbxshvz] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-iqldbxshvz] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-iqldbxshvz] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-iqldbxshvz] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-iqldbxshvz] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-iqldbxshvz] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-iqldbxshvz] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-iqldbxshvz] {
    min-width: 116px;
}

.privacy-chip[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-iqldbxshvz] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-iqldbxshvz] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-iqldbxshvz],
.status-chip.cancelled[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-iqldbxshvz] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-iqldbxshvz] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-iqldbxshvz] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-iqldbxshvz] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-iqldbxshvz] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-iqldbxshvz] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-iqldbxshvz] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-iqldbxshvz],
.evidence-preview[b-iqldbxshvz] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.tracking-view-modal[b-iqldbxshvz] {
    width: min(100%, 920px);
}

.desired-resolution[b-iqldbxshvz],
.screening-panel[b-iqldbxshvz],
.attachment-panel[b-iqldbxshvz] {
    margin-top: 15px;
}

.desired-resolution[b-iqldbxshvz] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-iqldbxshvz],
.screening-panel small[b-iqldbxshvz],
.section-heading small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-iqldbxshvz],
.screening-panel p[b-iqldbxshvz] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-iqldbxshvz] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-iqldbxshvz] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-iqldbxshvz] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-iqldbxshvz] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-iqldbxshvz] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-iqldbxshvz] {
    background: #f3efe5;
}

.attachment-card img[b-iqldbxshvz] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-iqldbxshvz] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-iqldbxshvz] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-iqldbxshvz] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-iqldbxshvz] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-iqldbxshvz],
    .screening-panel[b-iqldbxshvz],
    .attachment-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-iqldbxshvz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-iqldbxshvz] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-iqldbxshvz] {
    background: #aa453e;
}

.summary-card.overdue[b-iqldbxshvz],
.summary-card.urgent[b-iqldbxshvz] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-iqldbxshvz] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-iqldbxshvz] {
    min-width: 150px;
}

.progress-heading[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-iqldbxshvz] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-iqldbxshvz],
.latest-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-iqldbxshvz],
.latest-cell strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-iqldbxshvz],
.latest-cell small[b-iqldbxshvz] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-iqldbxshvz],
.due-cell.overdue small[b-iqldbxshvz] {
    color: #b54842;
}

.overdue-chip[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-iqldbxshvz] {
    margin-top: 8px;
}

.form-progress-preview[b-iqldbxshvz] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-iqldbxshvz] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-iqldbxshvz] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-iqldbxshvz],
.tracking-timeline-panel[b-iqldbxshvz] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-iqldbxshvz],
.section-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-iqldbxshvz],
.section-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-iqldbxshvz],
.section-heading h3[b-iqldbxshvz] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-iqldbxshvz] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-iqldbxshvz]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-iqldbxshvz] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.tracking-timeline[b-iqldbxshvz] {
    position: relative;
    margin-top: 15px;
}

.tracking-timeline[b-iqldbxshvz]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-iqldbxshvz] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-iqldbxshvz] {
    padding-bottom: 0;
}

.timeline-marker[b-iqldbxshvz] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-iqldbxshvz] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-iqldbxshvz] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-iqldbxshvz] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-iqldbxshvz] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-iqldbxshvz] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-iqldbxshvz],
.timeline-item.cancelled .timeline-marker[b-iqldbxshvz] {
    background: #aa453e;
}

.timeline-content[b-iqldbxshvz] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-iqldbxshvz] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-iqldbxshvz] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-iqldbxshvz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-iqldbxshvz] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-iqldbxshvz] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-iqldbxshvz] {
    color: #2d78a4;
}

.summary-card.progress[b-iqldbxshvz] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-iqldbxshvz] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-iqldbxshvz] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-iqldbxshvz] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-iqldbxshvz] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-iqldbxshvz] {
    background: #aa453e;
}

.tracking-number-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-iqldbxshvz] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-iqldbxshvz],
.assigned-by-cell[b-iqldbxshvz],
.latest-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-iqldbxshvz],
.assigned-by-cell strong[b-iqldbxshvz],
.latest-cell strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-iqldbxshvz],
.assigned-by-cell small[b-iqldbxshvz],
.latest-cell small[b-iqldbxshvz] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-iqldbxshvz] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-iqldbxshvz],
.status-chip.cancelled[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-iqldbxshvz] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-iqldbxshvz] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.tracking-view-modal[b-iqldbxshvz] {
    width: min(100%, 940px);
}

.tracking-banner[b-iqldbxshvz] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-iqldbxshvz] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-iqldbxshvz],
.banner-officer[b-iqldbxshvz],
.banner-due[b-iqldbxshvz],
.banner-progress[b-iqldbxshvz] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-iqldbxshvz] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-iqldbxshvz] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-iqldbxshvz],
.detail-note-grid[b-iqldbxshvz],
.tracking-timeline-panel[b-iqldbxshvz],
.attachment-panel[b-iqldbxshvz] {
    margin-top: 15px;
}

.assignment-instruction[b-iqldbxshvz] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-iqldbxshvz],
.detail-note-grid small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-iqldbxshvz],
.detail-note-grid p[b-iqldbxshvz] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-iqldbxshvz] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.tracking-timeline-panel[b-iqldbxshvz] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tracking-timeline[b-iqldbxshvz] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.tracking-timeline[b-iqldbxshvz]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-iqldbxshvz],
.timeline-item.cancelled .timeline-marker[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-iqldbxshvz],
.evidence-preview[b-iqldbxshvz] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-iqldbxshvz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-iqldbxshvz],
    .detail-note-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-iqldbxshvz] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-iqldbxshvz] {
    width: 100%;
}

.available-count-card[b-iqldbxshvz] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-iqldbxshvz] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-iqldbxshvz] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-iqldbxshvz] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-iqldbxshvz]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-iqldbxshvz]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-iqldbxshvz] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-iqldbxshvz] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-iqldbxshvz] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-iqldbxshvz] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-iqldbxshvz] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-iqldbxshvz] {
    font-size: 1.55rem;
}

.picker-photo[b-iqldbxshvz] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-iqldbxshvz] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-iqldbxshvz] {
    font-size: 2rem;
}

.picker-content[b-iqldbxshvz] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-iqldbxshvz] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-iqldbxshvz] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-iqldbxshvz] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-iqldbxshvz] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-iqldbxshvz] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-iqldbxshvz] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-iqldbxshvz] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-iqldbxshvz] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-iqldbxshvz] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-iqldbxshvz] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-iqldbxshvz] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-iqldbxshvz] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-iqldbxshvz] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-iqldbxshvz] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-iqldbxshvz] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-iqldbxshvz] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-iqldbxshvz] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-iqldbxshvz] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-iqldbxshvz] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-iqldbxshvz] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-iqldbxshvz] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-iqldbxshvz] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-iqldbxshvz] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-iqldbxshvz],
    .selected-complaint-panel[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-iqldbxshvz] {
        min-height: 220px;
    }

    .selected-info-grid[b-iqldbxshvz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-iqldbxshvz] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-iqldbxshvz] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-iqldbxshvz] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-iqldbxshvz] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-iqldbxshvz] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-iqldbxshvz] {
    color: #b47b22;
}

.summary-card.overdue[b-iqldbxshvz] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-iqldbxshvz] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-iqldbxshvz] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-iqldbxshvz] {
    background: #75837d;
}

.status-overview-card.completed > span[b-iqldbxshvz] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-iqldbxshvz] {
    background: #bc4d45;
}

.tracking-number-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-iqldbxshvz] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-iqldbxshvz],
.progress-cell[b-iqldbxshvz],
.followup-cell[b-iqldbxshvz],
.latest-cell[b-iqldbxshvz],
.department-cell[b-iqldbxshvz] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-iqldbxshvz],
.followup-cell strong[b-iqldbxshvz],
.latest-cell strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-iqldbxshvz],
.followup-cell small[b-iqldbxshvz],
.latest-cell small[b-iqldbxshvz] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-iqldbxshvz] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-iqldbxshvz] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-iqldbxshvz] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-iqldbxshvz] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-iqldbxshvz] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-iqldbxshvz] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-iqldbxshvz] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-iqldbxshvz] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-iqldbxshvz] {
    background: rgba(8, 112, 82, .84);
}

.tracking-source-notice[b-iqldbxshvz] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.tracking-source-notice > .mud-icon-root[b-iqldbxshvz] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.tracking-source-notice > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.tracking-source-notice strong[b-iqldbxshvz] {
    color: #0a6048;
    font-size: .66rem;
}

.tracking-source-notice small[b-iqldbxshvz] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.assignment-picker-panel[b-iqldbxshvz] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.assignment-picker-toolbar[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.assignment-picker-search[b-iqldbxshvz] {
    width: 100%;
}

.assignment-picker-list[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.assignment-picker-card[b-iqldbxshvz] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.assignment-picker-card:hover[b-iqldbxshvz] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.assignment-picker-card.selected[b-iqldbxshvz] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-iqldbxshvz] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.assignment-picker-card.selected .picker-selected-mark[b-iqldbxshvz] {
    display: block;
}

.picker-photo[b-iqldbxshvz] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-iqldbxshvz] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-iqldbxshvz] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-iqldbxshvz] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-iqldbxshvz] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-iqldbxshvz] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-iqldbxshvz],
.picker-meta[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-iqldbxshvz] {
    gap: 8px 12px;
}

.picker-meta span[b-iqldbxshvz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-iqldbxshvz] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-iqldbxshvz] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-iqldbxshvz] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-iqldbxshvz] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-assignment-panel[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-assignment-photo[b-iqldbxshvz] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-assignment-photo img[b-iqldbxshvz] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-assignment-content[b-iqldbxshvz] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-iqldbxshvz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-iqldbxshvz] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-iqldbxshvz] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-iqldbxshvz] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-iqldbxshvz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-iqldbxshvz] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-iqldbxshvz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-iqldbxshvz] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-iqldbxshvz] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-iqldbxshvz] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-assignment-hint[b-iqldbxshvz] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-assignment-hint > div[b-iqldbxshvz] {
    display: flex;
    flex-direction: column;
}

.select-assignment-hint strong[b-iqldbxshvz] {
    color: #6c5729;
    font-size: .66rem;
}

.select-assignment-hint small[b-iqldbxshvz] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-iqldbxshvz] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-iqldbxshvz] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-iqldbxshvz] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-iqldbxshvz] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-iqldbxshvz] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-iqldbxshvz] {
    color: #9c7932;
    font-size: 1.30rem;
}

.tracking-timeline-panel[b-iqldbxshvz],
.attachment-panel[b-iqldbxshvz] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tracking-timeline[b-iqldbxshvz] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.tracking-timeline[b-iqldbxshvz]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-iqldbxshvz] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-iqldbxshvz] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-iqldbxshvz] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-iqldbxshvz] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-iqldbxshvz] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-iqldbxshvz] {
    background: #e7f2f9;
}

.attachment-card.after[b-iqldbxshvz] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-iqldbxshvz],
.after-preview[b-iqldbxshvz] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-iqldbxshvz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .assignment-picker-list[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .assignment-picker-toolbar[b-iqldbxshvz],
    .selected-assignment-panel[b-iqldbxshvz],
    .tracking-banner[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-assignment-photo[b-iqldbxshvz] {
        min-height: 220px;
    }

    .selected-info-grid[b-iqldbxshvz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .assignment-picker-card[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-iqldbxshvz] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-iqldbxshvz] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Pages/01Ziticen/05repairs/NewRepairRequests.razor.rz.scp.css */
.repair-page[b-oxxfmpo0lo] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.repair-page[b-oxxfmpo0lo]  .repair-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.repair-hero[b-oxxfmpo0lo] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-oxxfmpo0lo] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-oxxfmpo0lo] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-oxxfmpo0lo] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-oxxfmpo0lo] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-oxxfmpo0lo] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-oxxfmpo0lo] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-oxxfmpo0lo] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-oxxfmpo0lo] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-oxxfmpo0lo] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-oxxfmpo0lo] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.repair-page[b-oxxfmpo0lo]  .hero-add-button,
.repair-page[b-oxxfmpo0lo]  .search-button,
.repair-page[b-oxxfmpo0lo]  .toolbar-add-button,
.repair-page[b-oxxfmpo0lo]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.repair-page[b-oxxfmpo0lo]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-oxxfmpo0lo] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-oxxfmpo0lo] {
    opacity: .55;
    cursor: not-allowed;
}

.repair-page[b-oxxfmpo0lo]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.repair-page[b-oxxfmpo0lo]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-oxxfmpo0lo] {
    margin-top: 7px;
}

.summary-card[b-oxxfmpo0lo] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-oxxfmpo0lo] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-oxxfmpo0lo] {
    color: #2c7da8;
}

.summary-card.pending[b-oxxfmpo0lo] {
    color: #7658a7;
}

.summary-card.urgent[b-oxxfmpo0lo] {
    color: #c05b4e;
}

.summary-line[b-oxxfmpo0lo] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-oxxfmpo0lo] {
    min-width: 0;
}

.summary-card small[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-oxxfmpo0lo] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-oxxfmpo0lo] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-oxxfmpo0lo] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-oxxfmpo0lo],
.repair-list-panel[b-oxxfmpo0lo] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-oxxfmpo0lo],
.list-toolbar[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-oxxfmpo0lo],
.panel-kicker[b-oxxfmpo0lo] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-oxxfmpo0lo],
.list-toolbar h2[b-oxxfmpo0lo] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-oxxfmpo0lo],
.list-toolbar p[b-oxxfmpo0lo] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-oxxfmpo0lo] {
    align-items: center;
}

.repair-page[b-oxxfmpo0lo]  .premium-field,
.repair-page[b-oxxfmpo0lo]  .form-field {
    width: 100%;
}

.repair-page[b-oxxfmpo0lo]  .premium-field .mud-input-outlined-border,
.repair-page[b-oxxfmpo0lo]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.repair-page[b-oxxfmpo0lo]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.repair-page[b-oxxfmpo0lo]  .sort-select {
    width: 170px;
}

.repair-page[b-oxxfmpo0lo]  .toolbar-add-button {
    min-height: 42px;
}

.repair-page[b-oxxfmpo0lo]  .repair-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.repair-page[b-oxxfmpo0lo]  .repair-table .mud-table-head {
    background: #eef6f2;
}

.repair-page[b-oxxfmpo0lo]  .repair-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-oxxfmpo0lo] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-oxxfmpo0lo],
.mini-photo-empty[b-oxxfmpo0lo] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-oxxfmpo0lo] {
    cursor: zoom-in;
}

.mini-photo-button img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-oxxfmpo0lo] {
    object-fit: cover;
}

.mini-photo-button small[b-oxxfmpo0lo] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-oxxfmpo0lo] {
    color: #9c7b38;
}

.applicant-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-oxxfmpo0lo],
.applicant-cell small[b-oxxfmpo0lo] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-oxxfmpo0lo] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-oxxfmpo0lo],
.channel-chip[b-oxxfmpo0lo],
.priority-chip[b-oxxfmpo0lo],
.status-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-oxxfmpo0lo],
.type-chip.construction[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-oxxfmpo0lo],
.type-chip.food_license[b-oxxfmpo0lo],
.type-chip.tax[b-oxxfmpo0lo] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-oxxfmpo0lo],
.type-chip.environment[b-oxxfmpo0lo] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-oxxfmpo0lo],
.date-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-oxxfmpo0lo],
.date-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-oxxfmpo0lo],
.date-cell small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-oxxfmpo0lo] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-oxxfmpo0lo] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-oxxfmpo0lo] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-oxxfmpo0lo] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-oxxfmpo0lo] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.repair-page[b-oxxfmpo0lo]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.repair-page[b-oxxfmpo0lo]  .row-action.view {
    color: #2d79a2;
}

.repair-page[b-oxxfmpo0lo]  .row-action.edit {
    color: var(--theme-primary);
}

.repair-page[b-oxxfmpo0lo]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.repair-page[b-oxxfmpo0lo]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-oxxfmpo0lo] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-oxxfmpo0lo] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-oxxfmpo0lo] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-oxxfmpo0lo] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-oxxfmpo0lo] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.repair-form-modal[b-oxxfmpo0lo],
.repair-view-modal[b-oxxfmpo0lo],
.delete-modal[b-oxxfmpo0lo] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-oxxfmpo0lo .22s ease-out;
}

@keyframes modalAppear-b-oxxfmpo0lo {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.repair-form-modal[b-oxxfmpo0lo] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-oxxfmpo0lo] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-oxxfmpo0lo] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-oxxfmpo0lo] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-oxxfmpo0lo] {
    margin-top: 24px;
}

.form-section-title > span[b-oxxfmpo0lo] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-oxxfmpo0lo] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-oxxfmpo0lo] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-oxxfmpo0lo] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-oxxfmpo0lo] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-oxxfmpo0lo] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-oxxfmpo0lo] {
    min-height: 310px;
}

.photo-preview img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-oxxfmpo0lo] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-oxxfmpo0lo] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-oxxfmpo0lo] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-oxxfmpo0lo],
.remove-photo-button[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-oxxfmpo0lo] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-oxxfmpo0lo] {
    display: none;
}

.remove-photo-button[b-oxxfmpo0lo] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.repair-page[b-oxxfmpo0lo]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.repair-page[b-oxxfmpo0lo]  .cancel-button,
.repair-page[b-oxxfmpo0lo]  .save-button,
.repair-page[b-oxxfmpo0lo]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.repair-page[b-oxxfmpo0lo]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.repair-page[b-oxxfmpo0lo]  .save-button {
    min-width: 170px;
}

.repair-view-modal[b-oxxfmpo0lo] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-oxxfmpo0lo] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-oxxfmpo0lo] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-oxxfmpo0lo] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 5rem;
}

.view-cover-overlay[b-oxxfmpo0lo] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-oxxfmpo0lo] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-oxxfmpo0lo] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-oxxfmpo0lo] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-oxxfmpo0lo] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-oxxfmpo0lo] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-oxxfmpo0lo] {
    padding: 22px;
}

.view-toolbar[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-oxxfmpo0lo] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-oxxfmpo0lo],
.view-info-grid span[b-oxxfmpo0lo],
.view-description small[b-oxxfmpo0lo],
.attachment-heading small[b-oxxfmpo0lo],
.view-note small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-oxxfmpo0lo] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-oxxfmpo0lo] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-oxxfmpo0lo] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-oxxfmpo0lo] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-oxxfmpo0lo] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-oxxfmpo0lo] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-oxxfmpo0lo] {
    background: #f3efe5;
}

.attachment-card img[b-oxxfmpo0lo] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-oxxfmpo0lo] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-oxxfmpo0lo] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 2.3rem;
}

.view-note[b-oxxfmpo0lo] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-oxxfmpo0lo] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-oxxfmpo0lo] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-oxxfmpo0lo] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-oxxfmpo0lo] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-oxxfmpo0lo] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-oxxfmpo0lo] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-oxxfmpo0lo] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-oxxfmpo0lo] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-oxxfmpo0lo] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-oxxfmpo0lo] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-oxxfmpo0lo] {
    color: #963b36;
}

.delete-warning[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.repair-page[b-oxxfmpo0lo]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .repair-hero[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-oxxfmpo0lo] {
        max-width: 570px;
    }

    .list-toolbar[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-oxxfmpo0lo] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .repair-page[b-oxxfmpo0lo] {
        padding: 15px 12px 30px;
    }

    .repair-hero[b-oxxfmpo0lo] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-oxxfmpo0lo] {
        font-size: 2.3rem;
    }

    .hero-meta[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-oxxfmpo0lo] {
        width: 100%;
    }

    .filter-heading[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }

    .repair-page[b-oxxfmpo0lo]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-oxxfmpo0lo] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-oxxfmpo0lo],
    .attachment-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-oxxfmpo0lo],
    .view-info-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-oxxfmpo0lo] {
        align-items: end;
        padding: 0;
    }

    .repair-form-modal[b-oxxfmpo0lo],
    .repair-view-modal[b-oxxfmpo0lo] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-oxxfmpo0lo] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-oxxfmpo0lo],
    .repair-list-panel[b-oxxfmpo0lo] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-oxxfmpo0lo] {
        align-items: flex-start;
    }

    .modal-icon[b-oxxfmpo0lo] {
        display: none;
    }

    .modal-footer[b-oxxfmpo0lo] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .repair-page[b-oxxfmpo0lo]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-oxxfmpo0lo] {
        padding: 0;
    }

    .image-preview-modal[b-oxxfmpo0lo] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-oxxfmpo0lo],
    .repair-form-modal[b-oxxfmpo0lo],
    .repair-view-modal[b-oxxfmpo0lo],
    .delete-modal[b-oxxfmpo0lo] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-oxxfmpo0lo] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-oxxfmpo0lo],
.status-overview-card.selected[b-oxxfmpo0lo] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-oxxfmpo0lo] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-oxxfmpo0lo] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-oxxfmpo0lo] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-oxxfmpo0lo] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-oxxfmpo0lo] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-oxxfmpo0lo] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-oxxfmpo0lo] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-oxxfmpo0lo],
.complainant-cell small[b-oxxfmpo0lo] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-oxxfmpo0lo] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-oxxfmpo0lo] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-oxxfmpo0lo] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-oxxfmpo0lo] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-oxxfmpo0lo] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-oxxfmpo0lo] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-oxxfmpo0lo] {
    min-width: 116px;
}

.privacy-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-oxxfmpo0lo] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-oxxfmpo0lo] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-oxxfmpo0lo],
.status-chip.cancelled[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-oxxfmpo0lo] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-oxxfmpo0lo] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-oxxfmpo0lo] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-oxxfmpo0lo] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-oxxfmpo0lo] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-oxxfmpo0lo],
.evidence-preview[b-oxxfmpo0lo] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.repair-view-modal[b-oxxfmpo0lo] {
    width: min(100%, 920px);
}

.desired-resolution[b-oxxfmpo0lo],
.screening-panel[b-oxxfmpo0lo],
.attachment-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
}

.desired-resolution[b-oxxfmpo0lo] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-oxxfmpo0lo],
.screening-panel small[b-oxxfmpo0lo],
.section-heading small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-oxxfmpo0lo],
.screening-panel p[b-oxxfmpo0lo] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-oxxfmpo0lo] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-oxxfmpo0lo] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-oxxfmpo0lo] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-oxxfmpo0lo] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-oxxfmpo0lo] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-oxxfmpo0lo] {
    background: #f3efe5;
}

.attachment-card img[b-oxxfmpo0lo] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-oxxfmpo0lo] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-oxxfmpo0lo] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-oxxfmpo0lo] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-oxxfmpo0lo],
    .screening-panel[b-oxxfmpo0lo],
    .attachment-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-oxxfmpo0lo] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-oxxfmpo0lo] {
    background: #aa453e;
}

.summary-card.overdue[b-oxxfmpo0lo],
.summary-card.urgent[b-oxxfmpo0lo] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-oxxfmpo0lo] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-oxxfmpo0lo] {
    min-width: 150px;
}

.progress-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-oxxfmpo0lo],
.latest-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-oxxfmpo0lo],
.latest-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-oxxfmpo0lo],
.latest-cell small[b-oxxfmpo0lo] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-oxxfmpo0lo],
.due-cell.overdue small[b-oxxfmpo0lo] {
    color: #b54842;
}

.overdue-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-oxxfmpo0lo] {
    margin-top: 8px;
}

.form-progress-preview[b-oxxfmpo0lo] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-oxxfmpo0lo] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-oxxfmpo0lo],
.history-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-oxxfmpo0lo],
.section-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-oxxfmpo0lo],
.section-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-oxxfmpo0lo],
.section-heading h3[b-oxxfmpo0lo] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-oxxfmpo0lo]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-oxxfmpo0lo] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-oxxfmpo0lo] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-oxxfmpo0lo]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-oxxfmpo0lo] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-oxxfmpo0lo] {
    padding-bottom: 0;
}

.timeline-marker[b-oxxfmpo0lo] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-oxxfmpo0lo] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-oxxfmpo0lo] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-oxxfmpo0lo] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-oxxfmpo0lo] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-oxxfmpo0lo] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-oxxfmpo0lo],
.timeline-item.cancelled .timeline-marker[b-oxxfmpo0lo] {
    background: #aa453e;
}

.timeline-content[b-oxxfmpo0lo] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-oxxfmpo0lo] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-oxxfmpo0lo] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-oxxfmpo0lo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-oxxfmpo0lo] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-oxxfmpo0lo] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-oxxfmpo0lo] {
    color: #2d78a4;
}

.summary-card.progress[b-oxxfmpo0lo] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-oxxfmpo0lo] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-oxxfmpo0lo] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-oxxfmpo0lo] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-oxxfmpo0lo] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-oxxfmpo0lo] {
    background: #aa453e;
}

.request-number-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.request-number-cell > span[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-oxxfmpo0lo] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-oxxfmpo0lo],
.assigned-by-cell[b-oxxfmpo0lo],
.latest-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-oxxfmpo0lo],
.assigned-by-cell strong[b-oxxfmpo0lo],
.latest-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-oxxfmpo0lo],
.assigned-by-cell small[b-oxxfmpo0lo],
.latest-cell small[b-oxxfmpo0lo] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-oxxfmpo0lo] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-oxxfmpo0lo],
.status-chip.cancelled[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-oxxfmpo0lo] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-oxxfmpo0lo] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.repair-view-modal[b-oxxfmpo0lo] {
    width: min(100%, 940px);
}

.repair-banner[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.repair-banner > div[b-oxxfmpo0lo] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-oxxfmpo0lo],
.banner-officer[b-oxxfmpo0lo],
.banner-due[b-oxxfmpo0lo],
.banner-progress[b-oxxfmpo0lo] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.repair-banner small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-oxxfmpo0lo] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-oxxfmpo0lo],
.detail-note-grid[b-oxxfmpo0lo],
.history-panel[b-oxxfmpo0lo],
.attachment-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
}

.assignment-instruction[b-oxxfmpo0lo] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-oxxfmpo0lo],
.detail-note-grid small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-oxxfmpo0lo],
.detail-note-grid p[b-oxxfmpo0lo] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-oxxfmpo0lo] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-oxxfmpo0lo] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-oxxfmpo0lo] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-oxxfmpo0lo]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-oxxfmpo0lo],
.timeline-item.cancelled .timeline-marker[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-oxxfmpo0lo],
.evidence-preview[b-oxxfmpo0lo] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .repair-banner[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .repair-banner[b-oxxfmpo0lo],
    .detail-note-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-oxxfmpo0lo] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-oxxfmpo0lo] {
    width: 100%;
}

.available-count-card[b-oxxfmpo0lo] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-oxxfmpo0lo] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-oxxfmpo0lo] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-oxxfmpo0lo] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-oxxfmpo0lo]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-oxxfmpo0lo]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-oxxfmpo0lo] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-oxxfmpo0lo] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-oxxfmpo0lo] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-oxxfmpo0lo] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-oxxfmpo0lo] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 1.55rem;
}

.picker-photo[b-oxxfmpo0lo] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-oxxfmpo0lo] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 2rem;
}

.picker-content[b-oxxfmpo0lo] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-oxxfmpo0lo] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-oxxfmpo0lo] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-oxxfmpo0lo] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-oxxfmpo0lo] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-oxxfmpo0lo] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-oxxfmpo0lo] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-oxxfmpo0lo] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-oxxfmpo0lo] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-oxxfmpo0lo] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-oxxfmpo0lo] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-oxxfmpo0lo] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-oxxfmpo0lo] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-oxxfmpo0lo] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-oxxfmpo0lo] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-oxxfmpo0lo] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-oxxfmpo0lo] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-oxxfmpo0lo] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-oxxfmpo0lo] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-oxxfmpo0lo] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-oxxfmpo0lo] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-oxxfmpo0lo],
    .selected-complaint-panel[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-oxxfmpo0lo] {
        min-height: 220px;
    }

    .selected-info-grid[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-oxxfmpo0lo] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-oxxfmpo0lo] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-oxxfmpo0lo] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-oxxfmpo0lo] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-oxxfmpo0lo] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-oxxfmpo0lo] {
    color: #b47b22;
}

.summary-card.overdue[b-oxxfmpo0lo] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-oxxfmpo0lo] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-oxxfmpo0lo] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-oxxfmpo0lo] {
    background: #75837d;
}

.status-overview-card.completed > span[b-oxxfmpo0lo] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-oxxfmpo0lo] {
    background: #bc4d45;
}

.request-number-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.request-number-cell > span[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-oxxfmpo0lo] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-oxxfmpo0lo],
.progress-cell[b-oxxfmpo0lo],
.followup-cell[b-oxxfmpo0lo],
.latest-cell[b-oxxfmpo0lo],
.department-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-oxxfmpo0lo],
.followup-cell strong[b-oxxfmpo0lo],
.latest-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-oxxfmpo0lo],
.followup-cell small[b-oxxfmpo0lo],
.latest-cell small[b-oxxfmpo0lo] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-oxxfmpo0lo] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-oxxfmpo0lo] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-oxxfmpo0lo] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-oxxfmpo0lo] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-oxxfmpo0lo] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-oxxfmpo0lo] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-oxxfmpo0lo] {
    background: rgba(8, 112, 82, .84);
}

.repair-source-notice[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.repair-source-notice > .mud-icon-root[b-oxxfmpo0lo] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.repair-source-notice > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.repair-source-notice strong[b-oxxfmpo0lo] {
    color: #0a6048;
    font-size: .66rem;
}

.repair-source-notice small[b-oxxfmpo0lo] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.assignment-picker-panel[b-oxxfmpo0lo] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.assignment-picker-toolbar[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.assignment-picker-search[b-oxxfmpo0lo] {
    width: 100%;
}

.assignment-picker-list[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.assignment-picker-card[b-oxxfmpo0lo] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.assignment-picker-card:hover[b-oxxfmpo0lo] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.assignment-picker-card.selected[b-oxxfmpo0lo] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-oxxfmpo0lo] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.assignment-picker-card.selected .picker-selected-mark[b-oxxfmpo0lo] {
    display: block;
}

.picker-photo[b-oxxfmpo0lo] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-oxxfmpo0lo] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-oxxfmpo0lo] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-oxxfmpo0lo] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-oxxfmpo0lo] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-oxxfmpo0lo],
.picker-meta[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-oxxfmpo0lo] {
    gap: 8px 12px;
}

.picker-meta span[b-oxxfmpo0lo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-oxxfmpo0lo] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-oxxfmpo0lo] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-assignment-panel[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-assignment-photo[b-oxxfmpo0lo] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-assignment-photo img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-assignment-content[b-oxxfmpo0lo] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-oxxfmpo0lo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-oxxfmpo0lo] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-oxxfmpo0lo] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-oxxfmpo0lo] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-oxxfmpo0lo] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-oxxfmpo0lo] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-oxxfmpo0lo] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-oxxfmpo0lo] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-assignment-hint[b-oxxfmpo0lo] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-assignment-hint > div[b-oxxfmpo0lo] {
    display: flex;
    flex-direction: column;
}

.select-assignment-hint strong[b-oxxfmpo0lo] {
    color: #6c5729;
    font-size: .66rem;
}

.select-assignment-hint small[b-oxxfmpo0lo] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.repair-banner[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.repair-banner > div[b-oxxfmpo0lo] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.repair-banner small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-oxxfmpo0lo] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-oxxfmpo0lo],
.attachment-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-oxxfmpo0lo] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-oxxfmpo0lo]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-oxxfmpo0lo] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-oxxfmpo0lo] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-oxxfmpo0lo] {
    background: #e7f2f9;
}

.attachment-card.after[b-oxxfmpo0lo] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-oxxfmpo0lo],
.after-preview[b-oxxfmpo0lo] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .repair-banner[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .assignment-picker-list[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .assignment-picker-toolbar[b-oxxfmpo0lo],
    .selected-assignment-panel[b-oxxfmpo0lo],
    .repair-banner[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-assignment-photo[b-oxxfmpo0lo] {
        min-height: 220px;
    }

    .selected-info-grid[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .assignment-picker-card[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-oxxfmpo0lo] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   NEW REPAIR REQUEST EXTENSIONS
   ========================================================= */
.summary-card[b-oxxfmpo0lo] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);

    border-color: var(--summary-border);
}

.summary-card.total[b-oxxfmpo0lo] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.new[b-oxxfmpo0lo] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.urgent[b-oxxfmpo0lo] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.photo[b-oxxfmpo0lo] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card .summary-icon[b-oxxfmpo0lo] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.repair-page[b-oxxfmpo0lo]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-oxxfmpo0lo] {
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--summary-accent),
            transparent);
}

.summary-card p strong[b-oxxfmpo0lo] {
    color: var(--summary-accent);
}

.status-overview-card.new > span[b-oxxfmpo0lo] {
    background: #2d78a4;
}

.status-overview-card.verifying > span[b-oxxfmpo0lo] {
    background: #b47a20;
}

.status-overview-card.accepted > span[b-oxxfmpo0lo] {
    background: var(--theme-primary);
}

.status-overview-card.urgent > span[b-oxxfmpo0lo] {
    background: #bd4f43;
}

.status-overview-card.with-photo > span[b-oxxfmpo0lo] {
    background: #7658a7;
}

.request-number-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 142px;
    flex-direction: column;
}

.request-number-cell > span[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-oxxfmpo0lo] {
    margin-top: 4px;

    color: #8f9c96;
    font-size: .48rem;
}

.photo-pair-mini[b-oxxfmpo0lo] {
    display: flex;
    min-width: 86px;
    align-items: center;
    gap: 5px;
}

.mini-photo-button[b-oxxfmpo0lo] {
    position: relative;

    width: 42px;
    height: 48px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    background: #eff5f2;
    cursor: pointer;
}

.mini-photo-button img[b-oxxfmpo0lo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mini-photo-button small[b-oxxfmpo0lo] {
    position: absolute;
    right: 2px;
    bottom: 2px;
    left: 2px;

    padding: 1px 2px;

    border-radius: 5px;
    color: #fff;
    background: rgba(3, 45, 36, .77);

    font-family: 'Kanit', sans-serif;
    font-size: .34rem;
    text-align: center;
}

.mini-photo-button:hover[b-oxxfmpo0lo] {
    transform: translateY(-1px);
    border-color: rgba(7, 88, 67, .28);
}

.mini-photo-empty[b-oxxfmpo0lo] {
    display: grid;
    width: 42px;
    height: 48px;

    place-items: center;
    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 9px;

    color: #a8b5af;
    background: #f4f7f5;
}

.asset-code-chip[b-oxxfmpo0lo] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #6f5a28;
    background: #f7edda;

    font-size: .42rem;
    font-weight: 700;
}

.reporter-cell[b-oxxfmpo0lo],
.location-cell[b-oxxfmpo0lo],
.officer-cell[b-oxxfmpo0lo],
.updated-cell[b-oxxfmpo0lo] {
    display: flex;
    min-width: 125px;
    flex-direction: column;
}

.reporter-cell strong[b-oxxfmpo0lo],
.location-cell strong[b-oxxfmpo0lo],
.officer-cell strong[b-oxxfmpo0lo],
.updated-cell strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.reporter-cell small[b-oxxfmpo0lo],
.location-cell small[b-oxxfmpo0lo],
.officer-cell small[b-oxxfmpo0lo],
.updated-cell small[b-oxxfmpo0lo] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.reporter-cell em[b-oxxfmpo0lo] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e7f2f9;

    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.category-chip.road[b-oxxfmpo0lo] {
    color: #586976;
    background: #edf1f3;
}

.category-chip.lighting[b-oxxfmpo0lo] {
    color: #a36b19;
    background: #fff2d8;
}

.category-chip.water[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.drainage[b-oxxfmpo0lo] {
    color: #446b85;
    background: #e8f1f6;
}

.category-chip.building[b-oxxfmpo0lo] {
    color: #76583f;
    background: #f2ebe5;
}

.category-chip.park[b-oxxfmpo0lo] {
    color: #3f8650;
    background: #e8f5e9;
}

.category-chip.waste[b-oxxfmpo0lo] {
    color: #756640;
    background: #f1eddf;
}

.category-chip.other[b-oxxfmpo0lo] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.new[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.verifying[b-oxxfmpo0lo] {
    color: #96661c;
    background: #fff1d7;
}

.status-chip.accepted[b-oxxfmpo0lo] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-oxxfmpo0lo] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.cancelled[b-oxxfmpo0lo] {
    color: #6c7c75;
    background: #edf1ef;
}

.priority-chip.low[b-oxxfmpo0lo] {
    color: #58706a;
    background: #edf2ef;
}

.priority-chip.normal[b-oxxfmpo0lo] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-oxxfmpo0lo] {
    color: #9b6819;
    background: #fff1d7;
}

.priority-chip.urgent[b-oxxfmpo0lo] {
    color: #af443d;
    background: #fff0ef;
}

.priority-chip.critical[b-oxxfmpo0lo] {
    color: #fff;
    background: #9e2724;
}

.switch-card[b-oxxfmpo0lo] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 7px 11px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.switch-card > div[b-oxxfmpo0lo] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.switch-card small[b-oxxfmpo0lo] {
    margin-top: 2px;
    color: #88958f;
    font-size: .43rem;
}

.repair-banner[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(145px, .8fr)
        minmax(170px, .9fr)
        minmax(170px, .9fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.repair-banner > div[b-oxxfmpo0lo] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.repair-banner .banner-reporter[b-oxxfmpo0lo] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-reporter > span[b-oxxfmpo0lo] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.repair-banner small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-oxxfmpo0lo] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.description-highlight[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.description-highlight small[b-oxxfmpo0lo] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.description-highlight h3[b-oxxfmpo0lo] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.description-highlight p[b-oxxfmpo0lo] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.contact-panel[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 12px;
}

.contact-panel > div[b-oxxfmpo0lo] {
    min-height: 67px;
    padding: 11px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.contact-panel span[b-oxxfmpo0lo],
.contact-panel small[b-oxxfmpo0lo] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.contact-panel strong[b-oxxfmpo0lo] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.remark-alert[b-oxxfmpo0lo] {
    margin-top: 13px;
}

.history-panel[b-oxxfmpo0lo] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-oxxfmpo0lo] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-oxxfmpo0lo] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-oxxfmpo0lo] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-oxxfmpo0lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-oxxfmpo0lo] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-oxxfmpo0lo] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-oxxfmpo0lo] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-oxxfmpo0lo] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

@media (max-width: 1200px) {
    .repair-banner[b-oxxfmpo0lo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .repair-banner[b-oxxfmpo0lo],
    .contact-panel[b-oxxfmpo0lo] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Pages/01Ziticen/05repairs/OperationWorkMap.razor.rz.scp.css */
.operation-map-page[b-he9rat35ab] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.operation-map-page[b-he9rat35ab]  .operation-map-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.operation-map-hero[b-he9rat35ab] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-he9rat35ab] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-he9rat35ab] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-he9rat35ab] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-he9rat35ab] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-he9rat35ab] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-he9rat35ab] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-he9rat35ab] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-he9rat35ab] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-he9rat35ab] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-he9rat35ab] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-he9rat35ab] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-he9rat35ab] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.operation-map-page[b-he9rat35ab]  .hero-add-button,
.operation-map-page[b-he9rat35ab]  .search-button,
.operation-map-page[b-he9rat35ab]  .toolbar-add-button,
.operation-map-page[b-he9rat35ab]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.operation-map-page[b-he9rat35ab]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-he9rat35ab] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-he9rat35ab] {
    opacity: .55;
    cursor: not-allowed;
}

.operation-map-page[b-he9rat35ab]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.operation-map-page[b-he9rat35ab]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-he9rat35ab] {
    margin-top: 7px;
}

.summary-card[b-he9rat35ab] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-he9rat35ab] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-he9rat35ab] {
    color: #2c7da8;
}

.summary-card.pending[b-he9rat35ab] {
    color: #7658a7;
}

.summary-card.urgent[b-he9rat35ab] {
    color: #c05b4e;
}

.summary-line[b-he9rat35ab] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-he9rat35ab] {
    min-width: 0;
}

.summary-card small[b-he9rat35ab] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-he9rat35ab] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-he9rat35ab] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-he9rat35ab] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-he9rat35ab] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-he9rat35ab],
.operation-list-panel[b-he9rat35ab] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-he9rat35ab],
.list-toolbar[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-he9rat35ab],
.panel-kicker[b-he9rat35ab] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-he9rat35ab],
.list-toolbar h2[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-he9rat35ab],
.list-toolbar p[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-he9rat35ab] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-he9rat35ab] {
    align-items: center;
}

.operation-map-page[b-he9rat35ab]  .premium-field,
.operation-map-page[b-he9rat35ab]  .form-field {
    width: 100%;
}

.operation-map-page[b-he9rat35ab]  .premium-field .mud-input-outlined-border,
.operation-map-page[b-he9rat35ab]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.operation-map-page[b-he9rat35ab]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.operation-map-page[b-he9rat35ab]  .sort-select {
    width: 170px;
}

.operation-map-page[b-he9rat35ab]  .toolbar-add-button {
    min-height: 42px;
}

.operation-map-page[b-he9rat35ab]  .operation-map-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.operation-map-page[b-he9rat35ab]  .operation-map-table .mud-table-head {
    background: #eef6f2;
}

.operation-map-page[b-he9rat35ab]  .operation-map-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-he9rat35ab] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-he9rat35ab] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-he9rat35ab],
.mini-photo-empty[b-he9rat35ab] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-he9rat35ab] {
    cursor: zoom-in;
}

.mini-photo-button img[b-he9rat35ab] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-he9rat35ab] {
    object-fit: cover;
}

.mini-photo-button small[b-he9rat35ab] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-he9rat35ab] {
    color: #9c7b38;
}

.applicant-cell[b-he9rat35ab] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-he9rat35ab] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-he9rat35ab],
.applicant-cell small[b-he9rat35ab] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-he9rat35ab] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-he9rat35ab] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-he9rat35ab] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-he9rat35ab],
.channel-chip[b-he9rat35ab],
.priority-chip[b-he9rat35ab],
.status-chip[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-he9rat35ab],
.type-chip.construction[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-he9rat35ab],
.type-chip.food_license[b-he9rat35ab],
.type-chip.tax[b-he9rat35ab] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-he9rat35ab],
.type-chip.environment[b-he9rat35ab] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-he9rat35ab],
.date-cell[b-he9rat35ab] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-he9rat35ab],
.date-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-he9rat35ab],
.date-cell small[b-he9rat35ab] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-he9rat35ab] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-he9rat35ab] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-he9rat35ab] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-he9rat35ab] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-he9rat35ab] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-he9rat35ab] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-he9rat35ab] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.operation-map-page[b-he9rat35ab]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.operation-map-page[b-he9rat35ab]  .row-action.view {
    color: #2d79a2;
}

.operation-map-page[b-he9rat35ab]  .row-action.edit {
    color: var(--theme-primary);
}

.operation-map-page[b-he9rat35ab]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.operation-map-page[b-he9rat35ab]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-he9rat35ab] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-he9rat35ab] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-he9rat35ab] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-he9rat35ab] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-he9rat35ab] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.operation-map-form-modal[b-he9rat35ab],
.operation-detail-modal[b-he9rat35ab],
.delete-modal[b-he9rat35ab] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-he9rat35ab .22s ease-out;
}

@keyframes modalAppear-b-he9rat35ab {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.operation-map-form-modal[b-he9rat35ab] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-he9rat35ab] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-he9rat35ab] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-he9rat35ab] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-he9rat35ab] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-he9rat35ab] {
    margin-top: 24px;
}

.form-section-title > span[b-he9rat35ab] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-he9rat35ab] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-he9rat35ab] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-he9rat35ab] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-he9rat35ab] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-he9rat35ab] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-he9rat35ab] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-he9rat35ab] {
    min-height: 310px;
}

.photo-preview img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-he9rat35ab] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-he9rat35ab] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-he9rat35ab] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-he9rat35ab],
.remove-photo-button[b-he9rat35ab] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-he9rat35ab] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-he9rat35ab] {
    display: none;
}

.remove-photo-button[b-he9rat35ab] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.operation-map-page[b-he9rat35ab]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.operation-map-page[b-he9rat35ab]  .cancel-button,
.operation-map-page[b-he9rat35ab]  .save-button,
.operation-map-page[b-he9rat35ab]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.operation-map-page[b-he9rat35ab]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.operation-map-page[b-he9rat35ab]  .save-button {
    min-width: 170px;
}

.operation-detail-modal[b-he9rat35ab] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-he9rat35ab] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-he9rat35ab] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-he9rat35ab] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-he9rat35ab] {
    font-size: 5rem;
}

.view-cover-overlay[b-he9rat35ab] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-he9rat35ab] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-he9rat35ab] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-he9rat35ab] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-he9rat35ab] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-he9rat35ab] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-he9rat35ab] {
    padding: 22px;
}

.view-toolbar[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-he9rat35ab] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-he9rat35ab],
.view-info-grid span[b-he9rat35ab],
.view-description small[b-he9rat35ab],
.attachment-heading small[b-he9rat35ab],
.view-note small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-he9rat35ab] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-he9rat35ab] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-he9rat35ab] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-he9rat35ab] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-he9rat35ab] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-he9rat35ab] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-he9rat35ab] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-he9rat35ab] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-he9rat35ab] {
    background: #f3efe5;
}

.attachment-card img[b-he9rat35ab] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-he9rat35ab] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-he9rat35ab] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-he9rat35ab] {
    font-size: 2.3rem;
}

.view-note[b-he9rat35ab] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-he9rat35ab] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-he9rat35ab] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-he9rat35ab] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-he9rat35ab] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-he9rat35ab] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-he9rat35ab] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-he9rat35ab] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-he9rat35ab] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-he9rat35ab] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-he9rat35ab] {
    color: #963b36;
}

.delete-warning[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.operation-map-page[b-he9rat35ab]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .operation-map-hero[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-he9rat35ab] {
        max-width: 570px;
    }

    .list-toolbar[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-he9rat35ab] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .operation-map-page[b-he9rat35ab] {
        padding: 15px 12px 30px;
    }

    .operation-map-hero[b-he9rat35ab] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-he9rat35ab] {
        font-size: 2.3rem;
    }

    .hero-meta[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-he9rat35ab] {
        width: 100%;
    }

    .filter-heading[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }

    .operation-map-page[b-he9rat35ab]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-he9rat35ab] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-he9rat35ab],
    .attachment-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-he9rat35ab],
    .view-info-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-he9rat35ab] {
        align-items: end;
        padding: 0;
    }

    .operation-map-form-modal[b-he9rat35ab],
    .operation-detail-modal[b-he9rat35ab] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-he9rat35ab] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-he9rat35ab],
    .operation-list-panel[b-he9rat35ab] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-he9rat35ab] {
        align-items: flex-start;
    }

    .modal-icon[b-he9rat35ab] {
        display: none;
    }

    .modal-footer[b-he9rat35ab] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .operation-map-page[b-he9rat35ab]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-he9rat35ab] {
        padding: 0;
    }

    .image-preview-modal[b-he9rat35ab] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-he9rat35ab],
    .operation-map-form-modal[b-he9rat35ab],
    .operation-detail-modal[b-he9rat35ab],
    .delete-modal[b-he9rat35ab] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-he9rat35ab] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-he9rat35ab],
.status-overview-card.selected[b-he9rat35ab] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-he9rat35ab] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-he9rat35ab] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-he9rat35ab] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-he9rat35ab] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-he9rat35ab] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-he9rat35ab] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-he9rat35ab] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-he9rat35ab] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-he9rat35ab] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-he9rat35ab] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-he9rat35ab],
.complainant-cell small[b-he9rat35ab] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-he9rat35ab] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-he9rat35ab] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-he9rat35ab] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-he9rat35ab] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-he9rat35ab] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-he9rat35ab] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-he9rat35ab] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-he9rat35ab] {
    min-width: 116px;
}

.privacy-chip[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-he9rat35ab] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-he9rat35ab] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-he9rat35ab],
.status-chip.cancelled[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-he9rat35ab] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-he9rat35ab] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-he9rat35ab] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-he9rat35ab] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-he9rat35ab] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-he9rat35ab] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-he9rat35ab] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-he9rat35ab] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-he9rat35ab],
.evidence-preview[b-he9rat35ab] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.operation-detail-modal[b-he9rat35ab] {
    width: min(100%, 920px);
}

.desired-resolution[b-he9rat35ab],
.screening-panel[b-he9rat35ab],
.attachment-panel[b-he9rat35ab] {
    margin-top: 15px;
}

.desired-resolution[b-he9rat35ab] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-he9rat35ab],
.screening-panel small[b-he9rat35ab],
.section-heading small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-he9rat35ab],
.screening-panel p[b-he9rat35ab] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-he9rat35ab] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-he9rat35ab] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-he9rat35ab] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-he9rat35ab] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-he9rat35ab] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-he9rat35ab] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-he9rat35ab] {
    background: #f3efe5;
}

.attachment-card img[b-he9rat35ab] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-he9rat35ab] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-he9rat35ab] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-he9rat35ab] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-he9rat35ab] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-he9rat35ab],
    .screening-panel[b-he9rat35ab],
    .attachment-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-he9rat35ab] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-he9rat35ab] {
    background: #aa453e;
}

.summary-card.overdue[b-he9rat35ab],
.summary-card.urgent[b-he9rat35ab] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-he9rat35ab] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-he9rat35ab] {
    min-width: 150px;
}

.progress-heading[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-he9rat35ab] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-he9rat35ab],
.latest-cell[b-he9rat35ab] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-he9rat35ab],
.latest-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-he9rat35ab],
.latest-cell small[b-he9rat35ab] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-he9rat35ab],
.due-cell.overdue small[b-he9rat35ab] {
    color: #b54842;
}

.overdue-chip[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-he9rat35ab] {
    margin-top: 8px;
}

.form-progress-preview[b-he9rat35ab] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-he9rat35ab] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-he9rat35ab],
.history-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-he9rat35ab],
.section-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-he9rat35ab],
.section-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-he9rat35ab],
.section-heading h3[b-he9rat35ab] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-he9rat35ab]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-he9rat35ab] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-he9rat35ab]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-he9rat35ab] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-he9rat35ab] {
    padding-bottom: 0;
}

.timeline-marker[b-he9rat35ab] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-he9rat35ab] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-he9rat35ab] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-he9rat35ab] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-he9rat35ab] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-he9rat35ab] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-he9rat35ab],
.timeline-item.cancelled .timeline-marker[b-he9rat35ab] {
    background: #aa453e;
}

.timeline-content[b-he9rat35ab] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-he9rat35ab] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-he9rat35ab] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-he9rat35ab] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-he9rat35ab] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-he9rat35ab] {
    color: #2d78a4;
}

.summary-card.progress[b-he9rat35ab] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-he9rat35ab] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-he9rat35ab] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-he9rat35ab] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-he9rat35ab] {
    background: #aa453e;
}

.tracking-number-cell[b-he9rat35ab] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-he9rat35ab] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-he9rat35ab],
.assigned-by-cell[b-he9rat35ab],
.latest-cell[b-he9rat35ab] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-he9rat35ab],
.assigned-by-cell strong[b-he9rat35ab],
.latest-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-he9rat35ab],
.assigned-by-cell small[b-he9rat35ab],
.latest-cell small[b-he9rat35ab] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-he9rat35ab] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-he9rat35ab] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-he9rat35ab],
.status-chip.cancelled[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-he9rat35ab] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-he9rat35ab] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.operation-detail-modal[b-he9rat35ab] {
    width: min(100%, 940px);
}

.tracking-banner[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-he9rat35ab] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-he9rat35ab],
.banner-officer[b-he9rat35ab],
.banner-due[b-he9rat35ab],
.banner-progress[b-he9rat35ab] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-he9rat35ab] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-he9rat35ab] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-he9rat35ab],
.detail-note-grid[b-he9rat35ab],
.history-panel[b-he9rat35ab],
.attachment-panel[b-he9rat35ab] {
    margin-top: 15px;
}

.assignment-instruction[b-he9rat35ab] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-he9rat35ab],
.detail-note-grid small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-he9rat35ab],
.detail-note-grid p[b-he9rat35ab] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-he9rat35ab] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-he9rat35ab] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-he9rat35ab] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-he9rat35ab]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-he9rat35ab],
.timeline-item.cancelled .timeline-marker[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-he9rat35ab],
.evidence-preview[b-he9rat35ab] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-he9rat35ab],
    .detail-note-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-he9rat35ab] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-he9rat35ab] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-he9rat35ab] {
    width: 100%;
}

.available-count-card[b-he9rat35ab] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-he9rat35ab] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-he9rat35ab] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-he9rat35ab] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-he9rat35ab]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-he9rat35ab]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-he9rat35ab] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-he9rat35ab] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-he9rat35ab] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-he9rat35ab] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-he9rat35ab] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-he9rat35ab] {
    font-size: 1.55rem;
}

.picker-photo[b-he9rat35ab] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-he9rat35ab] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-he9rat35ab] {
    font-size: 2rem;
}

.picker-content[b-he9rat35ab] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-he9rat35ab] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-he9rat35ab] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-he9rat35ab] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-he9rat35ab] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-he9rat35ab] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-he9rat35ab] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-he9rat35ab] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-he9rat35ab] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-he9rat35ab] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-he9rat35ab] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-he9rat35ab] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-he9rat35ab] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-he9rat35ab] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-he9rat35ab] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-he9rat35ab] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-he9rat35ab] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-he9rat35ab] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-he9rat35ab] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-he9rat35ab],
    .selected-complaint-panel[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-he9rat35ab] {
        min-height: 220px;
    }

    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-he9rat35ab] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-he9rat35ab] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-he9rat35ab] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-he9rat35ab] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-he9rat35ab] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-he9rat35ab] {
    color: #b47b22;
}

.summary-card.overdue[b-he9rat35ab] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-he9rat35ab] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-he9rat35ab] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-he9rat35ab] {
    background: #75837d;
}

.status-overview-card.completed > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-he9rat35ab] {
    background: #bc4d45;
}

.tracking-number-cell[b-he9rat35ab] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-he9rat35ab] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-he9rat35ab],
.progress-cell[b-he9rat35ab],
.followup-cell[b-he9rat35ab],
.latest-cell[b-he9rat35ab],
.department-cell[b-he9rat35ab] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-he9rat35ab],
.followup-cell strong[b-he9rat35ab],
.latest-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-he9rat35ab],
.followup-cell small[b-he9rat35ab],
.latest-cell small[b-he9rat35ab] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-he9rat35ab] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-he9rat35ab] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-he9rat35ab] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-he9rat35ab] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-he9rat35ab] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-he9rat35ab] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-he9rat35ab] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-he9rat35ab] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-he9rat35ab] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-he9rat35ab] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-he9rat35ab] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-he9rat35ab] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-he9rat35ab] {
    width: 100%;
}

.source-picker-list[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-he9rat35ab] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-he9rat35ab] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-he9rat35ab] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-he9rat35ab] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-he9rat35ab] {
    display: block;
}

.picker-photo[b-he9rat35ab] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-he9rat35ab] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-he9rat35ab] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-he9rat35ab] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-he9rat35ab] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-he9rat35ab] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-he9rat35ab],
.picker-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-he9rat35ab] {
    gap: 8px 12px;
}

.picker-meta span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-he9rat35ab] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-he9rat35ab] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-he9rat35ab] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-he9rat35ab] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-he9rat35ab] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-he9rat35ab] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-he9rat35ab] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-he9rat35ab] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-he9rat35ab] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-he9rat35ab] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-he9rat35ab] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-he9rat35ab] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-he9rat35ab] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-he9rat35ab] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-he9rat35ab] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-he9rat35ab],
.attachment-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-he9rat35ab] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-he9rat35ab]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-he9rat35ab] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-he9rat35ab] {
    background: #e7f2f9;
}

.attachment-card.after[b-he9rat35ab] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-he9rat35ab],
.after-preview[b-he9rat35ab] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-he9rat35ab],
    .selected-source-panel[b-he9rat35ab],
    .tracking-banner[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-he9rat35ab] {
        min-height: 220px;
    }

    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-he9rat35ab] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-he9rat35ab] {
    color: var(--theme-primary);
}

.summary-card.sla[b-he9rat35ab] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-he9rat35ab] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-he9rat35ab] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-he9rat35ab] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-he9rat35ab] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.assignment-number-cell[b-he9rat35ab] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.assignment-number-cell > span[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-he9rat35ab] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-he9rat35ab] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-he9rat35ab] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-he9rat35ab] {
    font-size: .36rem;
}

.resolution-chip[b-he9rat35ab],
.publication-chip[b-he9rat35ab],
.sla-chip[b-he9rat35ab],
.source-sla-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-he9rat35ab] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-he9rat35ab],
.source-sla-chip.within[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-he9rat35ab],
.source-sla-chip.over[b-he9rat35ab] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-he9rat35ab],
.closed-cell[b-he9rat35ab] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-he9rat35ab],
.closed-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-he9rat35ab],
.closed-cell small[b-he9rat35ab] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-he9rat35ab] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-he9rat35ab] {
    color: #aa453e;
}

.score-cell[b-he9rat35ab] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-he9rat35ab] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-he9rat35ab] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-he9rat35ab] {
    color: #d0a43f;
}

.score-cell small[b-he9rat35ab] {
    color: #8c9893;
    font-size: .47rem;
}

.operation-detail-banner[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.operation-detail-banner > div[b-he9rat35ab] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.operation-detail-banner .banner-department[b-he9rat35ab] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.operation-detail-banner small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .48rem;
}

.operation-detail-banner strong[b-he9rat35ab] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-he9rat35ab] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-he9rat35ab] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-he9rat35ab] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-he9rat35ab] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-he9rat35ab] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-he9rat35ab] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-he9rat35ab] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-he9rat35ab] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-he9rat35ab] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-he9rat35ab] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-he9rat35ab] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-he9rat35ab] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-he9rat35ab] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-he9rat35ab] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-he9rat35ab] {
    display: block;
}

@media (max-width: 1200px) {
    .operation-detail-banner[b-he9rat35ab],
    .three-columns[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .operation-detail-banner[b-he9rat35ab],
    .three-columns[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-he9rat35ab] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-he9rat35ab] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-he9rat35ab] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-he9rat35ab] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-he9rat35ab] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-he9rat35ab] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.operation-map-page[b-he9rat35ab]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-he9rat35ab] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-he9rat35ab] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-he9rat35ab] { background: #6e7d77; }
.status-overview-card.assigned > span[b-he9rat35ab] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-he9rat35ab] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-he9rat35ab] { background: #ad721a; }
.status-overview-card.completed > span[b-he9rat35ab] { background: var(--theme-primary); }

.assignment-number-cell[b-he9rat35ab] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.assignment-number-cell > span[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-he9rat35ab] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-he9rat35ab] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-he9rat35ab] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-he9rat35ab] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-he9rat35ab] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-he9rat35ab] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-he9rat35ab],
.schedule-cell[b-he9rat35ab],
.budget-cell[b-he9rat35ab] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-he9rat35ab],
.schedule-cell strong[b-he9rat35ab],
.budget-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-he9rat35ab],
.schedule-cell small[b-he9rat35ab],
.budget-cell small[b-he9rat35ab] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-he9rat35ab],
.schedule-cell.overdue small[b-he9rat35ab] {
    color: #b3463d;
}

.budget-cell strong[b-he9rat35ab] {
    color: #9c7932;
}

.progress-cell[b-he9rat35ab] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-he9rat35ab] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-he9rat35ab] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-he9rat35ab] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-he9rat35ab] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-he9rat35ab] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-he9rat35ab] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-he9rat35ab] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-he9rat35ab] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-he9rat35ab] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-he9rat35ab] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-he9rat35ab] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-he9rat35ab] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-he9rat35ab] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-he9rat35ab] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-he9rat35ab] {
    display: block;
}

.picker-photo[b-he9rat35ab] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-he9rat35ab] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-he9rat35ab] {
    min-width: 0;
}

.picker-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-he9rat35ab] {
    min-width: 0;
}

.picker-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-he9rat35ab] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-he9rat35ab] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-he9rat35ab] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-he9rat35ab] {
    font-size: .47rem;
}

.selected-source-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-he9rat35ab] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-he9rat35ab] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-he9rat35ab] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-he9rat35ab] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-he9rat35ab] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-he9rat35ab] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-he9rat35ab] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-he9rat35ab] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.operation-detail-banner[b-he9rat35ab] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.operation-detail-banner > div[b-he9rat35ab] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.operation-detail-banner .banner-technician[b-he9rat35ab] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.operation-detail-banner small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .48rem;
}

.operation-detail-banner strong[b-he9rat35ab] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-he9rat35ab] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-he9rat35ab] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-he9rat35ab] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-he9rat35ab] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-he9rat35ab] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-he9rat35ab] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-he9rat35ab] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-he9rat35ab] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-he9rat35ab] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-he9rat35ab] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-he9rat35ab],
.history-meta b[b-he9rat35ab] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-he9rat35ab] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-he9rat35ab] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-he9rat35ab] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-he9rat35ab] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-he9rat35ab] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .operation-detail-banner[b-he9rat35ab],
    .four-columns[b-he9rat35ab] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-he9rat35ab] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .operation-detail-banner[b-he9rat35ab],
    .detail-note-grid[b-he9rat35ab],
    .four-columns[b-he9rat35ab] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-he9rat35ab] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-he9rat35ab] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-he9rat35ab],
    .source-picker-card[b-he9rat35ab],
    .selected-info-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-he9rat35ab] {
        height: 180px;
    }
}


/* =========================================================
   TECHNICIAN ASSIGNED WORK โ€” EDIT ONLY
   ========================================================= */
.summary-card.total[b-he9rat35ab] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.progress[b-he9rat35ab] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-he9rat35ab] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.completed[b-he9rat35ab] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.operation-map-page[b-he9rat35ab]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.google-map-mode-card[b-he9rat35ab] {
    display: flex;
    min-height: 48px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 112, 84, .97),
            rgba(4, 61, 47, .99));

    box-shadow: 0 10px 25px rgba(4, 61, 47, .18);
}

.google-map-mode-card > span[b-he9rat35ab] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #5e4314;
    background: #f0d89f;
}

.google-map-mode-card > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.google-map-mode-card strong[b-he9rat35ab] {
    color: #fff;
    font-size: .56rem;
    letter-spacing: .08em;
}

.google-map-mode-card small[b-he9rat35ab] {
    margin-top: 1px;
    color: rgba(255, 255, 255, .72);
    font-size: .46rem;
}

.status-overview-card.assigned > span[b-he9rat35ab] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.status-overview-card.in-progress > span[b-he9rat35ab] {
    background: #7658a7;
}

.status-overview-card.waiting-part > span[b-he9rat35ab] {
    background: #ad721a;
}

.status-overview-card.completed > span[b-he9rat35ab] {
    background: var(--theme-primary);
}

.assignment-number-cell[b-he9rat35ab] {
    display: flex;
    min-width: 152px;
    flex-direction: column;
}

.assignment-number-cell > span[b-he9rat35ab] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-he9rat35ab] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.assignment-number-cell em[b-he9rat35ab] {
    margin-top: 2px;

    color: #87958f;
    font-size: .43rem;
    font-style: normal;
}

.cost-cell[b-he9rat35ab] {
    display: flex;
    min-width: 112px;
    flex-direction: column;
}

.cost-cell strong[b-he9rat35ab] {
    color: #9c7932;
    font-size: .62rem;
}

.cost-cell small[b-he9rat35ab] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.operation-map-page[b-he9rat35ab]  .technician-edit-button {
    min-width: 86px;

    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    box-shadow:
        0 8px 18px rgba(5, 82, 62, .18);

    font-family: 'Kanit', sans-serif !important;
    font-size: .48rem !important;
    font-weight: 650 !important;
}

.operation-map-page[b-he9rat35ab]  .technician-edit-button:hover {
    transform: translateY(-1px);
    box-shadow:
        0 11px 24px rgba(5, 82, 62, .24);
}

.locked-assignment-panel[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 15px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .12),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-cover[b-he9rat35ab] {
    display: grid;
    min-height: 205px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #8fa199;
    background: #e9f0ed;
}

.locked-cover img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-content[b-he9rat35ab] {
    min-width: 0;
}

.locked-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-heading h3[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .86rem;
}

.locked-heading p[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.locked-badges[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-he9rat35ab] {
    margin: 10px 0 0;

    color: #61756d;
    font-size: .58rem;
    line-height: 1.75;
}

.locked-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.locked-info-grid > div[b-he9rat35ab] {
    min-height: 60px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.locked-info-grid span[b-he9rat35ab] {
    display: block;

    color: var(--theme-muted);
    font-size: .42rem;
}

.locked-info-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.45;
}

.instruction-readonly-panel[b-he9rat35ab] {
    margin-bottom: 16px;
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .17);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .13),
            transparent 20rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-readonly-panel > div:first-child > small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.instruction-readonly-panel h3[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .77rem;
}

.instruction-readonly-panel > div:first-child > p[b-he9rat35ab] {
    margin: 8px 0 0;

    color: #5f746c;
    font-size: .57rem;
    line-height: 1.75;
}

.instruction-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 12px;
}

.instruction-grid article[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 35px minmax(0, 1fr);

    gap: 8px;
    min-height: 92px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: rgba(255, 255, 255, .86);
}

.instruction-grid article > span[b-he9rat35ab] {
    display: grid;
    width: 35px;
    height: 35px;

    place-items: center;
    border-radius: 10px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.instruction-grid small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .43rem;
    font-weight: 700;
}

.instruction-grid p[b-he9rat35ab] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.6;
}

.progress-preview-card[b-he9rat35ab] {
    display: flex;
    min-height: 56px;

    justify-content: center;
    flex-direction: column;
    gap: 7px;

    padding: 7px 11px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.progress-preview-card > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.progress-preview-card small[b-he9rat35ab] {
    color: #87958f;
    font-size: .45rem;
}

.progress-preview-card strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .72rem;
}

.photo-source-strip[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 12px;
}

.photo-source-strip > button[b-he9rat35ab] {
    position: relative;

    min-height: 145px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: #edf3f0;
    cursor: pointer;
}

.photo-source-strip img[b-he9rat35ab] {
    width: 100%;
    height: 145px;
    object-fit: cover;
}

.photo-source-strip button > span[b-he9rat35ab] {
    position: absolute;
    right: 8px;
    bottom: 8px;

    padding: 5px 8px;

    border-radius: 8px;

    color: #fff;
    background: rgba(3, 50, 39, .78);

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
}

.source-photo-empty[b-he9rat35ab] {
    display: flex;
    grid-column: 1 / -1;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #8b9b94;
    background: #f6f9f7;
}

.source-photo-empty span[b-he9rat35ab] {
    font-size: .48rem;
}

.operation-detail-banner[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.2fr)
        minmax(160px, .8fr)
        minmax(145px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.operation-detail-banner > div[b-he9rat35ab] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.operation-detail-banner .banner-technician[b-he9rat35ab] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));

    box-shadow:
        0 9px 21px rgba(4, 61, 47, .18);
}

.operation-detail-banner small[b-he9rat35ab] {
    color: #8b9993;
    font-size: .48rem;
}

.operation-detail-banner strong[b-he9rat35ab] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.location-panel[b-he9rat35ab] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 13px;
    padding: 15px;

    border: 1px solid rgba(45, 120, 164, .15);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 17rem),
        #f5fafc;
}

.location-panel small[b-he9rat35ab] {
    color: #2d78a4;
    font-size: .47rem;
    font-weight: 700;
}

.location-panel h3[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.location-panel p[b-he9rat35ab] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .53rem;
    line-height: 1.6;
}

.location-panel > span[b-he9rat35ab] {
    display: grid;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;

    place-items: center;
    border-radius: 17px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

@media (max-width: 1100px) {
    .locked-assignment-panel[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .locked-cover[b-he9rat35ab] {
        max-height: 300px;
    }

    .instruction-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .operation-detail-banner[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .locked-info-grid[b-he9rat35ab] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .photo-source-strip[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .operation-detail-banner[b-he9rat35ab],
    .locked-info-grid[b-he9rat35ab] {
        grid-template-columns: minmax(0, 1fr);
    }

    .locked-heading[b-he9rat35ab] {
        flex-direction: column;
    }

    .locked-badges[b-he9rat35ab] {
        justify-content: flex-start;
    }

    .google-map-mode-card[b-he9rat35ab] {
        width: 100%;
    }
}


/* =========================================================
   OPERATION WORK MAP PREMIUM
   ========================================================= */

.summary-card.total[b-he9rat35ab] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.progress[b-he9rat35ab] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.urgent[b-he9rat35ab] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.photo[b-he9rat35ab] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.operation-map-page[b-he9rat35ab]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.google-map-mode-card[b-he9rat35ab] {
    display: flex;
    min-height: 48px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 112, 84, .97),
            rgba(4, 61, 47, .99));

    box-shadow:
        0 10px 25px rgba(4, 61, 47, .18);
}

.google-map-mode-card > span[b-he9rat35ab] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #5e4314;
    background: #f0d89f;
}

.google-map-mode-card > div[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.google-map-mode-card strong[b-he9rat35ab] {
    color: #fff;
    font-size: .56rem;
    letter-spacing: .08em;
}

.google-map-mode-card small[b-he9rat35ab] {
    margin-top: 1px;

    color: rgba(255, 255, 255, .72);
    font-size: .46rem;
}

.map-workspace[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.75fr)
        minmax(300px, .75fr);

    gap: 15px;
    margin-top: 16px;
}

.map-panel[b-he9rat35ab],
.selected-work-panel[b-he9rat35ab],
.operation-list-panel[b-he9rat35ab] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 18px 44px rgba(6, 68, 51, .08);
}

.map-panel-header[b-he9rat35ab] {
    display: flex;

    align-items: center;
    justify-content: space-between;
    gap: 14px;

    padding: 15px 16px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .10),
            transparent 22rem),
        #fff;
}

.map-panel-header > div:first-child > span[b-he9rat35ab] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.map-panel-header h2[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .86rem;
}

.map-panel-header p[b-he9rat35ab] {
    margin: 4px 0 0;

    color: #7a8983;
    font-size: .51rem;
}

.map-panel-actions[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.map-open-selected[b-he9rat35ab] {
    display: inline-flex;
    min-height: 42px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d);

    box-shadow:
        0 9px 20px rgba(5, 82, 62, .18);

    font-family: 'Kanit', sans-serif;
    font-size: .48rem;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}

.map-open-selected:hover[b-he9rat35ab] {
    color: #fff;

    transform: translateY(-1px);

    box-shadow:
        0 12px 25px rgba(5, 82, 62, .24);
}

.premium-map-canvas[b-he9rat35ab] {
    position: relative;

    min-height: 610px;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 20% 18%,
            rgba(89, 148, 104, .15),
            transparent 24rem),
        radial-gradient(
            circle at 82% 80%,
            rgba(62, 128, 161, .12),
            transparent 22rem),
        linear-gradient(
            145deg,
            #eef5f0,
            #e9f1ed 58%,
            #f6f8f6);

    isolation: isolate;
}

.map-grid-pattern[b-he9rat35ab] {
    position: absolute;
    inset: 0;

    opacity: .30;

    background-image:
        linear-gradient(
            rgba(72, 112, 94, .08) 1px,
            transparent 1px),
        linear-gradient(
            90deg,
            rgba(72, 112, 94, .08) 1px,
            transparent 1px);

    background-size: 42px 42px;
}

.map-waterway[b-he9rat35ab] {
    position: absolute;
    z-index: 1;

    top: -16%;
    left: 56%;

    width: 16%;
    height: 132%;

    border-radius: 48%;

    background:
        linear-gradient(
            90deg,
            rgba(85, 164, 203, .18),
            rgba(71, 142, 180, .30),
            rgba(85, 164, 203, .18));

    transform: rotate(12deg);

    box-shadow:
        inset 0 0 0 2px rgba(73, 141, 177, .12);
}

.map-green-zone[b-he9rat35ab] {
    position: absolute;
    z-index: 1;

    border: 1px solid rgba(58, 126, 73, .13);
    border-radius: 44%;

    background:
        radial-gradient(
            circle,
            rgba(88, 153, 91, .16),
            rgba(88, 153, 91, .06));

    filter: blur(.1px);
}

.map-green-zone.zone-a[b-he9rat35ab] {
    top: 8%;
    left: 7%;

    width: 28%;
    height: 23%;

    transform: rotate(-9deg);
}

.map-green-zone.zone-b[b-he9rat35ab] {
    right: 8%;
    bottom: 8%;

    width: 30%;
    height: 20%;

    transform: rotate(11deg);
}

.map-road[b-he9rat35ab] {
    position: absolute;
    z-index: 2;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #fff,
            #f3f4ef 50%,
            #fff);

    box-shadow:
        0 0 0 1px rgba(113, 124, 117, .11),
        0 3px 10px rgba(67, 84, 75, .08);
}

.map-road[b-he9rat35ab]::after {
    content: "";

    position: absolute;
    inset: 50% 4% auto;

    height: 1px;

    border-top: 1px dashed rgba(117, 122, 113, .28);

    transform: translateY(-50%);
}

.map-road.road-a[b-he9rat35ab] {
    top: 20%;
    left: -8%;

    width: 72%;
    height: 18px;

    transform: rotate(7deg);
}

.map-road.road-b[b-he9rat35ab] {
    top: 52%;
    left: 11%;

    width: 95%;
    height: 21px;

    transform: rotate(-8deg);
}

.map-road.road-c[b-he9rat35ab] {
    top: 4%;
    left: 38%;

    width: 20px;
    height: 92%;

    transform: rotate(11deg);
}

.map-road.road-c[b-he9rat35ab]::after,
.map-road.road-d[b-he9rat35ab]::after,
.map-road.road-e[b-he9rat35ab]::after {
    inset: 4% auto 4% 50%;

    width: 1px;
    height: auto;

    border-top: 0;
    border-left: 1px dashed rgba(117, 122, 113, .28);
}

.map-road.road-d[b-he9rat35ab] {
    top: 4%;
    right: 18%;

    width: 16px;
    height: 72%;

    transform: rotate(-14deg);
}

.map-road.road-e[b-he9rat35ab] {
    top: 33%;
    left: 2%;

    width: 15px;
    height: 64%;

    transform: rotate(-24deg);
}

.map-label[b-he9rat35ab] {
    position: absolute;
    z-index: 3;

    padding: 4px 8px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 8px;

    color: rgba(48, 76, 65, .64);
    background: rgba(255, 255, 255, .76);

    font-size: .43rem;
    font-weight: 600;

    backdrop-filter: blur(5px);
}

.map-label.label-a[b-he9rat35ab] {
    top: 14%;
    left: 16%;
}

.map-label.label-b[b-he9rat35ab] {
    top: 22%;
    right: 10%;
}

.map-label.label-c[b-he9rat35ab] {
    right: 20%;
    bottom: 28%;
}

.map-label.label-d[b-he9rat35ab] {
    top: 9%;
    left: 47%;
}

.map-label.label-e[b-he9rat35ab] {
    left: 12%;
    bottom: 15%;
}

.map-compass[b-he9rat35ab] {
    position: absolute;
    z-index: 7;

    top: 16px;
    right: 16px;

    display: flex;
    width: 48px;
    height: 62px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 14px;

    color: var(--theme-primary);
    background: rgba(255, 255, 255, .88);

    box-shadow:
        0 9px 22px rgba(5, 62, 46, .10);

    backdrop-filter: blur(8px);
}

.map-compass span[b-he9rat35ab] {
    font-size: .38rem;
    font-weight: 700;
}

.map-compass .mud-icon-root[b-he9rat35ab] {
    font-size: 1.35rem;
}

.map-scale[b-he9rat35ab] {
    position: absolute;
    z-index: 7;

    right: 16px;
    bottom: 18px;

    display: flex;
    align-items: center;
    gap: 6px;

    padding: 6px 8px;

    border-radius: 8px;

    color: #586c63;
    background: rgba(255, 255, 255, .84);

    font-size: .38rem;
    font-weight: 600;

    backdrop-filter: blur(8px);
}

.map-scale i[b-he9rat35ab] {
    display: block;
    width: 48px;
    height: 7px;

    border-right: 2px solid #50675d;
    border-bottom: 2px solid #50675d;
    border-left: 2px solid #50675d;
}

.operation-map-marker[b-he9rat35ab] {
    position: absolute;
    z-index: 8;

    width: 42px;
    height: 42px;

    color: #fff;
    text-decoration: none;

    transform: translate(-50%, -100%);

    transition:
        transform .18s ease,
        filter .18s ease;
}

.operation-map-marker:hover[b-he9rat35ab] {
    z-index: 20;

    color: #fff;

    transform:
        translate(-50%, -100%)
        scale(1.13);

    filter:
        drop-shadow(
            0 11px 15px rgba(3, 49, 38, .25));
}

.marker-pin[b-he9rat35ab] {
    position: absolute;
    inset: 0;

    display: grid;

    place-items: center;
    border: 3px solid #fff;
    border-radius: 50% 50% 50% 8px;

    background: #2d78a4;

    box-shadow:
        0 9px 20px rgba(4, 65, 50, .23);

    transform: rotate(-45deg);
}

.marker-pin .mud-icon-root[b-he9rat35ab] {
    transform: rotate(45deg);
}

.operation-map-marker.assigned .marker-pin[b-he9rat35ab] {
    background: #2d78a4;
}

.operation-map-marker.accepted .marker-pin[b-he9rat35ab] {
    background: var(--theme-primary);
}

.operation-map-marker.in-progress .marker-pin[b-he9rat35ab] {
    background: #7658a7;
}

.operation-map-marker.waiting-part .marker-pin[b-he9rat35ab],
.operation-map-marker.waiting-approval .marker-pin[b-he9rat35ab] {
    background: #a96f19;
}

.operation-map-marker.completed .marker-pin[b-he9rat35ab] {
    background: #3f8650;
}

.operation-map-marker.overdue .marker-pin[b-he9rat35ab] {
    background: #bd4f43;

    animation:
        marker-alert-b-he9rat35ab 1.5s ease-in-out infinite;
}

.marker-pulse[b-he9rat35ab] {
    position: absolute;
    z-index: -1;

    top: 18px;
    left: 18px;

    width: 18px;
    height: 18px;

    border: 2px solid rgba(45, 120, 164, .40);
    border-radius: 50%;

    animation:
        marker-pulse-b-he9rat35ab 2s ease-out infinite;
}

.operation-map-marker.overdue .marker-pulse[b-he9rat35ab] {
    border-color: rgba(189, 79, 67, .52);
}

.marker-number[b-he9rat35ab] {
    position: absolute;
    z-index: 2;

    top: -8px;
    right: -8px;

    display: grid;
    min-width: 20px;
    height: 20px;

    place-items: center;
    padding: 0 4px;

    border: 2px solid #fff;
    border-radius: 999px;

    color: #fff;
    background: var(--theme-dark);

    font-family: 'Kanit', sans-serif;
    font-size: .39rem;
    font-weight: 700;

    box-shadow:
        0 5px 12px rgba(4, 61, 47, .20);
}

.marker-tooltip[b-he9rat35ab] {
    position: absolute;

    bottom: 54px;
    left: 50%;

    display: none;
    width: 210px;

    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    background: rgba(255, 255, 255, .96);

    box-shadow:
        0 16px 34px rgba(4, 61, 47, .16);

    transform:
        translateX(-50%)
        rotate(0);

    backdrop-filter: blur(9px);
}

.operation-map-marker:hover .marker-tooltip[b-he9rat35ab] {
    display: flex;
    flex-direction: column;
}

.marker-tooltip small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .41rem;
    font-weight: 700;
}

.marker-tooltip strong[b-he9rat35ab] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .55rem;
    line-height: 1.45;
}

.marker-tooltip em[b-he9rat35ab] {
    margin-top: 5px;

    color: #6f8079;
    font-size: .43rem;
    font-style: normal;
}

.marker-tooltip b[b-he9rat35ab] {
    margin-top: 7px;

    color: var(--theme-primary);
    font-size: .42rem;
}

.map-empty-state[b-he9rat35ab] {
    position: absolute;
    z-index: 10;

    inset: 50% auto auto 50%;

    display: flex;
    width: min(340px, calc(100% - 40px));
    min-height: 160px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    padding: 18px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;

    color: #84958e;
    background: rgba(255, 255, 255, .92);

    box-shadow:
        0 18px 38px rgba(4, 61, 47, .13);

    transform: translate(-50%, -50%);
}

.map-empty-state strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.map-empty-state small[b-he9rat35ab] {
    font-size: .47rem;
    text-align: center;
}

.map-legend[b-he9rat35ab] {
    position: absolute;
    z-index: 7;

    left: 16px;
    bottom: 16px;

    display: flex;
    max-width: calc(100% - 170px);

    flex-wrap: wrap;
    align-items: center;
    gap: 7px 10px;

    padding: 9px 11px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    color: #5f736a;
    background: rgba(255, 255, 255, .88);

    box-shadow:
        0 9px 22px rgba(5, 62, 46, .08);

    font-size: .41rem;

    backdrop-filter: blur(8px);
}

.map-legend strong[b-he9rat35ab] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .45rem;
}

.legend-item[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.legend-item i[b-he9rat35ab] {
    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: #2d78a4;
}

.legend-item.accepted i[b-he9rat35ab] {
    background: var(--theme-primary);
}

.legend-item.in-progress i[b-he9rat35ab] {
    background: #7658a7;
}

.legend-item.waiting i[b-he9rat35ab] {
    background: #a96f19;
}

.legend-item.completed i[b-he9rat35ab] {
    background: #3f8650;
}

.map-footer-note[b-he9rat35ab] {
    display: flex;
    min-height: 42px;

    align-items: center;
    gap: 7px;

    padding: 8px 13px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: #6d7f77;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .46rem;
}

.selected-work-panel[b-he9rat35ab] {
    min-height: 610px;
}

.selected-empty[b-he9rat35ab] {
    display: flex;
    min-height: 610px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    padding: 25px;

    color: #899991;
    text-align: center;
}

.selected-empty > span[b-he9rat35ab] {
    display: grid;
    width: 72px;
    height: 72px;

    place-items: center;
    border-radius: 22px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));

    box-shadow:
        0 14px 30px rgba(4, 61, 47, .20);
}

.selected-empty h3[b-he9rat35ab] {
    margin: 5px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.selected-empty p[b-he9rat35ab] {
    max-width: 260px;
    margin: 0;

    font-size: .50rem;
    line-height: 1.7;
}

.selected-cover[b-he9rat35ab] {
    position: relative;

    height: 205px;
    overflow: hidden;

    background: #edf3f0;
}

.selected-cover img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-cover-empty[b-he9rat35ab] {
    display: grid;
    width: 100%;
    height: 100%;

    place-items: center;

    color: #93a39c;
}

.selected-cover-overlay[b-he9rat35ab] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 42%,
            rgba(3, 48, 37, .68));
}

.selected-status[b-he9rat35ab] {
    position: absolute;
    right: 10px;
    bottom: 10px;

    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(45, 120, 164, .88);

    font-size: .44rem;
    font-weight: 650;

    backdrop-filter: blur(8px);
}

.selected-status.accepted[b-he9rat35ab] {
    background: rgba(8, 112, 82, .88);
}

.selected-status.in-progress[b-he9rat35ab] {
    background: rgba(118, 88, 167, .90);
}

.selected-status.waiting-part[b-he9rat35ab],
.selected-status.waiting-approval[b-he9rat35ab] {
    background: rgba(169, 111, 25, .90);
}

.selected-status.completed[b-he9rat35ab] {
    background: rgba(63, 134, 80, .90);
}

.selected-content[b-he9rat35ab] {
    padding: 14px;
}

.selected-code-row[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.selected-code-row span[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .50rem;
    font-weight: 750;
}

.selected-code-row small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.selected-content h3[b-he9rat35ab] {
    margin: 8px 0 0;

    color: var(--theme-ink);
    font-size: .78rem;
    line-height: 1.45;
}

.selected-description[b-he9rat35ab] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;

    color: #687a73;
    font-size: .51rem;
    line-height: 1.65;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.selected-chip-row[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 9px;
}

.selected-progress[b-he9rat35ab] {
    margin-top: 12px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-progress > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 7px;
}

.selected-progress span[b-he9rat35ab] {
    color: #7e8e87;
    font-size: .45rem;
}

.selected-progress strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .68rem;
}

.selected-meta-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 7px;
    margin-top: 10px;
}

.selected-meta-grid > div[b-he9rat35ab] {
    min-height: 57px;
    padding: 8px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.selected-meta-grid span[b-he9rat35ab] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.selected-meta-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .50rem;
    line-height: 1.45;
}

.selected-address[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 37px minmax(0, 1fr);

    gap: 8px;
    margin-top: 10px;
    padding: 9px;

    border: 1px solid rgba(45, 120, 164, .12);
    border-radius: 11px;

    background: #f4f9fc;
}

.selected-address > span[b-he9rat35ab] {
    display: grid;
    width: 37px;
    height: 37px;

    place-items: center;
    border-radius: 11px;

    color: #fff;
    background: #2d78a4;
}

.selected-address strong[b-he9rat35ab] {
    display: block;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .51rem;
    line-height: 1.45;
}

.selected-address small[b-he9rat35ab],
.selected-address em[b-he9rat35ab] {
    display: block;
    margin-top: 3px;

    color: #7f8f88;
    font-size: .42rem;
    font-style: normal;
    line-height: 1.45;
}

.selected-photo-strip[b-he9rat35ab] {
    display: flex;
    min-height: 58px;

    gap: 6px;
    margin-top: 10px;
    overflow-x: auto;
}

.selected-photo-strip button[b-he9rat35ab] {
    flex: 0 0 70px;
    height: 58px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 9px;

    background: #edf3f0;
    cursor: pointer;
}

.selected-photo-strip img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-no-photo[b-he9rat35ab] {
    display: flex;
    min-height: 58px;
    width: 100%;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 9px;

    color: #8a9a93;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .44rem;
}

.selected-map-actions[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.open-map-button[b-he9rat35ab],
.direction-button[b-he9rat35ab] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border-radius: 10px;

    font-family: 'Kanit', sans-serif;
    font-size: .46rem;
    font-weight: 650;
    text-decoration: none;
}

.open-map-button[b-he9rat35ab] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d);

    box-shadow:
        0 8px 18px rgba(5, 82, 62, .17);
}

.open-map-button:hover[b-he9rat35ab] {
    color: #fff;
}

.direction-button[b-he9rat35ab] {
    border: 1px solid rgba(45, 120, 164, .22);

    color: #2d78a4;
    background: #edf6fb;
}

.direction-button:hover[b-he9rat35ab] {
    color: #245f82;
    background: #e1f0f8;
}

.operation-map-page[b-he9rat35ab]  .selected-detail-button {
    margin-top: 8px;

    border-color: rgba(7, 88, 67, .18) !important;
    border-radius: 10px !important;

    color: var(--theme-primary) !important;
    background: #f4faf7 !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.operation-list-panel[b-he9rat35ab] {
    margin-top: 16px;
}

.operation-card-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 12px;
    padding: 14px;
}

.operation-card[b-he9rat35ab] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 11px 27px rgba(5, 62, 46, .06);

    cursor: pointer;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.operation-card:hover[b-he9rat35ab] {
    transform: translateY(-3px);

    border-color: rgba(7, 112, 83, .23);

    box-shadow:
        0 17px 35px rgba(5, 62, 46, .11);
}

.operation-card.selected[b-he9rat35ab] {
    border: 2px solid var(--theme-primary);

    box-shadow:
        0 0 0 4px rgba(8, 112, 82, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.operation-card-cover[b-he9rat35ab] {
    position: relative;

    height: 155px;
    overflow: hidden;

    background: #edf3f0;
}

.operation-card-cover img[b-he9rat35ab] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.operation-card-cover-empty[b-he9rat35ab] {
    display: grid;
    width: 100%;
    height: 100%;

    place-items: center;

    color: #8fa199;

    background:
        radial-gradient(
            circle,
            rgba(8, 112, 82, .10),
            transparent 55%),
        #edf3f0;
}

.operation-card-status[b-he9rat35ab],
.operation-card-photo-count[b-he9rat35ab] {
    position: absolute;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 4px;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;

    color: #fff;

    font-size: .41rem;
    font-weight: 650;

    backdrop-filter: blur(7px);
}

.operation-card-status[b-he9rat35ab] {
    top: 8px;
    left: 8px;

    background: rgba(45, 120, 164, .88);
}

.operation-card-status.accepted[b-he9rat35ab] {
    background: rgba(8, 112, 82, .88);
}

.operation-card-status.in-progress[b-he9rat35ab] {
    background: rgba(118, 88, 167, .90);
}

.operation-card-status.waiting-part[b-he9rat35ab],
.operation-card-status.waiting-approval[b-he9rat35ab] {
    background: rgba(169, 111, 25, .90);
}

.operation-card-status.completed[b-he9rat35ab] {
    background: rgba(63, 134, 80, .90);
}

.operation-card-photo-count[b-he9rat35ab] {
    right: 8px;
    bottom: 8px;

    background: rgba(3, 48, 37, .76);
}

.operation-card-content[b-he9rat35ab] {
    padding: 11px;
}

.operation-card-code[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
}

.operation-card-code span[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .46rem;
    font-weight: 750;
}

.operation-card-code small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .41rem;
    font-weight: 700;
}

.operation-card-content h3[b-he9rat35ab] {
    display: -webkit-box;
    min-height: 40px;
    margin: 7px 0 0;
    overflow: hidden;

    color: var(--theme-ink);
    font-size: .62rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.operation-card-content > p[b-he9rat35ab] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: #75877f;
    font-size: .45rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.operation-card-chips[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.missing-coordinate-chip[b-he9rat35ab] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #a34740;
    background: #fff0ee;

    font-size: .41rem;
    font-weight: 700;
}

.operation-card-technician[b-he9rat35ab] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);

    gap: 7px;
    margin-top: 9px;
}

.operation-card-technician > span[b-he9rat35ab] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.operation-card-technician strong[b-he9rat35ab] {
    display: block;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .49rem;
}

.operation-card-technician small[b-he9rat35ab] {
    display: block;
    margin-top: 3px;

    color: #87958f;
    font-size: .41rem;
}

.operation-card-progress[b-he9rat35ab] {
    margin-top: 9px;
}

.operation-card-progress > div[b-he9rat35ab] {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 5px;
}

.operation-card-progress span[b-he9rat35ab] {
    color: #87958f;
    font-size: .41rem;
}

.operation-card-progress strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: .52rem;
}

.operation-card-footer[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1.12fr)
        38px;

    gap: 5px;
    margin-top: 10px;
}

.card-detail-button[b-he9rat35ab],
.card-map-button[b-he9rat35ab],
.card-direction-button[b-he9rat35ab] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 4px;

    padding: 0 7px;

    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    text-decoration: none;
}

.card-detail-button[b-he9rat35ab] {
    border: 1px solid rgba(7, 88, 67, .17);

    color: var(--theme-primary);
    background: #f4faf7;

    cursor: pointer;
}

.card-map-button[b-he9rat35ab] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d);
}

.card-map-button:hover[b-he9rat35ab] {
    color: #fff;
}

.card-direction-button[b-he9rat35ab] {
    border: 1px solid rgba(45, 120, 164, .20);

    color: #2d78a4;
    background: #edf6fb;
}

.detail-map-actions[b-he9rat35ab] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.detail-map-location[b-he9rat35ab] {
    display: grid;
    grid-template-columns:
        58px
        minmax(0, 1fr)
        auto;

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.detail-map-icon[b-he9rat35ab] {
    display: grid;
    width: 58px;
    height: 58px;

    place-items: center;
    border-radius: 17px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(45, 120, 164, .20);
}

.detail-map-location small[b-he9rat35ab] {
    color: #2d78a4;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.detail-map-location h3[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.detail-map-location p[b-he9rat35ab] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.detail-map-location em[b-he9rat35ab] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .45rem;
    font-style: normal;
    font-weight: 650;
}

.location-map-link[b-he9rat35ab] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .19);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.detail-progress-panel[b-he9rat35ab] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-progress-heading[b-he9rat35ab] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 10px;
}

.detail-progress-heading small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.detail-progress-heading h3[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.detail-progress-heading > strong[b-he9rat35ab] {
    color: var(--theme-primary);
    font-size: 1.18rem;
}

.detail-progress-footer[b-he9rat35ab] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;

    margin-top: 9px;
}

.detail-progress-footer span[b-he9rat35ab] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #697b74;
    font-size: .48rem;
}

.detail-info-grid[b-he9rat35ab] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.detail-info-grid > div[b-he9rat35ab] {
    min-height: 67px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 11px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-info-grid span[b-he9rat35ab] {
    display: block;

    color: var(--theme-muted);
    font-size: .42rem;
}

.detail-info-grid strong[b-he9rat35ab] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.5;
}

.detail-description-panel[b-he9rat35ab] {
    margin-top: 13px;
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .16);
    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.detail-description-panel small[b-he9rat35ab] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.detail-description-panel h3[b-he9rat35ab] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.detail-description-panel p[b-he9rat35ab] {
    margin: 7px 0 0;

    color: var(--theme-muted);
    font-size: .55rem;
    line-height: 1.75;
}

.four-columns[b-he9rat35ab] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

@keyframes marker-pulse-b-he9rat35ab {
    0% {
        opacity: .75;
        transform: scale(.55);
    }

    75%,
    100% {
        opacity: 0;
        transform: scale(3.2);
    }
}

@keyframes marker-alert-b-he9rat35ab {
    0%,
    100% {
        box-shadow:
            0 9px 20px rgba(189, 79, 67, .24);
    }

    50% {
        box-shadow:
            0 9px 26px rgba(189, 79, 67, .50);
    }
}

@media (max-width: 1280px) {
    .map-workspace[b-he9rat35ab] {
        grid-template-columns:
            minmax(0, 1.55fr)
            minmax(280px, .75fr);
    }

    .operation-card-grid[b-he9rat35ab] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .detail-info-grid[b-he9rat35ab],
    .four-columns[b-he9rat35ab] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1020px) {
    .map-workspace[b-he9rat35ab] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .selected-work-panel[b-he9rat35ab] {
        min-height: 0;
    }

    .selected-empty[b-he9rat35ab] {
        min-height: 280px;
    }

    .premium-map-canvas[b-he9rat35ab] {
        min-height: 560px;
    }

    .operation-card-grid[b-he9rat35ab] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .map-panel-header[b-he9rat35ab] {
        align-items: flex-start;
        flex-direction: column;
    }

    .map-panel-actions[b-he9rat35ab] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .map-open-selected[b-he9rat35ab] {
        width: 100%;
    }

    .premium-map-canvas[b-he9rat35ab] {
        min-height: 500px;
    }

    .map-legend[b-he9rat35ab] {
        right: 12px;
        left: 12px;
        bottom: 12px;

        max-width: none;
    }

    .map-scale[b-he9rat35ab] {
        display: none;
    }

    .operation-card-grid[b-he9rat35ab],
    .detail-info-grid[b-he9rat35ab],
    .four-columns[b-he9rat35ab] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .detail-map-location[b-he9rat35ab] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .location-map-link[b-he9rat35ab] {
        grid-column: 1 / -1;
    }

    .detail-map-actions[b-he9rat35ab] {
        width: 100%;
        flex-direction: column;
    }

    .detail-map-actions a[b-he9rat35ab] {
        width: 100%;
    }
}

@media (max-width: 520px) {
    .selected-map-actions[b-he9rat35ab] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .map-label[b-he9rat35ab] {
        display: none;
    }

    .operation-map-marker[b-he9rat35ab] {
        width: 36px;
        height: 36px;
    }

    .marker-tooltip[b-he9rat35ab] {
        width: 180px;
    }

    .operation-card-footer[b-he9rat35ab] {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            36px;
    }
}
/* /Components/Pages/01Ziticen/05repairs/PublicAssets.razor.rz.scp.css */
.public-asset-page[b-9dx1ahw3iy] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.public-asset-page[b-9dx1ahw3iy]  .public-asset-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.public-asset-hero[b-9dx1ahw3iy] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-9dx1ahw3iy] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-9dx1ahw3iy] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-9dx1ahw3iy] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-9dx1ahw3iy] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-9dx1ahw3iy] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-9dx1ahw3iy] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-9dx1ahw3iy] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-9dx1ahw3iy] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-9dx1ahw3iy] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-9dx1ahw3iy] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.public-asset-page[b-9dx1ahw3iy]  .hero-add-button,
.public-asset-page[b-9dx1ahw3iy]  .search-button,
.public-asset-page[b-9dx1ahw3iy]  .toolbar-add-button,
.public-asset-page[b-9dx1ahw3iy]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.public-asset-page[b-9dx1ahw3iy]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-9dx1ahw3iy] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-9dx1ahw3iy] {
    opacity: .55;
    cursor: not-allowed;
}

.public-asset-page[b-9dx1ahw3iy]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.public-asset-page[b-9dx1ahw3iy]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-9dx1ahw3iy] {
    margin-top: 7px;
}

.summary-card[b-9dx1ahw3iy] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-9dx1ahw3iy] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-9dx1ahw3iy] {
    color: #2c7da8;
}

.summary-card.pending[b-9dx1ahw3iy] {
    color: #7658a7;
}

.summary-card.urgent[b-9dx1ahw3iy] {
    color: #c05b4e;
}

.summary-line[b-9dx1ahw3iy] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-9dx1ahw3iy] {
    min-width: 0;
}

.summary-card small[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-9dx1ahw3iy] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-9dx1ahw3iy] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-9dx1ahw3iy] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-9dx1ahw3iy],
.asset-list-panel[b-9dx1ahw3iy] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-9dx1ahw3iy],
.list-toolbar[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-9dx1ahw3iy],
.panel-kicker[b-9dx1ahw3iy] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-9dx1ahw3iy],
.list-toolbar h2[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-9dx1ahw3iy],
.list-toolbar p[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-9dx1ahw3iy] {
    align-items: center;
}

.public-asset-page[b-9dx1ahw3iy]  .premium-field,
.public-asset-page[b-9dx1ahw3iy]  .form-field {
    width: 100%;
}

.public-asset-page[b-9dx1ahw3iy]  .premium-field .mud-input-outlined-border,
.public-asset-page[b-9dx1ahw3iy]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.public-asset-page[b-9dx1ahw3iy]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.public-asset-page[b-9dx1ahw3iy]  .sort-select {
    width: 170px;
}

.public-asset-page[b-9dx1ahw3iy]  .toolbar-add-button {
    min-height: 42px;
}

.public-asset-page[b-9dx1ahw3iy]  .asset-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.public-asset-page[b-9dx1ahw3iy]  .asset-table .mud-table-head {
    background: #eef6f2;
}

.public-asset-page[b-9dx1ahw3iy]  .asset-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-9dx1ahw3iy] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-9dx1ahw3iy],
.mini-photo-empty[b-9dx1ahw3iy] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-9dx1ahw3iy] {
    cursor: zoom-in;
}

.mini-photo-button img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-9dx1ahw3iy] {
    object-fit: cover;
}

.mini-photo-button small[b-9dx1ahw3iy] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-9dx1ahw3iy] {
    color: #9c7b38;
}

.applicant-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-9dx1ahw3iy],
.applicant-cell small[b-9dx1ahw3iy] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-9dx1ahw3iy] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-9dx1ahw3iy],
.channel-chip[b-9dx1ahw3iy],
.priority-chip[b-9dx1ahw3iy],
.status-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-9dx1ahw3iy],
.type-chip.construction[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-9dx1ahw3iy],
.type-chip.food_license[b-9dx1ahw3iy],
.type-chip.tax[b-9dx1ahw3iy] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-9dx1ahw3iy],
.type-chip.environment[b-9dx1ahw3iy] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-9dx1ahw3iy],
.date-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-9dx1ahw3iy],
.date-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-9dx1ahw3iy],
.date-cell small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-9dx1ahw3iy] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-9dx1ahw3iy] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-9dx1ahw3iy] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-9dx1ahw3iy] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-9dx1ahw3iy] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.public-asset-page[b-9dx1ahw3iy]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.public-asset-page[b-9dx1ahw3iy]  .row-action.view {
    color: #2d79a2;
}

.public-asset-page[b-9dx1ahw3iy]  .row-action.edit {
    color: var(--theme-primary);
}

.public-asset-page[b-9dx1ahw3iy]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.public-asset-page[b-9dx1ahw3iy]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-9dx1ahw3iy] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-9dx1ahw3iy] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-9dx1ahw3iy] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-9dx1ahw3iy] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-9dx1ahw3iy] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.asset-form-modal[b-9dx1ahw3iy],
.asset-view-modal[b-9dx1ahw3iy],
.delete-modal[b-9dx1ahw3iy] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-9dx1ahw3iy .22s ease-out;
}

@keyframes modalAppear-b-9dx1ahw3iy {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.asset-form-modal[b-9dx1ahw3iy] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-9dx1ahw3iy] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-9dx1ahw3iy] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-9dx1ahw3iy] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-9dx1ahw3iy] {
    margin-top: 24px;
}

.form-section-title > span[b-9dx1ahw3iy] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-9dx1ahw3iy] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-9dx1ahw3iy] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-9dx1ahw3iy] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-9dx1ahw3iy] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-9dx1ahw3iy] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-9dx1ahw3iy] {
    min-height: 310px;
}

.photo-preview img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-9dx1ahw3iy] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-9dx1ahw3iy] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-9dx1ahw3iy] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-9dx1ahw3iy],
.remove-photo-button[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-9dx1ahw3iy] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-9dx1ahw3iy] {
    display: none;
}

.remove-photo-button[b-9dx1ahw3iy] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.public-asset-page[b-9dx1ahw3iy]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.public-asset-page[b-9dx1ahw3iy]  .cancel-button,
.public-asset-page[b-9dx1ahw3iy]  .save-button,
.public-asset-page[b-9dx1ahw3iy]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.public-asset-page[b-9dx1ahw3iy]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.public-asset-page[b-9dx1ahw3iy]  .save-button {
    min-width: 170px;
}

.asset-view-modal[b-9dx1ahw3iy] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-9dx1ahw3iy] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-9dx1ahw3iy] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-9dx1ahw3iy] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 5rem;
}

.view-cover-overlay[b-9dx1ahw3iy] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-9dx1ahw3iy] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-9dx1ahw3iy] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-9dx1ahw3iy] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-9dx1ahw3iy] {
    padding: 22px;
}

.view-toolbar[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-9dx1ahw3iy] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-9dx1ahw3iy],
.view-info-grid span[b-9dx1ahw3iy],
.view-description small[b-9dx1ahw3iy],
.attachment-heading small[b-9dx1ahw3iy],
.view-note small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-9dx1ahw3iy] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-9dx1ahw3iy] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-9dx1ahw3iy] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-9dx1ahw3iy] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-9dx1ahw3iy] {
    background: #f3efe5;
}

.attachment-card img[b-9dx1ahw3iy] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-9dx1ahw3iy] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-9dx1ahw3iy] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 2.3rem;
}

.view-note[b-9dx1ahw3iy] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-9dx1ahw3iy] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-9dx1ahw3iy] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-9dx1ahw3iy] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-9dx1ahw3iy] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-9dx1ahw3iy] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-9dx1ahw3iy] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-9dx1ahw3iy] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-9dx1ahw3iy] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-9dx1ahw3iy] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-9dx1ahw3iy] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-9dx1ahw3iy] {
    color: #963b36;
}

.delete-warning[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.public-asset-page[b-9dx1ahw3iy]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .public-asset-hero[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-9dx1ahw3iy] {
        max-width: 570px;
    }

    .list-toolbar[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-9dx1ahw3iy] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .public-asset-page[b-9dx1ahw3iy] {
        padding: 15px 12px 30px;
    }

    .public-asset-hero[b-9dx1ahw3iy] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-9dx1ahw3iy] {
        font-size: 2.3rem;
    }

    .hero-meta[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-9dx1ahw3iy] {
        width: 100%;
    }

    .filter-heading[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }

    .public-asset-page[b-9dx1ahw3iy]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-9dx1ahw3iy] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-9dx1ahw3iy],
    .attachment-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-9dx1ahw3iy],
    .view-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-9dx1ahw3iy] {
        align-items: end;
        padding: 0;
    }

    .asset-form-modal[b-9dx1ahw3iy],
    .asset-view-modal[b-9dx1ahw3iy] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-9dx1ahw3iy] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-9dx1ahw3iy],
    .asset-list-panel[b-9dx1ahw3iy] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-9dx1ahw3iy] {
        align-items: flex-start;
    }

    .modal-icon[b-9dx1ahw3iy] {
        display: none;
    }

    .modal-footer[b-9dx1ahw3iy] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-asset-page[b-9dx1ahw3iy]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-9dx1ahw3iy] {
        padding: 0;
    }

    .image-preview-modal[b-9dx1ahw3iy] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-9dx1ahw3iy],
    .asset-form-modal[b-9dx1ahw3iy],
    .asset-view-modal[b-9dx1ahw3iy],
    .delete-modal[b-9dx1ahw3iy] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-9dx1ahw3iy] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-9dx1ahw3iy],
.status-overview-card.selected[b-9dx1ahw3iy] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-9dx1ahw3iy] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-9dx1ahw3iy] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-9dx1ahw3iy] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-9dx1ahw3iy] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-9dx1ahw3iy] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-9dx1ahw3iy] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-9dx1ahw3iy],
.complainant-cell small[b-9dx1ahw3iy] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-9dx1ahw3iy] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-9dx1ahw3iy] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-9dx1ahw3iy] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-9dx1ahw3iy] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-9dx1ahw3iy] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-9dx1ahw3iy] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-9dx1ahw3iy] {
    min-width: 116px;
}

.privacy-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-9dx1ahw3iy] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-9dx1ahw3iy] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-9dx1ahw3iy],
.status-chip.cancelled[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-9dx1ahw3iy] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-9dx1ahw3iy] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-9dx1ahw3iy] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-9dx1ahw3iy] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-9dx1ahw3iy] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-9dx1ahw3iy],
.evidence-preview[b-9dx1ahw3iy] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.asset-view-modal[b-9dx1ahw3iy] {
    width: min(100%, 920px);
}

.desired-resolution[b-9dx1ahw3iy],
.screening-panel[b-9dx1ahw3iy],
.attachment-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
}

.desired-resolution[b-9dx1ahw3iy] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-9dx1ahw3iy],
.screening-panel small[b-9dx1ahw3iy],
.section-heading small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-9dx1ahw3iy],
.screening-panel p[b-9dx1ahw3iy] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-9dx1ahw3iy] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-9dx1ahw3iy] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-9dx1ahw3iy] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-9dx1ahw3iy] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-9dx1ahw3iy] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-9dx1ahw3iy] {
    background: #f3efe5;
}

.attachment-card img[b-9dx1ahw3iy] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-9dx1ahw3iy] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-9dx1ahw3iy] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-9dx1ahw3iy] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-9dx1ahw3iy],
    .screening-panel[b-9dx1ahw3iy],
    .attachment-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-9dx1ahw3iy] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-9dx1ahw3iy] {
    background: #aa453e;
}

.summary-card.overdue[b-9dx1ahw3iy],
.summary-card.urgent[b-9dx1ahw3iy] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-9dx1ahw3iy] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-9dx1ahw3iy] {
    min-width: 150px;
}

.progress-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-9dx1ahw3iy],
.latest-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-9dx1ahw3iy],
.latest-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-9dx1ahw3iy],
.latest-cell small[b-9dx1ahw3iy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-9dx1ahw3iy],
.due-cell.overdue small[b-9dx1ahw3iy] {
    color: #b54842;
}

.overdue-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-9dx1ahw3iy] {
    margin-top: 8px;
}

.form-progress-preview[b-9dx1ahw3iy] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-9dx1ahw3iy] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-9dx1ahw3iy],
.history-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-9dx1ahw3iy],
.section-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-9dx1ahw3iy],
.section-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-9dx1ahw3iy],
.section-heading h3[b-9dx1ahw3iy] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-9dx1ahw3iy]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-9dx1ahw3iy] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-9dx1ahw3iy] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-9dx1ahw3iy]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-9dx1ahw3iy] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-9dx1ahw3iy] {
    padding-bottom: 0;
}

.timeline-marker[b-9dx1ahw3iy] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-9dx1ahw3iy] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-9dx1ahw3iy] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-9dx1ahw3iy] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-9dx1ahw3iy] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-9dx1ahw3iy],
.timeline-item.cancelled .timeline-marker[b-9dx1ahw3iy] {
    background: #aa453e;
}

.timeline-content[b-9dx1ahw3iy] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-9dx1ahw3iy] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-9dx1ahw3iy] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-9dx1ahw3iy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-9dx1ahw3iy] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-9dx1ahw3iy] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-9dx1ahw3iy] {
    color: #2d78a4;
}

.summary-card.progress[b-9dx1ahw3iy] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-9dx1ahw3iy] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-9dx1ahw3iy] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-9dx1ahw3iy] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-9dx1ahw3iy] {
    background: #aa453e;
}

.tracking-number-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-9dx1ahw3iy] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-9dx1ahw3iy],
.assigned-by-cell[b-9dx1ahw3iy],
.latest-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-9dx1ahw3iy],
.assigned-by-cell strong[b-9dx1ahw3iy],
.latest-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-9dx1ahw3iy],
.assigned-by-cell small[b-9dx1ahw3iy],
.latest-cell small[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-9dx1ahw3iy] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-9dx1ahw3iy],
.status-chip.cancelled[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-9dx1ahw3iy] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-9dx1ahw3iy] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.asset-view-modal[b-9dx1ahw3iy] {
    width: min(100%, 940px);
}

.tracking-banner[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-9dx1ahw3iy],
.banner-officer[b-9dx1ahw3iy],
.banner-due[b-9dx1ahw3iy],
.banner-progress[b-9dx1ahw3iy] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-9dx1ahw3iy],
.detail-note-grid[b-9dx1ahw3iy],
.history-panel[b-9dx1ahw3iy],
.attachment-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
}

.assignment-instruction[b-9dx1ahw3iy] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-9dx1ahw3iy],
.detail-note-grid small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-9dx1ahw3iy],
.detail-note-grid p[b-9dx1ahw3iy] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-9dx1ahw3iy] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-9dx1ahw3iy] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-9dx1ahw3iy] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-9dx1ahw3iy]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-9dx1ahw3iy],
.timeline-item.cancelled .timeline-marker[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-9dx1ahw3iy],
.evidence-preview[b-9dx1ahw3iy] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-9dx1ahw3iy],
    .detail-note-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-9dx1ahw3iy] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-9dx1ahw3iy] {
    width: 100%;
}

.available-count-card[b-9dx1ahw3iy] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-9dx1ahw3iy] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-9dx1ahw3iy] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-9dx1ahw3iy] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-9dx1ahw3iy]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-9dx1ahw3iy]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-9dx1ahw3iy] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-9dx1ahw3iy] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-9dx1ahw3iy] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-9dx1ahw3iy] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-9dx1ahw3iy] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 1.55rem;
}

.picker-photo[b-9dx1ahw3iy] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-9dx1ahw3iy] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 2rem;
}

.picker-content[b-9dx1ahw3iy] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-9dx1ahw3iy] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-9dx1ahw3iy] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-9dx1ahw3iy] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-9dx1ahw3iy] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-9dx1ahw3iy] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-9dx1ahw3iy] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-9dx1ahw3iy] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-9dx1ahw3iy] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-9dx1ahw3iy] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-9dx1ahw3iy] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-9dx1ahw3iy] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-9dx1ahw3iy] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-9dx1ahw3iy] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-9dx1ahw3iy] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-9dx1ahw3iy] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-9dx1ahw3iy] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-9dx1ahw3iy],
    .selected-complaint-panel[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-9dx1ahw3iy] {
        min-height: 220px;
    }

    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-9dx1ahw3iy] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-9dx1ahw3iy] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-9dx1ahw3iy] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-9dx1ahw3iy] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-9dx1ahw3iy] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-9dx1ahw3iy] {
    color: #b47b22;
}

.summary-card.overdue[b-9dx1ahw3iy] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-9dx1ahw3iy] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-9dx1ahw3iy] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-9dx1ahw3iy] {
    background: #75837d;
}

.status-overview-card.completed > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-9dx1ahw3iy] {
    background: #bc4d45;
}

.tracking-number-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-9dx1ahw3iy] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-9dx1ahw3iy],
.progress-cell[b-9dx1ahw3iy],
.followup-cell[b-9dx1ahw3iy],
.latest-cell[b-9dx1ahw3iy],
.department-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-9dx1ahw3iy],
.followup-cell strong[b-9dx1ahw3iy],
.latest-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-9dx1ahw3iy],
.followup-cell small[b-9dx1ahw3iy],
.latest-cell small[b-9dx1ahw3iy] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-9dx1ahw3iy] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-9dx1ahw3iy] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-9dx1ahw3iy] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-9dx1ahw3iy] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-9dx1ahw3iy] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-9dx1ahw3iy] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-9dx1ahw3iy] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-9dx1ahw3iy] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-9dx1ahw3iy] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-9dx1ahw3iy] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-9dx1ahw3iy] {
    width: 100%;
}

.source-picker-list[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-9dx1ahw3iy] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-9dx1ahw3iy] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-9dx1ahw3iy] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-9dx1ahw3iy] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-9dx1ahw3iy] {
    display: block;
}

.picker-photo[b-9dx1ahw3iy] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-9dx1ahw3iy] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-9dx1ahw3iy] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-9dx1ahw3iy] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-9dx1ahw3iy] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-9dx1ahw3iy],
.picker-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-9dx1ahw3iy] {
    gap: 8px 12px;
}

.picker-meta span[b-9dx1ahw3iy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-9dx1ahw3iy] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-9dx1ahw3iy] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-9dx1ahw3iy] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-9dx1ahw3iy] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-9dx1ahw3iy] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-9dx1ahw3iy] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-9dx1ahw3iy] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-9dx1ahw3iy] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-9dx1ahw3iy] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-9dx1ahw3iy] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-9dx1ahw3iy] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-9dx1ahw3iy] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-9dx1ahw3iy],
.attachment-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-9dx1ahw3iy] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-9dx1ahw3iy]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-9dx1ahw3iy] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-9dx1ahw3iy] {
    background: #e7f2f9;
}

.attachment-card.after[b-9dx1ahw3iy] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-9dx1ahw3iy],
.after-preview[b-9dx1ahw3iy] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-9dx1ahw3iy],
    .selected-source-panel[b-9dx1ahw3iy],
    .tracking-banner[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-9dx1ahw3iy] {
        min-height: 220px;
    }

    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-9dx1ahw3iy] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-9dx1ahw3iy] {
    color: var(--theme-primary);
}

.summary-card.sla[b-9dx1ahw3iy] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-9dx1ahw3iy] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-9dx1ahw3iy] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-9dx1ahw3iy] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-9dx1ahw3iy] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.asset-number-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-9dx1ahw3iy] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-9dx1ahw3iy] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-9dx1ahw3iy] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-9dx1ahw3iy] {
    font-size: .36rem;
}

.resolution-chip[b-9dx1ahw3iy],
.publication-chip[b-9dx1ahw3iy],
.sla-chip[b-9dx1ahw3iy],
.source-sla-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-9dx1ahw3iy] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-9dx1ahw3iy],
.source-sla-chip.within[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-9dx1ahw3iy],
.source-sla-chip.over[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-9dx1ahw3iy],
.closed-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-9dx1ahw3iy],
.closed-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-9dx1ahw3iy],
.closed-cell small[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-9dx1ahw3iy] {
    color: #aa453e;
}

.score-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-9dx1ahw3iy] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-9dx1ahw3iy] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-9dx1ahw3iy] {
    color: #d0a43f;
}

.score-cell small[b-9dx1ahw3iy] {
    color: #8c9893;
    font-size: .47rem;
}

.asset-identity-banner[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.asset-identity-banner > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.asset-identity-banner .banner-department[b-9dx1ahw3iy] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.asset-identity-banner small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .48rem;
}

.asset-identity-banner strong[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-9dx1ahw3iy] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-9dx1ahw3iy] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-9dx1ahw3iy] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-9dx1ahw3iy] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-9dx1ahw3iy] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-9dx1ahw3iy] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-9dx1ahw3iy] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-9dx1ahw3iy] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-9dx1ahw3iy] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-9dx1ahw3iy] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-9dx1ahw3iy] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-9dx1ahw3iy] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-9dx1ahw3iy] {
    display: block;
}

@media (max-width: 1200px) {
    .asset-identity-banner[b-9dx1ahw3iy],
    .three-columns[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .asset-identity-banner[b-9dx1ahw3iy],
    .three-columns[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-9dx1ahw3iy] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-9dx1ahw3iy] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-9dx1ahw3iy] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-9dx1ahw3iy] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-9dx1ahw3iy] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-9dx1ahw3iy] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.public-asset-page[b-9dx1ahw3iy]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-9dx1ahw3iy] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-9dx1ahw3iy] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-9dx1ahw3iy] { background: #6e7d77; }
.status-overview-card.assigned > span[b-9dx1ahw3iy] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-9dx1ahw3iy] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-9dx1ahw3iy] { background: #ad721a; }
.status-overview-card.completed > span[b-9dx1ahw3iy] { background: var(--theme-primary); }

.asset-number-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-9dx1ahw3iy] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-9dx1ahw3iy] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-9dx1ahw3iy] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-9dx1ahw3iy] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-9dx1ahw3iy] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-9dx1ahw3iy] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-9dx1ahw3iy],
.schedule-cell[b-9dx1ahw3iy],
.budget-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-9dx1ahw3iy],
.schedule-cell strong[b-9dx1ahw3iy],
.budget-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-9dx1ahw3iy],
.schedule-cell small[b-9dx1ahw3iy],
.budget-cell small[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-9dx1ahw3iy],
.schedule-cell.overdue small[b-9dx1ahw3iy] {
    color: #b3463d;
}

.budget-cell strong[b-9dx1ahw3iy] {
    color: #9c7932;
}

.progress-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-9dx1ahw3iy] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-9dx1ahw3iy] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-9dx1ahw3iy] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-9dx1ahw3iy] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-9dx1ahw3iy] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-9dx1ahw3iy] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-9dx1ahw3iy] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-9dx1ahw3iy] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-9dx1ahw3iy] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-9dx1ahw3iy] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-9dx1ahw3iy] {
    display: block;
}

.picker-photo[b-9dx1ahw3iy] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-9dx1ahw3iy] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-9dx1ahw3iy] {
    min-width: 0;
}

.picker-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-9dx1ahw3iy] {
    min-width: 0;
}

.picker-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-9dx1ahw3iy] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-9dx1ahw3iy] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-9dx1ahw3iy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-9dx1ahw3iy] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-9dx1ahw3iy] {
    font-size: .47rem;
}

.selected-source-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-9dx1ahw3iy] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-9dx1ahw3iy] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-9dx1ahw3iy] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-9dx1ahw3iy] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-9dx1ahw3iy] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-9dx1ahw3iy] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-9dx1ahw3iy] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-9dx1ahw3iy] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.asset-identity-banner[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.asset-identity-banner > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.asset-identity-banner .banner-technician[b-9dx1ahw3iy] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-9dx1ahw3iy] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.asset-identity-banner small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .48rem;
}

.asset-identity-banner strong[b-9dx1ahw3iy] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-9dx1ahw3iy] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-9dx1ahw3iy] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-9dx1ahw3iy] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-9dx1ahw3iy] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-9dx1ahw3iy] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-9dx1ahw3iy] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-9dx1ahw3iy] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-9dx1ahw3iy] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-9dx1ahw3iy] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-9dx1ahw3iy] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-9dx1ahw3iy] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-9dx1ahw3iy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-9dx1ahw3iy],
.history-meta b[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-9dx1ahw3iy] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-9dx1ahw3iy] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-9dx1ahw3iy] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .asset-identity-banner[b-9dx1ahw3iy],
    .four-columns[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .asset-identity-banner[b-9dx1ahw3iy],
    .detail-note-grid[b-9dx1ahw3iy],
    .four-columns[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-9dx1ahw3iy] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-9dx1ahw3iy],
    .source-picker-card[b-9dx1ahw3iy],
    .selected-info-grid[b-9dx1ahw3iy] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-9dx1ahw3iy] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-9dx1ahw3iy] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-9dx1ahw3iy] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-9dx1ahw3iy] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-9dx1ahw3iy] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.public-asset-page[b-9dx1ahw3iy]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-9dx1ahw3iy] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-9dx1ahw3iy] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-9dx1ahw3iy] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-9dx1ahw3iy] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-9dx1ahw3iy] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-9dx1ahw3iy] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-9dx1ahw3iy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-9dx1ahw3iy] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-9dx1ahw3iy] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-9dx1ahw3iy],
.asset-location-cell[b-9dx1ahw3iy],
.department-cell[b-9dx1ahw3iy],
.status-condition-cell[b-9dx1ahw3iy],
.value-cell[b-9dx1ahw3iy],
.inspection-cell[b-9dx1ahw3iy] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-9dx1ahw3iy],
.asset-location-cell strong[b-9dx1ahw3iy],
.department-cell strong[b-9dx1ahw3iy],
.value-cell strong[b-9dx1ahw3iy],
.inspection-cell strong[b-9dx1ahw3iy] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-9dx1ahw3iy],
.asset-location-cell small[b-9dx1ahw3iy],
.department-cell small[b-9dx1ahw3iy],
.value-cell small[b-9dx1ahw3iy],
.inspection-cell small[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-9dx1ahw3iy] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-9dx1ahw3iy] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-9dx1ahw3iy] {
    width: fit-content;
}

.status-condition-cell[b-9dx1ahw3iy] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-9dx1ahw3iy],
.inspection-cell.overdue small[b-9dx1ahw3iy] {
    color: #b3463d;
}

.condition-chip[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-9dx1ahw3iy] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-9dx1ahw3iy] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-9dx1ahw3iy] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-9dx1ahw3iy] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-9dx1ahw3iy] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-9dx1ahw3iy] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-9dx1ahw3iy] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-9dx1ahw3iy] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-9dx1ahw3iy] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-9dx1ahw3iy] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-9dx1ahw3iy] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.asset-photo-upload-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.asset-identity-banner[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.asset-identity-banner > div[b-9dx1ahw3iy] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.asset-identity-banner .asset-banner-icon[b-9dx1ahw3iy] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-9dx1ahw3iy] {
    font-size: 1.7rem;
}

.asset-identity-banner small[b-9dx1ahw3iy] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-identity-banner strong[b-9dx1ahw3iy] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-9dx1ahw3iy] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-9dx1ahw3iy] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-9dx1ahw3iy] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-9dx1ahw3iy] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-9dx1ahw3iy] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-9dx1ahw3iy] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-9dx1ahw3iy] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-9dx1ahw3iy] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-9dx1ahw3iy] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.public-asset-page[b-9dx1ahw3iy]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-9dx1ahw3iy] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-9dx1ahw3iy] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-9dx1ahw3iy] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-9dx1ahw3iy] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-9dx1ahw3iy] {
    font-style: normal;
}

.asset-location-panel a[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-9dx1ahw3iy] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-9dx1ahw3iy] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-9dx1ahw3iy] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-9dx1ahw3iy] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-9dx1ahw3iy] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-9dx1ahw3iy] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-9dx1ahw3iy] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-9dx1ahw3iy] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .asset-photo-upload-grid[b-9dx1ahw3iy] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .asset-identity-banner[b-9dx1ahw3iy] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .asset-identity-banner > div:nth-child(4)[b-9dx1ahw3iy],
    .asset-identity-banner > div:nth-child(5)[b-9dx1ahw3iy] {
        grid-column: auto;
    }

    .inspection-date-grid[b-9dx1ahw3iy],
    .three-columns[b-9dx1ahw3iy] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .asset-photo-upload-grid[b-9dx1ahw3iy],
    .asset-value-preview[b-9dx1ahw3iy],
    .asset-detail-note-grid[b-9dx1ahw3iy] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .asset-identity-banner[b-9dx1ahw3iy] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .asset-identity-banner .asset-banner-icon[b-9dx1ahw3iy] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-9dx1ahw3iy],
    .three-columns[b-9dx1ahw3iy] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-9dx1ahw3iy] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-9dx1ahw3iy] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-9dx1ahw3iy] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-9dx1ahw3iy] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .asset-identity-banner[b-9dx1ahw3iy] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-9dx1ahw3iy] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-9dx1ahw3iy],
    .public-asset-page[b-9dx1ahw3iy]  .view-edit-button {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/05repairs/RepairRequests.razor.rz.scp.css */
.repair-page[b-dfg6d7syxa] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.repair-page[b-dfg6d7syxa]  .repair-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.repair-hero[b-dfg6d7syxa] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-dfg6d7syxa] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-dfg6d7syxa] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-dfg6d7syxa] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-dfg6d7syxa] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-dfg6d7syxa] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-dfg6d7syxa] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-dfg6d7syxa] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-dfg6d7syxa] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-dfg6d7syxa] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-dfg6d7syxa] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.repair-page[b-dfg6d7syxa]  .hero-add-button,
.repair-page[b-dfg6d7syxa]  .search-button,
.repair-page[b-dfg6d7syxa]  .toolbar-add-button,
.repair-page[b-dfg6d7syxa]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.repair-page[b-dfg6d7syxa]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-dfg6d7syxa] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-dfg6d7syxa] {
    opacity: .55;
    cursor: not-allowed;
}

.repair-page[b-dfg6d7syxa]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.repair-page[b-dfg6d7syxa]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-dfg6d7syxa] {
    margin-top: 7px;
}

.summary-card[b-dfg6d7syxa] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-dfg6d7syxa] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-dfg6d7syxa] {
    color: #2c7da8;
}

.summary-card.pending[b-dfg6d7syxa] {
    color: #7658a7;
}

.summary-card.urgent[b-dfg6d7syxa] {
    color: #c05b4e;
}

.summary-line[b-dfg6d7syxa] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-dfg6d7syxa] {
    min-width: 0;
}

.summary-card small[b-dfg6d7syxa] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-dfg6d7syxa] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-dfg6d7syxa] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-dfg6d7syxa] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-dfg6d7syxa] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-dfg6d7syxa],
.repair-list-panel[b-dfg6d7syxa] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-dfg6d7syxa],
.list-toolbar[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-dfg6d7syxa],
.panel-kicker[b-dfg6d7syxa] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-dfg6d7syxa],
.list-toolbar h2[b-dfg6d7syxa] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-dfg6d7syxa],
.list-toolbar p[b-dfg6d7syxa] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-dfg6d7syxa] {
    align-items: center;
}

.repair-page[b-dfg6d7syxa]  .premium-field,
.repair-page[b-dfg6d7syxa]  .form-field {
    width: 100%;
}

.repair-page[b-dfg6d7syxa]  .premium-field .mud-input-outlined-border,
.repair-page[b-dfg6d7syxa]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.repair-page[b-dfg6d7syxa]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.repair-page[b-dfg6d7syxa]  .sort-select {
    width: 170px;
}

.repair-page[b-dfg6d7syxa]  .toolbar-add-button {
    min-height: 42px;
}

.repair-page[b-dfg6d7syxa]  .repair-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.repair-page[b-dfg6d7syxa]  .repair-table .mud-table-head {
    background: #eef6f2;
}

.repair-page[b-dfg6d7syxa]  .repair-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-dfg6d7syxa] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-dfg6d7syxa],
.mini-photo-empty[b-dfg6d7syxa] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-dfg6d7syxa] {
    cursor: zoom-in;
}

.mini-photo-button img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-dfg6d7syxa] {
    object-fit: cover;
}

.mini-photo-button small[b-dfg6d7syxa] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-dfg6d7syxa] {
    color: #9c7b38;
}

.applicant-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-dfg6d7syxa],
.applicant-cell small[b-dfg6d7syxa] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-dfg6d7syxa] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-dfg6d7syxa],
.channel-chip[b-dfg6d7syxa],
.priority-chip[b-dfg6d7syxa],
.status-chip[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-dfg6d7syxa],
.type-chip.construction[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-dfg6d7syxa],
.type-chip.food_license[b-dfg6d7syxa],
.type-chip.tax[b-dfg6d7syxa] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-dfg6d7syxa],
.type-chip.environment[b-dfg6d7syxa] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-dfg6d7syxa],
.date-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-dfg6d7syxa],
.date-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-dfg6d7syxa],
.date-cell small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-dfg6d7syxa] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-dfg6d7syxa] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-dfg6d7syxa] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-dfg6d7syxa] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-dfg6d7syxa] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-dfg6d7syxa] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-dfg6d7syxa] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.repair-page[b-dfg6d7syxa]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.repair-page[b-dfg6d7syxa]  .row-action.view {
    color: #2d79a2;
}

.repair-page[b-dfg6d7syxa]  .row-action.edit {
    color: var(--theme-primary);
}

.repair-page[b-dfg6d7syxa]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.repair-page[b-dfg6d7syxa]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-dfg6d7syxa] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-dfg6d7syxa] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-dfg6d7syxa] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-dfg6d7syxa] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-dfg6d7syxa] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.repair-form-modal[b-dfg6d7syxa],
.repair-view-modal[b-dfg6d7syxa],
.delete-modal[b-dfg6d7syxa] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-dfg6d7syxa .22s ease-out;
}

@keyframes modalAppear-b-dfg6d7syxa {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.repair-form-modal[b-dfg6d7syxa] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-dfg6d7syxa] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-dfg6d7syxa] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-dfg6d7syxa] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-dfg6d7syxa] {
    margin-top: 24px;
}

.form-section-title > span[b-dfg6d7syxa] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-dfg6d7syxa] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-dfg6d7syxa] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-dfg6d7syxa] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-dfg6d7syxa] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-dfg6d7syxa] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-dfg6d7syxa] {
    min-height: 310px;
}

.photo-preview img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-dfg6d7syxa] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-dfg6d7syxa] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-dfg6d7syxa] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-dfg6d7syxa],
.remove-photo-button[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-dfg6d7syxa] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-dfg6d7syxa] {
    display: none;
}

.remove-photo-button[b-dfg6d7syxa] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.repair-page[b-dfg6d7syxa]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.repair-page[b-dfg6d7syxa]  .cancel-button,
.repair-page[b-dfg6d7syxa]  .save-button,
.repair-page[b-dfg6d7syxa]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.repair-page[b-dfg6d7syxa]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.repair-page[b-dfg6d7syxa]  .save-button {
    min-width: 170px;
}

.repair-view-modal[b-dfg6d7syxa] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-dfg6d7syxa] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-dfg6d7syxa] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-dfg6d7syxa] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-dfg6d7syxa] {
    font-size: 5rem;
}

.view-cover-overlay[b-dfg6d7syxa] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-dfg6d7syxa] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-dfg6d7syxa] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-dfg6d7syxa] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-dfg6d7syxa] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-dfg6d7syxa] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-dfg6d7syxa] {
    padding: 22px;
}

.view-toolbar[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-dfg6d7syxa] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-dfg6d7syxa],
.view-info-grid span[b-dfg6d7syxa],
.view-description small[b-dfg6d7syxa],
.attachment-heading small[b-dfg6d7syxa],
.view-note small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-dfg6d7syxa] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-dfg6d7syxa] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-dfg6d7syxa] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-dfg6d7syxa] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-dfg6d7syxa] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-dfg6d7syxa] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-dfg6d7syxa] {
    background: #f3efe5;
}

.attachment-card img[b-dfg6d7syxa] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-dfg6d7syxa] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-dfg6d7syxa] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-dfg6d7syxa] {
    font-size: 2.3rem;
}

.view-note[b-dfg6d7syxa] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-dfg6d7syxa] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-dfg6d7syxa] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-dfg6d7syxa] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-dfg6d7syxa] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-dfg6d7syxa] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-dfg6d7syxa] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-dfg6d7syxa] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-dfg6d7syxa] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-dfg6d7syxa] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-dfg6d7syxa] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-dfg6d7syxa] {
    color: #963b36;
}

.delete-warning[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.repair-page[b-dfg6d7syxa]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .repair-hero[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-dfg6d7syxa] {
        max-width: 570px;
    }

    .list-toolbar[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-dfg6d7syxa] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .repair-page[b-dfg6d7syxa] {
        padding: 15px 12px 30px;
    }

    .repair-hero[b-dfg6d7syxa] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-dfg6d7syxa] {
        font-size: 2.3rem;
    }

    .hero-meta[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-dfg6d7syxa] {
        width: 100%;
    }

    .filter-heading[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }

    .repair-page[b-dfg6d7syxa]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-dfg6d7syxa] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-dfg6d7syxa],
    .attachment-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-dfg6d7syxa],
    .view-info-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-dfg6d7syxa] {
        align-items: end;
        padding: 0;
    }

    .repair-form-modal[b-dfg6d7syxa],
    .repair-view-modal[b-dfg6d7syxa] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-dfg6d7syxa] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-dfg6d7syxa],
    .repair-list-panel[b-dfg6d7syxa] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-dfg6d7syxa] {
        align-items: flex-start;
    }

    .modal-icon[b-dfg6d7syxa] {
        display: none;
    }

    .modal-footer[b-dfg6d7syxa] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .repair-page[b-dfg6d7syxa]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-dfg6d7syxa] {
        padding: 0;
    }

    .image-preview-modal[b-dfg6d7syxa] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-dfg6d7syxa],
    .repair-form-modal[b-dfg6d7syxa],
    .repair-view-modal[b-dfg6d7syxa],
    .delete-modal[b-dfg6d7syxa] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-dfg6d7syxa] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-dfg6d7syxa],
.status-overview-card.selected[b-dfg6d7syxa] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-dfg6d7syxa] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-dfg6d7syxa] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-dfg6d7syxa] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-dfg6d7syxa] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-dfg6d7syxa] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-dfg6d7syxa] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-dfg6d7syxa] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-dfg6d7syxa] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-dfg6d7syxa],
.complainant-cell small[b-dfg6d7syxa] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-dfg6d7syxa] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-dfg6d7syxa] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-dfg6d7syxa] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-dfg6d7syxa] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-dfg6d7syxa] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-dfg6d7syxa] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-dfg6d7syxa] {
    min-width: 116px;
}

.privacy-chip[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-dfg6d7syxa] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-dfg6d7syxa] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-dfg6d7syxa],
.status-chip.cancelled[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-dfg6d7syxa] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-dfg6d7syxa] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-dfg6d7syxa] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-dfg6d7syxa] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-dfg6d7syxa] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-dfg6d7syxa] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-dfg6d7syxa],
.evidence-preview[b-dfg6d7syxa] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.repair-view-modal[b-dfg6d7syxa] {
    width: min(100%, 920px);
}

.desired-resolution[b-dfg6d7syxa],
.screening-panel[b-dfg6d7syxa],
.attachment-panel[b-dfg6d7syxa] {
    margin-top: 15px;
}

.desired-resolution[b-dfg6d7syxa] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-dfg6d7syxa],
.screening-panel small[b-dfg6d7syxa],
.section-heading small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-dfg6d7syxa],
.screening-panel p[b-dfg6d7syxa] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-dfg6d7syxa] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-dfg6d7syxa] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-dfg6d7syxa] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-dfg6d7syxa] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-dfg6d7syxa] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-dfg6d7syxa] {
    background: #f3efe5;
}

.attachment-card img[b-dfg6d7syxa] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-dfg6d7syxa] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-dfg6d7syxa] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-dfg6d7syxa] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-dfg6d7syxa] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-dfg6d7syxa],
    .screening-panel[b-dfg6d7syxa],
    .attachment-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-dfg6d7syxa] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-dfg6d7syxa] {
    background: #aa453e;
}

.summary-card.overdue[b-dfg6d7syxa],
.summary-card.urgent[b-dfg6d7syxa] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-dfg6d7syxa] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-dfg6d7syxa] {
    min-width: 150px;
}

.progress-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-dfg6d7syxa] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-dfg6d7syxa],
.latest-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-dfg6d7syxa],
.latest-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-dfg6d7syxa],
.latest-cell small[b-dfg6d7syxa] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-dfg6d7syxa],
.due-cell.overdue small[b-dfg6d7syxa] {
    color: #b54842;
}

.overdue-chip[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-dfg6d7syxa] {
    margin-top: 8px;
}

.form-progress-preview[b-dfg6d7syxa] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-dfg6d7syxa] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-dfg6d7syxa],
.history-panel[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-dfg6d7syxa],
.section-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-dfg6d7syxa],
.section-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-dfg6d7syxa],
.section-heading h3[b-dfg6d7syxa] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-dfg6d7syxa]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-dfg6d7syxa] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-dfg6d7syxa] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-dfg6d7syxa]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-dfg6d7syxa] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-dfg6d7syxa] {
    padding-bottom: 0;
}

.timeline-marker[b-dfg6d7syxa] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-dfg6d7syxa] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-dfg6d7syxa] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-dfg6d7syxa] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-dfg6d7syxa] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-dfg6d7syxa],
.timeline-item.cancelled .timeline-marker[b-dfg6d7syxa] {
    background: #aa453e;
}

.timeline-content[b-dfg6d7syxa] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-dfg6d7syxa] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-dfg6d7syxa] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-dfg6d7syxa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-dfg6d7syxa] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-dfg6d7syxa] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-dfg6d7syxa] {
    color: #2d78a4;
}

.summary-card.progress[b-dfg6d7syxa] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-dfg6d7syxa] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-dfg6d7syxa] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-dfg6d7syxa] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-dfg6d7syxa] {
    background: #aa453e;
}

.request-number-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.request-number-cell > span[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-dfg6d7syxa] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-dfg6d7syxa],
.assigned-by-cell[b-dfg6d7syxa],
.latest-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-dfg6d7syxa],
.assigned-by-cell strong[b-dfg6d7syxa],
.latest-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-dfg6d7syxa],
.assigned-by-cell small[b-dfg6d7syxa],
.latest-cell small[b-dfg6d7syxa] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-dfg6d7syxa] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-dfg6d7syxa],
.status-chip.cancelled[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-dfg6d7syxa] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-dfg6d7syxa] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.repair-view-modal[b-dfg6d7syxa] {
    width: min(100%, 940px);
}

.repair-banner[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.repair-banner > div[b-dfg6d7syxa] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-dfg6d7syxa],
.banner-officer[b-dfg6d7syxa],
.banner-due[b-dfg6d7syxa],
.banner-progress[b-dfg6d7syxa] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.repair-banner small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-dfg6d7syxa] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-dfg6d7syxa],
.detail-note-grid[b-dfg6d7syxa],
.history-panel[b-dfg6d7syxa],
.attachment-panel[b-dfg6d7syxa] {
    margin-top: 15px;
}

.assignment-instruction[b-dfg6d7syxa] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-dfg6d7syxa],
.detail-note-grid small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-dfg6d7syxa],
.detail-note-grid p[b-dfg6d7syxa] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-dfg6d7syxa] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-dfg6d7syxa] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-dfg6d7syxa] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-dfg6d7syxa]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-dfg6d7syxa],
.timeline-item.cancelled .timeline-marker[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-dfg6d7syxa],
.evidence-preview[b-dfg6d7syxa] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .repair-banner[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .repair-banner[b-dfg6d7syxa],
    .detail-note-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-dfg6d7syxa] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-dfg6d7syxa] {
    width: 100%;
}

.available-count-card[b-dfg6d7syxa] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-dfg6d7syxa] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-dfg6d7syxa] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-dfg6d7syxa] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-dfg6d7syxa]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-dfg6d7syxa]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-dfg6d7syxa] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-dfg6d7syxa] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-dfg6d7syxa] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-dfg6d7syxa] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-dfg6d7syxa] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-dfg6d7syxa] {
    font-size: 1.55rem;
}

.picker-photo[b-dfg6d7syxa] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-dfg6d7syxa] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-dfg6d7syxa] {
    font-size: 2rem;
}

.picker-content[b-dfg6d7syxa] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-dfg6d7syxa] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-dfg6d7syxa] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-dfg6d7syxa] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-dfg6d7syxa] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-dfg6d7syxa] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-dfg6d7syxa] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-dfg6d7syxa] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-dfg6d7syxa] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-dfg6d7syxa] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-dfg6d7syxa] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-dfg6d7syxa] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-dfg6d7syxa] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-dfg6d7syxa] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-dfg6d7syxa] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-dfg6d7syxa] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-dfg6d7syxa] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-dfg6d7syxa] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-dfg6d7syxa] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-dfg6d7syxa] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-dfg6d7syxa] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-dfg6d7syxa] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-dfg6d7syxa],
    .selected-complaint-panel[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-dfg6d7syxa] {
        min-height: 220px;
    }

    .selected-info-grid[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-dfg6d7syxa] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-dfg6d7syxa] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-dfg6d7syxa] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-dfg6d7syxa] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-dfg6d7syxa] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-dfg6d7syxa] {
    color: #b47b22;
}

.summary-card.overdue[b-dfg6d7syxa] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-dfg6d7syxa] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-dfg6d7syxa] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-dfg6d7syxa] {
    background: #75837d;
}

.status-overview-card.completed > span[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-dfg6d7syxa] {
    background: #bc4d45;
}

.request-number-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.request-number-cell > span[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-dfg6d7syxa] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-dfg6d7syxa],
.progress-cell[b-dfg6d7syxa],
.followup-cell[b-dfg6d7syxa],
.latest-cell[b-dfg6d7syxa],
.department-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-dfg6d7syxa],
.followup-cell strong[b-dfg6d7syxa],
.latest-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-dfg6d7syxa],
.followup-cell small[b-dfg6d7syxa],
.latest-cell small[b-dfg6d7syxa] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-dfg6d7syxa] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-dfg6d7syxa] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-dfg6d7syxa] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-dfg6d7syxa] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-dfg6d7syxa] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-dfg6d7syxa] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-dfg6d7syxa] {
    background: rgba(8, 112, 82, .84);
}

.repair-source-notice[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.repair-source-notice > .mud-icon-root[b-dfg6d7syxa] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.repair-source-notice > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.repair-source-notice strong[b-dfg6d7syxa] {
    color: #0a6048;
    font-size: .66rem;
}

.repair-source-notice small[b-dfg6d7syxa] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.assignment-picker-panel[b-dfg6d7syxa] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.assignment-picker-toolbar[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.assignment-picker-search[b-dfg6d7syxa] {
    width: 100%;
}

.assignment-picker-list[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.assignment-picker-card[b-dfg6d7syxa] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.assignment-picker-card:hover[b-dfg6d7syxa] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.assignment-picker-card.selected[b-dfg6d7syxa] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-dfg6d7syxa] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.assignment-picker-card.selected .picker-selected-mark[b-dfg6d7syxa] {
    display: block;
}

.picker-photo[b-dfg6d7syxa] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-dfg6d7syxa] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-dfg6d7syxa] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-dfg6d7syxa] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-dfg6d7syxa] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-dfg6d7syxa],
.picker-meta[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-dfg6d7syxa] {
    gap: 8px 12px;
}

.picker-meta span[b-dfg6d7syxa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-dfg6d7syxa] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-dfg6d7syxa] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-assignment-panel[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-assignment-photo[b-dfg6d7syxa] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-assignment-photo img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-assignment-content[b-dfg6d7syxa] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-dfg6d7syxa] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-dfg6d7syxa] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-dfg6d7syxa] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-dfg6d7syxa] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-dfg6d7syxa] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-dfg6d7syxa] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-assignment-hint[b-dfg6d7syxa] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-assignment-hint > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.select-assignment-hint strong[b-dfg6d7syxa] {
    color: #6c5729;
    font-size: .66rem;
}

.select-assignment-hint small[b-dfg6d7syxa] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.repair-banner[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.repair-banner > div[b-dfg6d7syxa] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.repair-banner small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-dfg6d7syxa] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-dfg6d7syxa],
.attachment-panel[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-dfg6d7syxa] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-dfg6d7syxa]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-dfg6d7syxa] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-dfg6d7syxa] {
    background: #e7f2f9;
}

.attachment-card.after[b-dfg6d7syxa] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-dfg6d7syxa],
.after-preview[b-dfg6d7syxa] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .repair-banner[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .assignment-picker-list[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .assignment-picker-toolbar[b-dfg6d7syxa],
    .selected-assignment-panel[b-dfg6d7syxa],
    .repair-banner[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-assignment-photo[b-dfg6d7syxa] {
        min-height: 220px;
    }

    .selected-info-grid[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .assignment-picker-card[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-dfg6d7syxa] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   NEW REPAIR REQUEST EXTENSIONS
   ========================================================= */
.summary-card[b-dfg6d7syxa] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);

    border-color: var(--summary-border);
}

.summary-card.total[b-dfg6d7syxa] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.new[b-dfg6d7syxa] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.urgent[b-dfg6d7syxa] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.photo[b-dfg6d7syxa] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card .summary-icon[b-dfg6d7syxa] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.repair-page[b-dfg6d7syxa]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-dfg6d7syxa] {
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--summary-accent),
            transparent);
}

.summary-card p strong[b-dfg6d7syxa] {
    color: var(--summary-accent);
}

.status-overview-card.new > span[b-dfg6d7syxa] {
    background: #2d78a4;
}

.status-overview-card.verifying > span[b-dfg6d7syxa] {
    background: #b47a20;
}

.status-overview-card.accepted > span[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.status-overview-card.urgent > span[b-dfg6d7syxa] {
    background: #bd4f43;
}

.status-overview-card.with-photo > span[b-dfg6d7syxa] {
    background: #7658a7;
}

.request-number-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 142px;
    flex-direction: column;
}

.request-number-cell > span[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.request-number-cell small[b-dfg6d7syxa] {
    margin-top: 4px;

    color: #8f9c96;
    font-size: .48rem;
}

.photo-pair-mini[b-dfg6d7syxa] {
    display: flex;
    min-width: 86px;
    align-items: center;
    gap: 5px;
}

.mini-photo-button[b-dfg6d7syxa] {
    position: relative;

    width: 42px;
    height: 48px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    background: #eff5f2;
    cursor: pointer;
}

.mini-photo-button img[b-dfg6d7syxa] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mini-photo-button small[b-dfg6d7syxa] {
    position: absolute;
    right: 2px;
    bottom: 2px;
    left: 2px;

    padding: 1px 2px;

    border-radius: 5px;
    color: #fff;
    background: rgba(3, 45, 36, .77);

    font-family: 'Kanit', sans-serif;
    font-size: .34rem;
    text-align: center;
}

.mini-photo-button:hover[b-dfg6d7syxa] {
    transform: translateY(-1px);
    border-color: rgba(7, 88, 67, .28);
}

.mini-photo-empty[b-dfg6d7syxa] {
    display: grid;
    width: 42px;
    height: 48px;

    place-items: center;
    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 9px;

    color: #a8b5af;
    background: #f4f7f5;
}

.asset-code-chip[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #6f5a28;
    background: #f7edda;

    font-size: .42rem;
    font-weight: 700;
}

.reporter-cell[b-dfg6d7syxa],
.location-cell[b-dfg6d7syxa],
.officer-cell[b-dfg6d7syxa],
.updated-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 125px;
    flex-direction: column;
}

.reporter-cell strong[b-dfg6d7syxa],
.location-cell strong[b-dfg6d7syxa],
.officer-cell strong[b-dfg6d7syxa],
.updated-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.reporter-cell small[b-dfg6d7syxa],
.location-cell small[b-dfg6d7syxa],
.officer-cell small[b-dfg6d7syxa],
.updated-cell small[b-dfg6d7syxa] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.reporter-cell em[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e7f2f9;

    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.category-chip.road[b-dfg6d7syxa] {
    color: #586976;
    background: #edf1f3;
}

.category-chip.lighting[b-dfg6d7syxa] {
    color: #a36b19;
    background: #fff2d8;
}

.category-chip.water[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.drainage[b-dfg6d7syxa] {
    color: #446b85;
    background: #e8f1f6;
}

.category-chip.building[b-dfg6d7syxa] {
    color: #76583f;
    background: #f2ebe5;
}

.category-chip.park[b-dfg6d7syxa] {
    color: #3f8650;
    background: #e8f5e9;
}

.category-chip.waste[b-dfg6d7syxa] {
    color: #756640;
    background: #f1eddf;
}

.category-chip.other[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.new[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.verifying[b-dfg6d7syxa] {
    color: #96661c;
    background: #fff1d7;
}

.status-chip.accepted[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-dfg6d7syxa] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.cancelled[b-dfg6d7syxa] {
    color: #6c7c75;
    background: #edf1ef;
}

.priority-chip.low[b-dfg6d7syxa] {
    color: #58706a;
    background: #edf2ef;
}

.priority-chip.normal[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-dfg6d7syxa] {
    color: #9b6819;
    background: #fff1d7;
}

.priority-chip.urgent[b-dfg6d7syxa] {
    color: #af443d;
    background: #fff0ef;
}

.priority-chip.critical[b-dfg6d7syxa] {
    color: #fff;
    background: #9e2724;
}

.switch-card[b-dfg6d7syxa] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 7px 11px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.switch-card > div[b-dfg6d7syxa] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.switch-card small[b-dfg6d7syxa] {
    margin-top: 2px;
    color: #88958f;
    font-size: .43rem;
}

.repair-banner[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(145px, .8fr)
        minmax(170px, .9fr)
        minmax(170px, .9fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.repair-banner > div[b-dfg6d7syxa] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.repair-banner .banner-reporter[b-dfg6d7syxa] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-reporter > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.repair-banner small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .48rem;
}

.repair-banner strong[b-dfg6d7syxa] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.description-highlight[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.description-highlight small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.description-highlight h3[b-dfg6d7syxa] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.description-highlight p[b-dfg6d7syxa] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.contact-panel[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 12px;
}

.contact-panel > div[b-dfg6d7syxa] {
    min-height: 67px;
    padding: 11px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.contact-panel span[b-dfg6d7syxa],
.contact-panel small[b-dfg6d7syxa] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.contact-panel strong[b-dfg6d7syxa] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.remark-alert[b-dfg6d7syxa] {
    margin-top: 13px;
}

.history-panel[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-dfg6d7syxa] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-dfg6d7syxa] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-dfg6d7syxa] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-dfg6d7syxa] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-dfg6d7syxa] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

@media (max-width: 1200px) {
    .repair-banner[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .repair-banner[b-dfg6d7syxa],
    .contact-panel[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   REPAIR REQUEST MASTER LIST
   ========================================================= */
.summary-card[b-dfg6d7syxa] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.total[b-dfg6d7syxa] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.progress[b-dfg6d7syxa] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.overdue[b-dfg6d7syxa] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.completed[b-dfg6d7syxa] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card[b-dfg6d7syxa] {
    border-color: var(--summary-border);
}

.summary-card .summary-icon[b-dfg6d7syxa] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.repair-page[b-dfg6d7syxa]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-dfg6d7syxa] {
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--summary-accent),
            transparent);
}

.summary-card p strong[b-dfg6d7syxa] {
    color: var(--summary-accent);
}

.report-mode-badge[b-dfg6d7syxa] {
    display: flex;
    min-height: 48px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 112, 84, .97),
            rgba(4, 61, 47, .99));

    box-shadow: 0 10px 25px rgba(4, 61, 47, .18);
}

.report-mode-badge > span[b-dfg6d7syxa] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #5e4314;
    background: #f0d89f;
}

.report-mode-badge > div[b-dfg6d7syxa] {
    display: flex;
    flex-direction: column;
}

.report-mode-badge strong[b-dfg6d7syxa] {
    color: #fff;
    font-size: .56rem;
    letter-spacing: .08em;
}

.report-mode-badge small[b-dfg6d7syxa] {
    margin-top: 1px;
    color: rgba(255, 255, 255, .72);
    font-size: .46rem;
}

.status-overview-card.pending > span[b-dfg6d7syxa] {
    background: #b47a20;
}

.status-overview-card.assigned > span[b-dfg6d7syxa] {
    background: #2d78a4;
}

.status-overview-card.in-progress > span[b-dfg6d7syxa] {
    background: #7658a7;
}

.status-overview-card.waiting-part > span[b-dfg6d7syxa] {
    background: #9b6819;
}

.status-overview-card.completed > span[b-dfg6d7syxa] {
    background: var(--theme-primary);
}

.photo-trio-mini[b-dfg6d7syxa] {
    display: flex;
    min-width: 124px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-dfg6d7syxa] {
    width: 37px;
    height: 48px;
}

.photo-trio-mini .mini-photo-button.result[b-dfg6d7syxa] {
    border-color: rgba(8, 112, 84, .28);
}

.photo-trio-mini .mini-photo-button.result small[b-dfg6d7syxa] {
    background: rgba(8, 112, 84, .88);
}

.department-cell[b-dfg6d7syxa],
.latest-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.department-cell strong[b-dfg6d7syxa],
.latest-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.department-cell small[b-dfg6d7syxa],
.latest-cell small[b-dfg6d7syxa] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.department-cell em[b-dfg6d7syxa] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e7f2f9;

    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.progress-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-dfg6d7syxa] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.due-cell[b-dfg6d7syxa] {
    display: flex;
    min-width: 112px;
    flex-direction: column;
}

.due-cell strong[b-dfg6d7syxa] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
}

.due-cell small[b-dfg6d7syxa] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.due-cell.overdue strong[b-dfg6d7syxa],
.due-cell.overdue small[b-dfg6d7syxa] {
    color: #b3463d;
}

.overdue-inline-chip[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #aa453e;
    background: #fff0ef;

    font-size: .42rem;
    font-weight: 700;
}

.status-chip.wait-assignment[b-dfg6d7syxa] {
    color: #9b6819;
    background: #fff1d7;
}

.status-chip.assigned[b-dfg6d7syxa] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in-progress[b-dfg6d7syxa] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-dfg6d7syxa] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.repair-page[b-dfg6d7syxa]  .report-detail-button {
    min-width: 104px;

    border-color: rgba(8, 112, 84, .25) !important;
    border-radius: 10px !important;

    color: var(--theme-primary) !important;
    background: #edf8f3 !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.repair-page[b-dfg6d7syxa]  .report-detail-button:hover {
    border-color: var(--theme-primary) !important;
    background: #dff3e9 !important;
}

.repair-banner[b-dfg6d7syxa] {
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(160px, .85fr)
        minmax(145px, .75fr)
        minmax(120px, .65fr);
}

.repair-banner .banner-department[b-dfg6d7syxa] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-dfg6d7syxa] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-progress strong[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-dfg6d7syxa] {
    margin-top: 15px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-dfg6d7syxa] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-dfg6d7syxa] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-dfg6d7syxa] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-dfg6d7syxa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-dfg6d7syxa] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #697b74;
    font-size: .51rem;
}

.detail-note-grid[b-dfg6d7syxa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-dfg6d7syxa] {
    min-height: 100px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-dfg6d7syxa] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-dfg6d7syxa] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-meta[b-dfg6d7syxa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .42rem;
    font-style: normal;
}

.history-meta b[b-dfg6d7syxa] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .42rem;
}

.three-columns[b-dfg6d7syxa] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.result[b-dfg6d7syxa] {
    border-color: rgba(8, 112, 84, .22);
}

.attachment-card.result span[b-dfg6d7syxa] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .repair-banner[b-dfg6d7syxa],
    .three-columns[b-dfg6d7syxa] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .repair-banner[b-dfg6d7syxa],
    .detail-note-grid[b-dfg6d7syxa],
    .three-columns[b-dfg6d7syxa] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .view-progress-footer[b-dfg6d7syxa] {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* /Components/Pages/01Ziticen/05repairs/TechnicianAssignedWorkOrders.razor.rz.scp.css */
.assigned-work-page[b-413n4dce1g] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.assigned-work-page[b-413n4dce1g]  .assigned-work-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.assigned-work-hero[b-413n4dce1g] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-413n4dce1g] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-413n4dce1g] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-413n4dce1g] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-413n4dce1g] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-413n4dce1g] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-413n4dce1g] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-413n4dce1g] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-413n4dce1g] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-413n4dce1g] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-413n4dce1g] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-413n4dce1g] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-413n4dce1g] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.assigned-work-page[b-413n4dce1g]  .hero-add-button,
.assigned-work-page[b-413n4dce1g]  .search-button,
.assigned-work-page[b-413n4dce1g]  .toolbar-add-button,
.assigned-work-page[b-413n4dce1g]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.assigned-work-page[b-413n4dce1g]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-413n4dce1g] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-413n4dce1g] {
    opacity: .55;
    cursor: not-allowed;
}

.assigned-work-page[b-413n4dce1g]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.assigned-work-page[b-413n4dce1g]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-413n4dce1g] {
    margin-top: 7px;
}

.summary-card[b-413n4dce1g] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-413n4dce1g] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-413n4dce1g] {
    color: #2c7da8;
}

.summary-card.pending[b-413n4dce1g] {
    color: #7658a7;
}

.summary-card.urgent[b-413n4dce1g] {
    color: #c05b4e;
}

.summary-line[b-413n4dce1g] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-413n4dce1g] {
    min-width: 0;
}

.summary-card small[b-413n4dce1g] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-413n4dce1g] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-413n4dce1g] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-413n4dce1g] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-413n4dce1g] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-413n4dce1g],
.assigned-work-list-panel[b-413n4dce1g] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-413n4dce1g],
.list-toolbar[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-413n4dce1g],
.panel-kicker[b-413n4dce1g] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-413n4dce1g],
.list-toolbar h2[b-413n4dce1g] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-413n4dce1g],
.list-toolbar p[b-413n4dce1g] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-413n4dce1g] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-413n4dce1g] {
    align-items: center;
}

.assigned-work-page[b-413n4dce1g]  .premium-field,
.assigned-work-page[b-413n4dce1g]  .form-field {
    width: 100%;
}

.assigned-work-page[b-413n4dce1g]  .premium-field .mud-input-outlined-border,
.assigned-work-page[b-413n4dce1g]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.assigned-work-page[b-413n4dce1g]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.assigned-work-page[b-413n4dce1g]  .sort-select {
    width: 170px;
}

.assigned-work-page[b-413n4dce1g]  .toolbar-add-button {
    min-height: 42px;
}

.assigned-work-page[b-413n4dce1g]  .assigned-work-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.assigned-work-page[b-413n4dce1g]  .assigned-work-table .mud-table-head {
    background: #eef6f2;
}

.assigned-work-page[b-413n4dce1g]  .assigned-work-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-413n4dce1g] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-413n4dce1g] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-413n4dce1g],
.mini-photo-empty[b-413n4dce1g] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-413n4dce1g] {
    cursor: zoom-in;
}

.mini-photo-button img[b-413n4dce1g] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-413n4dce1g] {
    object-fit: cover;
}

.mini-photo-button small[b-413n4dce1g] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-413n4dce1g] {
    color: #9c7b38;
}

.applicant-cell[b-413n4dce1g] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-413n4dce1g] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-413n4dce1g],
.applicant-cell small[b-413n4dce1g] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-413n4dce1g] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-413n4dce1g] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-413n4dce1g] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-413n4dce1g],
.channel-chip[b-413n4dce1g],
.priority-chip[b-413n4dce1g],
.status-chip[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-413n4dce1g],
.type-chip.construction[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-413n4dce1g],
.type-chip.food_license[b-413n4dce1g],
.type-chip.tax[b-413n4dce1g] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-413n4dce1g],
.type-chip.environment[b-413n4dce1g] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-413n4dce1g],
.date-cell[b-413n4dce1g] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-413n4dce1g],
.date-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-413n4dce1g],
.date-cell small[b-413n4dce1g] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-413n4dce1g] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-413n4dce1g] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-413n4dce1g] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-413n4dce1g] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-413n4dce1g] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-413n4dce1g] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-413n4dce1g] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.assigned-work-page[b-413n4dce1g]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.assigned-work-page[b-413n4dce1g]  .row-action.view {
    color: #2d79a2;
}

.assigned-work-page[b-413n4dce1g]  .row-action.edit {
    color: var(--theme-primary);
}

.assigned-work-page[b-413n4dce1g]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.assigned-work-page[b-413n4dce1g]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-413n4dce1g] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-413n4dce1g] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-413n4dce1g] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-413n4dce1g] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-413n4dce1g] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.assigned-work-form-modal[b-413n4dce1g],
.assigned-work-view-modal[b-413n4dce1g],
.delete-modal[b-413n4dce1g] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-413n4dce1g .22s ease-out;
}

@keyframes modalAppear-b-413n4dce1g {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.assigned-work-form-modal[b-413n4dce1g] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-413n4dce1g] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-413n4dce1g] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-413n4dce1g] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-413n4dce1g] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-413n4dce1g] {
    margin-top: 24px;
}

.form-section-title > span[b-413n4dce1g] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-413n4dce1g] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-413n4dce1g] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-413n4dce1g] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-413n4dce1g] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-413n4dce1g] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-413n4dce1g] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-413n4dce1g] {
    min-height: 310px;
}

.photo-preview img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-413n4dce1g] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-413n4dce1g] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-413n4dce1g] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-413n4dce1g],
.remove-photo-button[b-413n4dce1g] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-413n4dce1g] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-413n4dce1g] {
    display: none;
}

.remove-photo-button[b-413n4dce1g] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.assigned-work-page[b-413n4dce1g]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.assigned-work-page[b-413n4dce1g]  .cancel-button,
.assigned-work-page[b-413n4dce1g]  .save-button,
.assigned-work-page[b-413n4dce1g]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.assigned-work-page[b-413n4dce1g]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.assigned-work-page[b-413n4dce1g]  .save-button {
    min-width: 170px;
}

.assigned-work-view-modal[b-413n4dce1g] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-413n4dce1g] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-413n4dce1g] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-413n4dce1g] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-413n4dce1g] {
    font-size: 5rem;
}

.view-cover-overlay[b-413n4dce1g] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-413n4dce1g] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-413n4dce1g] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-413n4dce1g] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-413n4dce1g] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-413n4dce1g] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-413n4dce1g] {
    padding: 22px;
}

.view-toolbar[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-413n4dce1g] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-413n4dce1g],
.view-info-grid span[b-413n4dce1g],
.view-description small[b-413n4dce1g],
.attachment-heading small[b-413n4dce1g],
.view-note small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-413n4dce1g] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-413n4dce1g] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-413n4dce1g] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-413n4dce1g] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-413n4dce1g] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-413n4dce1g] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-413n4dce1g] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-413n4dce1g] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-413n4dce1g] {
    background: #f3efe5;
}

.attachment-card img[b-413n4dce1g] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-413n4dce1g] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-413n4dce1g] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-413n4dce1g] {
    font-size: 2.3rem;
}

.view-note[b-413n4dce1g] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-413n4dce1g] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-413n4dce1g] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-413n4dce1g] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-413n4dce1g] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-413n4dce1g] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-413n4dce1g] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-413n4dce1g] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-413n4dce1g] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-413n4dce1g] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-413n4dce1g] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-413n4dce1g] {
    color: #963b36;
}

.delete-warning[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.assigned-work-page[b-413n4dce1g]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .assigned-work-hero[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-413n4dce1g] {
        max-width: 570px;
    }

    .list-toolbar[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-413n4dce1g] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .assigned-work-page[b-413n4dce1g] {
        padding: 15px 12px 30px;
    }

    .assigned-work-hero[b-413n4dce1g] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-413n4dce1g] {
        font-size: 2.3rem;
    }

    .hero-meta[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-413n4dce1g] {
        width: 100%;
    }

    .filter-heading[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }

    .assigned-work-page[b-413n4dce1g]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-413n4dce1g] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-413n4dce1g],
    .attachment-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-413n4dce1g],
    .view-info-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-413n4dce1g] {
        align-items: end;
        padding: 0;
    }

    .assigned-work-form-modal[b-413n4dce1g],
    .assigned-work-view-modal[b-413n4dce1g] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-413n4dce1g] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-413n4dce1g],
    .assigned-work-list-panel[b-413n4dce1g] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-413n4dce1g] {
        align-items: flex-start;
    }

    .modal-icon[b-413n4dce1g] {
        display: none;
    }

    .modal-footer[b-413n4dce1g] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .assigned-work-page[b-413n4dce1g]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-413n4dce1g] {
        padding: 0;
    }

    .image-preview-modal[b-413n4dce1g] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-413n4dce1g],
    .assigned-work-form-modal[b-413n4dce1g],
    .assigned-work-view-modal[b-413n4dce1g],
    .delete-modal[b-413n4dce1g] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-413n4dce1g] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-413n4dce1g],
.status-overview-card.selected[b-413n4dce1g] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-413n4dce1g] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-413n4dce1g] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-413n4dce1g] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-413n4dce1g] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-413n4dce1g] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-413n4dce1g] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-413n4dce1g] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-413n4dce1g] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-413n4dce1g] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-413n4dce1g] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-413n4dce1g],
.complainant-cell small[b-413n4dce1g] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-413n4dce1g] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-413n4dce1g] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-413n4dce1g] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-413n4dce1g] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-413n4dce1g] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-413n4dce1g] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-413n4dce1g] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-413n4dce1g] {
    min-width: 116px;
}

.privacy-chip[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-413n4dce1g] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-413n4dce1g] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-413n4dce1g],
.status-chip.cancelled[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-413n4dce1g] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-413n4dce1g] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-413n4dce1g] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-413n4dce1g] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-413n4dce1g] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-413n4dce1g] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-413n4dce1g] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-413n4dce1g] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-413n4dce1g],
.evidence-preview[b-413n4dce1g] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.assigned-work-view-modal[b-413n4dce1g] {
    width: min(100%, 920px);
}

.desired-resolution[b-413n4dce1g],
.screening-panel[b-413n4dce1g],
.attachment-panel[b-413n4dce1g] {
    margin-top: 15px;
}

.desired-resolution[b-413n4dce1g] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-413n4dce1g],
.screening-panel small[b-413n4dce1g],
.section-heading small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-413n4dce1g],
.screening-panel p[b-413n4dce1g] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-413n4dce1g] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-413n4dce1g] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-413n4dce1g] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-413n4dce1g] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-413n4dce1g] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-413n4dce1g] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-413n4dce1g] {
    background: #f3efe5;
}

.attachment-card img[b-413n4dce1g] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-413n4dce1g] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-413n4dce1g] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-413n4dce1g] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-413n4dce1g] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-413n4dce1g],
    .screening-panel[b-413n4dce1g],
    .attachment-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-413n4dce1g] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-413n4dce1g] {
    background: #aa453e;
}

.summary-card.overdue[b-413n4dce1g],
.summary-card.urgent[b-413n4dce1g] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-413n4dce1g] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-413n4dce1g] {
    min-width: 150px;
}

.progress-heading[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-413n4dce1g] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-413n4dce1g],
.latest-cell[b-413n4dce1g] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-413n4dce1g],
.latest-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-413n4dce1g],
.latest-cell small[b-413n4dce1g] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-413n4dce1g],
.due-cell.overdue small[b-413n4dce1g] {
    color: #b54842;
}

.overdue-chip[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-413n4dce1g] {
    margin-top: 8px;
}

.form-progress-preview[b-413n4dce1g] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-413n4dce1g] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-413n4dce1g],
.history-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-413n4dce1g],
.section-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-413n4dce1g],
.section-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-413n4dce1g],
.section-heading h3[b-413n4dce1g] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-413n4dce1g]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-413n4dce1g] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-413n4dce1g] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-413n4dce1g]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-413n4dce1g] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-413n4dce1g] {
    padding-bottom: 0;
}

.timeline-marker[b-413n4dce1g] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-413n4dce1g] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-413n4dce1g] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-413n4dce1g] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-413n4dce1g] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-413n4dce1g] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-413n4dce1g],
.timeline-item.cancelled .timeline-marker[b-413n4dce1g] {
    background: #aa453e;
}

.timeline-content[b-413n4dce1g] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-413n4dce1g] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-413n4dce1g] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-413n4dce1g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-413n4dce1g] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-413n4dce1g] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-413n4dce1g] {
    color: #2d78a4;
}

.summary-card.progress[b-413n4dce1g] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-413n4dce1g] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-413n4dce1g] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-413n4dce1g] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-413n4dce1g] {
    background: #aa453e;
}

.tracking-number-cell[b-413n4dce1g] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-413n4dce1g] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-413n4dce1g],
.assigned-by-cell[b-413n4dce1g],
.latest-cell[b-413n4dce1g] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-413n4dce1g],
.assigned-by-cell strong[b-413n4dce1g],
.latest-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-413n4dce1g],
.assigned-by-cell small[b-413n4dce1g],
.latest-cell small[b-413n4dce1g] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-413n4dce1g] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-413n4dce1g] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-413n4dce1g],
.status-chip.cancelled[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-413n4dce1g] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-413n4dce1g] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.assigned-work-view-modal[b-413n4dce1g] {
    width: min(100%, 940px);
}

.tracking-banner[b-413n4dce1g] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-413n4dce1g] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-413n4dce1g],
.banner-officer[b-413n4dce1g],
.banner-due[b-413n4dce1g],
.banner-progress[b-413n4dce1g] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-413n4dce1g] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-413n4dce1g] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-413n4dce1g],
.detail-note-grid[b-413n4dce1g],
.history-panel[b-413n4dce1g],
.attachment-panel[b-413n4dce1g] {
    margin-top: 15px;
}

.assignment-instruction[b-413n4dce1g] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-413n4dce1g],
.detail-note-grid small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-413n4dce1g],
.detail-note-grid p[b-413n4dce1g] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-413n4dce1g] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-413n4dce1g] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-413n4dce1g] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-413n4dce1g]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-413n4dce1g],
.timeline-item.cancelled .timeline-marker[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-413n4dce1g],
.evidence-preview[b-413n4dce1g] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-413n4dce1g],
    .detail-note-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-413n4dce1g] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-413n4dce1g] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-413n4dce1g] {
    width: 100%;
}

.available-count-card[b-413n4dce1g] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-413n4dce1g] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-413n4dce1g] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-413n4dce1g] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-413n4dce1g]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-413n4dce1g]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-413n4dce1g] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-413n4dce1g] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-413n4dce1g] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-413n4dce1g] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-413n4dce1g] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-413n4dce1g] {
    font-size: 1.55rem;
}

.picker-photo[b-413n4dce1g] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-413n4dce1g] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-413n4dce1g] {
    font-size: 2rem;
}

.picker-content[b-413n4dce1g] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-413n4dce1g] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-413n4dce1g] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-413n4dce1g] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-413n4dce1g] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-413n4dce1g] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-413n4dce1g] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-413n4dce1g] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-413n4dce1g] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-413n4dce1g] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-413n4dce1g] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-413n4dce1g] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-413n4dce1g] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-413n4dce1g] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-413n4dce1g] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-413n4dce1g] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-413n4dce1g] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-413n4dce1g] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-413n4dce1g] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-413n4dce1g] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-413n4dce1g] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-413n4dce1g] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-413n4dce1g],
    .selected-complaint-panel[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-413n4dce1g] {
        min-height: 220px;
    }

    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-413n4dce1g] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-413n4dce1g] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-413n4dce1g] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-413n4dce1g] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-413n4dce1g] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-413n4dce1g] {
    color: #b47b22;
}

.summary-card.overdue[b-413n4dce1g] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-413n4dce1g] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-413n4dce1g] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-413n4dce1g] {
    background: #75837d;
}

.status-overview-card.completed > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-413n4dce1g] {
    background: #bc4d45;
}

.tracking-number-cell[b-413n4dce1g] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-413n4dce1g] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-413n4dce1g],
.progress-cell[b-413n4dce1g],
.followup-cell[b-413n4dce1g],
.latest-cell[b-413n4dce1g],
.department-cell[b-413n4dce1g] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-413n4dce1g],
.followup-cell strong[b-413n4dce1g],
.latest-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-413n4dce1g],
.followup-cell small[b-413n4dce1g],
.latest-cell small[b-413n4dce1g] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-413n4dce1g] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-413n4dce1g] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-413n4dce1g] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-413n4dce1g] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-413n4dce1g] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-413n4dce1g] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-413n4dce1g] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-413n4dce1g] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-413n4dce1g] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-413n4dce1g] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-413n4dce1g] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-413n4dce1g] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-413n4dce1g] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-413n4dce1g] {
    width: 100%;
}

.source-picker-list[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-413n4dce1g] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-413n4dce1g] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-413n4dce1g] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-413n4dce1g] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-413n4dce1g] {
    display: block;
}

.picker-photo[b-413n4dce1g] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-413n4dce1g] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-413n4dce1g] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-413n4dce1g] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-413n4dce1g] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-413n4dce1g] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-413n4dce1g],
.picker-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-413n4dce1g] {
    gap: 8px 12px;
}

.picker-meta span[b-413n4dce1g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-413n4dce1g] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-413n4dce1g] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-413n4dce1g] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-413n4dce1g] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-413n4dce1g] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-413n4dce1g] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-413n4dce1g] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-413n4dce1g] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-413n4dce1g] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-413n4dce1g] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-413n4dce1g] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-413n4dce1g] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-413n4dce1g] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-413n4dce1g] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-413n4dce1g] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-413n4dce1g] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-413n4dce1g] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-413n4dce1g],
.attachment-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-413n4dce1g] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-413n4dce1g]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-413n4dce1g] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-413n4dce1g] {
    background: #e7f2f9;
}

.attachment-card.after[b-413n4dce1g] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-413n4dce1g],
.after-preview[b-413n4dce1g] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-413n4dce1g],
    .selected-source-panel[b-413n4dce1g],
    .tracking-banner[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-413n4dce1g] {
        min-height: 220px;
    }

    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-413n4dce1g] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-413n4dce1g] {
    color: var(--theme-primary);
}

.summary-card.sla[b-413n4dce1g] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-413n4dce1g] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-413n4dce1g] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-413n4dce1g] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-413n4dce1g] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.assignment-number-cell[b-413n4dce1g] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.assignment-number-cell > span[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-413n4dce1g] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-413n4dce1g] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-413n4dce1g] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-413n4dce1g] {
    font-size: .36rem;
}

.resolution-chip[b-413n4dce1g],
.publication-chip[b-413n4dce1g],
.sla-chip[b-413n4dce1g],
.source-sla-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-413n4dce1g] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-413n4dce1g],
.source-sla-chip.within[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-413n4dce1g],
.source-sla-chip.over[b-413n4dce1g] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-413n4dce1g],
.closed-cell[b-413n4dce1g] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-413n4dce1g],
.closed-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-413n4dce1g],
.closed-cell small[b-413n4dce1g] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-413n4dce1g] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-413n4dce1g] {
    color: #aa453e;
}

.score-cell[b-413n4dce1g] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-413n4dce1g] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-413n4dce1g] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-413n4dce1g] {
    color: #d0a43f;
}

.score-cell small[b-413n4dce1g] {
    color: #8c9893;
    font-size: .47rem;
}

.assigned-work-banner[b-413n4dce1g] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.assigned-work-banner > div[b-413n4dce1g] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.assigned-work-banner .banner-department[b-413n4dce1g] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.assigned-work-banner small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .48rem;
}

.assigned-work-banner strong[b-413n4dce1g] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-413n4dce1g] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-413n4dce1g] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-413n4dce1g] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-413n4dce1g] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-413n4dce1g] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-413n4dce1g] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-413n4dce1g] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-413n4dce1g] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-413n4dce1g] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-413n4dce1g] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-413n4dce1g] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-413n4dce1g] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-413n4dce1g] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-413n4dce1g] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-413n4dce1g] {
    display: block;
}

@media (max-width: 1200px) {
    .assigned-work-banner[b-413n4dce1g],
    .three-columns[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .assigned-work-banner[b-413n4dce1g],
    .three-columns[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-413n4dce1g] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-413n4dce1g] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-413n4dce1g] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-413n4dce1g] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-413n4dce1g] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-413n4dce1g] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.assigned-work-page[b-413n4dce1g]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-413n4dce1g] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-413n4dce1g] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-413n4dce1g] { background: #6e7d77; }
.status-overview-card.assigned > span[b-413n4dce1g] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-413n4dce1g] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-413n4dce1g] { background: #ad721a; }
.status-overview-card.completed > span[b-413n4dce1g] { background: var(--theme-primary); }

.assignment-number-cell[b-413n4dce1g] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.assignment-number-cell > span[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-413n4dce1g] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-413n4dce1g] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-413n4dce1g] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-413n4dce1g] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-413n4dce1g] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-413n4dce1g] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-413n4dce1g],
.schedule-cell[b-413n4dce1g],
.budget-cell[b-413n4dce1g] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-413n4dce1g],
.schedule-cell strong[b-413n4dce1g],
.budget-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-413n4dce1g],
.schedule-cell small[b-413n4dce1g],
.budget-cell small[b-413n4dce1g] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-413n4dce1g],
.schedule-cell.overdue small[b-413n4dce1g] {
    color: #b3463d;
}

.budget-cell strong[b-413n4dce1g] {
    color: #9c7932;
}

.progress-cell[b-413n4dce1g] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-413n4dce1g] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-413n4dce1g] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-413n4dce1g] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-413n4dce1g] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-413n4dce1g] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-413n4dce1g] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-413n4dce1g] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-413n4dce1g] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-413n4dce1g] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-413n4dce1g] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-413n4dce1g] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-413n4dce1g] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-413n4dce1g] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-413n4dce1g] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-413n4dce1g] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-413n4dce1g] {
    display: block;
}

.picker-photo[b-413n4dce1g] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-413n4dce1g] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-413n4dce1g] {
    min-width: 0;
}

.picker-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-413n4dce1g] {
    min-width: 0;
}

.picker-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-413n4dce1g] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-413n4dce1g] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-413n4dce1g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-413n4dce1g] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-413n4dce1g] {
    font-size: .47rem;
}

.selected-source-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-413n4dce1g] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-413n4dce1g] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-413n4dce1g] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-413n4dce1g] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-413n4dce1g] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-413n4dce1g] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-413n4dce1g] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-413n4dce1g] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-413n4dce1g] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.assigned-work-banner[b-413n4dce1g] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.assigned-work-banner > div[b-413n4dce1g] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.assigned-work-banner .banner-technician[b-413n4dce1g] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.assigned-work-banner small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .48rem;
}

.assigned-work-banner strong[b-413n4dce1g] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-413n4dce1g] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-413n4dce1g] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-413n4dce1g] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-413n4dce1g] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-413n4dce1g] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-413n4dce1g] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-413n4dce1g] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-413n4dce1g] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-413n4dce1g] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-413n4dce1g] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-413n4dce1g] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-413n4dce1g] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-413n4dce1g],
.history-meta b[b-413n4dce1g] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-413n4dce1g] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-413n4dce1g] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-413n4dce1g] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-413n4dce1g] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-413n4dce1g] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .assigned-work-banner[b-413n4dce1g],
    .four-columns[b-413n4dce1g] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-413n4dce1g] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .assigned-work-banner[b-413n4dce1g],
    .detail-note-grid[b-413n4dce1g],
    .four-columns[b-413n4dce1g] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-413n4dce1g] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-413n4dce1g] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-413n4dce1g],
    .source-picker-card[b-413n4dce1g],
    .selected-info-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-413n4dce1g] {
        height: 180px;
    }
}


/* =========================================================
   TECHNICIAN ASSIGNED WORK โ€” EDIT ONLY
   ========================================================= */
.summary-card.total[b-413n4dce1g] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.progress[b-413n4dce1g] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-413n4dce1g] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.completed[b-413n4dce1g] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.assigned-work-page[b-413n4dce1g]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.technician-mode-card[b-413n4dce1g] {
    display: flex;
    min-height: 48px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(8, 112, 84, .97),
            rgba(4, 61, 47, .99));

    box-shadow: 0 10px 25px rgba(4, 61, 47, .18);
}

.technician-mode-card > span[b-413n4dce1g] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #5e4314;
    background: #f0d89f;
}

.technician-mode-card > div[b-413n4dce1g] {
    display: flex;
    flex-direction: column;
}

.technician-mode-card strong[b-413n4dce1g] {
    color: #fff;
    font-size: .56rem;
    letter-spacing: .08em;
}

.technician-mode-card small[b-413n4dce1g] {
    margin-top: 1px;
    color: rgba(255, 255, 255, .72);
    font-size: .46rem;
}

.status-overview-card.assigned > span[b-413n4dce1g] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.status-overview-card.in-progress > span[b-413n4dce1g] {
    background: #7658a7;
}

.status-overview-card.waiting-part > span[b-413n4dce1g] {
    background: #ad721a;
}

.status-overview-card.completed > span[b-413n4dce1g] {
    background: var(--theme-primary);
}

.assignment-number-cell[b-413n4dce1g] {
    display: flex;
    min-width: 152px;
    flex-direction: column;
}

.assignment-number-cell > span[b-413n4dce1g] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.assignment-number-cell small[b-413n4dce1g] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.assignment-number-cell em[b-413n4dce1g] {
    margin-top: 2px;

    color: #87958f;
    font-size: .43rem;
    font-style: normal;
}

.cost-cell[b-413n4dce1g] {
    display: flex;
    min-width: 112px;
    flex-direction: column;
}

.cost-cell strong[b-413n4dce1g] {
    color: #9c7932;
    font-size: .62rem;
}

.cost-cell small[b-413n4dce1g] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.assigned-work-page[b-413n4dce1g]  .technician-edit-button {
    min-width: 86px;

    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    box-shadow:
        0 8px 18px rgba(5, 82, 62, .18);

    font-family: 'Kanit', sans-serif !important;
    font-size: .48rem !important;
    font-weight: 650 !important;
}

.assigned-work-page[b-413n4dce1g]  .technician-edit-button:hover {
    transform: translateY(-1px);
    box-shadow:
        0 11px 24px rgba(5, 82, 62, .24);
}

.locked-assignment-panel[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 15px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .12),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-cover[b-413n4dce1g] {
    display: grid;
    min-height: 205px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #8fa199;
    background: #e9f0ed;
}

.locked-cover img[b-413n4dce1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-content[b-413n4dce1g] {
    min-width: 0;
}

.locked-heading[b-413n4dce1g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-heading small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-heading h3[b-413n4dce1g] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .86rem;
}

.locked-heading p[b-413n4dce1g] {
    margin: 3px 0 0;

    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.locked-badges[b-413n4dce1g] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-413n4dce1g] {
    margin: 10px 0 0;

    color: #61756d;
    font-size: .58rem;
    line-height: 1.75;
}

.locked-info-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.locked-info-grid > div[b-413n4dce1g] {
    min-height: 60px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.locked-info-grid span[b-413n4dce1g] {
    display: block;

    color: var(--theme-muted);
    font-size: .42rem;
}

.locked-info-grid strong[b-413n4dce1g] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.45;
}

.instruction-readonly-panel[b-413n4dce1g] {
    margin-bottom: 16px;
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .17);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .13),
            transparent 20rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-readonly-panel > div:first-child > small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.instruction-readonly-panel h3[b-413n4dce1g] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .77rem;
}

.instruction-readonly-panel > div:first-child > p[b-413n4dce1g] {
    margin: 8px 0 0;

    color: #5f746c;
    font-size: .57rem;
    line-height: 1.75;
}

.instruction-grid[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 12px;
}

.instruction-grid article[b-413n4dce1g] {
    display: grid;
    grid-template-columns: 35px minmax(0, 1fr);

    gap: 8px;
    min-height: 92px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: rgba(255, 255, 255, .86);
}

.instruction-grid article > span[b-413n4dce1g] {
    display: grid;
    width: 35px;
    height: 35px;

    place-items: center;
    border-radius: 10px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.instruction-grid small[b-413n4dce1g] {
    color: #9c7932;
    font-size: .43rem;
    font-weight: 700;
}

.instruction-grid p[b-413n4dce1g] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.6;
}

.progress-preview-card[b-413n4dce1g] {
    display: flex;
    min-height: 56px;

    justify-content: center;
    flex-direction: column;
    gap: 7px;

    padding: 7px 11px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.progress-preview-card > div[b-413n4dce1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.progress-preview-card small[b-413n4dce1g] {
    color: #87958f;
    font-size: .45rem;
}

.progress-preview-card strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: .72rem;
}

.photo-source-strip[b-413n4dce1g] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 12px;
}

.photo-source-strip > button[b-413n4dce1g] {
    position: relative;

    min-height: 145px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: #edf3f0;
    cursor: pointer;
}

.photo-source-strip img[b-413n4dce1g] {
    width: 100%;
    height: 145px;
    object-fit: cover;
}

.photo-source-strip button > span[b-413n4dce1g] {
    position: absolute;
    right: 8px;
    bottom: 8px;

    padding: 5px 8px;

    border-radius: 8px;

    color: #fff;
    background: rgba(3, 50, 39, .78);

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
}

.source-photo-empty[b-413n4dce1g] {
    display: flex;
    grid-column: 1 / -1;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #8b9b94;
    background: #f6f9f7;
}

.source-photo-empty span[b-413n4dce1g] {
    font-size: .48rem;
}

.assigned-work-banner[b-413n4dce1g] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.2fr)
        minmax(160px, .8fr)
        minmax(145px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.assigned-work-banner > div[b-413n4dce1g] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.assigned-work-banner .banner-technician[b-413n4dce1g] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));

    box-shadow:
        0 9px 21px rgba(4, 61, 47, .18);
}

.assigned-work-banner small[b-413n4dce1g] {
    color: #8b9993;
    font-size: .48rem;
}

.assigned-work-banner strong[b-413n4dce1g] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-413n4dce1g] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.location-panel[b-413n4dce1g] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 13px;
    padding: 15px;

    border: 1px solid rgba(45, 120, 164, .15);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 17rem),
        #f5fafc;
}

.location-panel small[b-413n4dce1g] {
    color: #2d78a4;
    font-size: .47rem;
    font-weight: 700;
}

.location-panel h3[b-413n4dce1g] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.location-panel p[b-413n4dce1g] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .53rem;
    line-height: 1.6;
}

.location-panel > span[b-413n4dce1g] {
    display: grid;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;

    place-items: center;
    border-radius: 17px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

@media (max-width: 1100px) {
    .locked-assignment-panel[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .locked-cover[b-413n4dce1g] {
        max-height: 300px;
    }

    .instruction-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .assigned-work-banner[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .locked-info-grid[b-413n4dce1g] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .photo-source-strip[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .assigned-work-banner[b-413n4dce1g],
    .locked-info-grid[b-413n4dce1g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .locked-heading[b-413n4dce1g] {
        flex-direction: column;
    }

    .locked-badges[b-413n4dce1g] {
        justify-content: flex-start;
    }

    .technician-mode-card[b-413n4dce1g] {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/05repairs/TechnicianWorkOrders.razor.rz.scp.css */
.workorder-page[b-qitbvg6aic] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.workorder-page[b-qitbvg6aic]  .workorder-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.workorder-hero[b-qitbvg6aic] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-qitbvg6aic] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-qitbvg6aic] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-qitbvg6aic] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-qitbvg6aic] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-qitbvg6aic] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-qitbvg6aic] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-qitbvg6aic] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-qitbvg6aic] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-qitbvg6aic] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-qitbvg6aic] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-qitbvg6aic] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.workorder-page[b-qitbvg6aic]  .hero-add-button,
.workorder-page[b-qitbvg6aic]  .search-button,
.workorder-page[b-qitbvg6aic]  .toolbar-add-button,
.workorder-page[b-qitbvg6aic]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.workorder-page[b-qitbvg6aic]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-qitbvg6aic] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-qitbvg6aic] {
    opacity: .55;
    cursor: not-allowed;
}

.workorder-page[b-qitbvg6aic]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.workorder-page[b-qitbvg6aic]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-qitbvg6aic] {
    margin-top: 7px;
}

.summary-card[b-qitbvg6aic] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-qitbvg6aic] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-qitbvg6aic] {
    color: #2c7da8;
}

.summary-card.pending[b-qitbvg6aic] {
    color: #7658a7;
}

.summary-card.urgent[b-qitbvg6aic] {
    color: #c05b4e;
}

.summary-line[b-qitbvg6aic] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-qitbvg6aic] {
    min-width: 0;
}

.summary-card small[b-qitbvg6aic] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-qitbvg6aic] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-qitbvg6aic] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-qitbvg6aic] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-qitbvg6aic] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-qitbvg6aic],
.workorder-list-panel[b-qitbvg6aic] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-qitbvg6aic],
.list-toolbar[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-qitbvg6aic],
.panel-kicker[b-qitbvg6aic] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-qitbvg6aic],
.list-toolbar h2[b-qitbvg6aic] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-qitbvg6aic],
.list-toolbar p[b-qitbvg6aic] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-qitbvg6aic] {
    align-items: center;
}

.workorder-page[b-qitbvg6aic]  .premium-field,
.workorder-page[b-qitbvg6aic]  .form-field {
    width: 100%;
}

.workorder-page[b-qitbvg6aic]  .premium-field .mud-input-outlined-border,
.workorder-page[b-qitbvg6aic]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.workorder-page[b-qitbvg6aic]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.workorder-page[b-qitbvg6aic]  .sort-select {
    width: 170px;
}

.workorder-page[b-qitbvg6aic]  .toolbar-add-button {
    min-height: 42px;
}

.workorder-page[b-qitbvg6aic]  .workorder-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.workorder-page[b-qitbvg6aic]  .workorder-table .mud-table-head {
    background: #eef6f2;
}

.workorder-page[b-qitbvg6aic]  .workorder-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-qitbvg6aic] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-qitbvg6aic],
.mini-photo-empty[b-qitbvg6aic] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-qitbvg6aic] {
    cursor: zoom-in;
}

.mini-photo-button img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-qitbvg6aic] {
    object-fit: cover;
}

.mini-photo-button small[b-qitbvg6aic] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-qitbvg6aic] {
    color: #9c7b38;
}

.applicant-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-qitbvg6aic],
.applicant-cell small[b-qitbvg6aic] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-qitbvg6aic] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-qitbvg6aic] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-qitbvg6aic],
.channel-chip[b-qitbvg6aic],
.priority-chip[b-qitbvg6aic],
.status-chip[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-qitbvg6aic],
.type-chip.construction[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-qitbvg6aic],
.type-chip.food_license[b-qitbvg6aic],
.type-chip.tax[b-qitbvg6aic] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-qitbvg6aic],
.type-chip.environment[b-qitbvg6aic] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-qitbvg6aic],
.date-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-qitbvg6aic],
.date-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-qitbvg6aic],
.date-cell small[b-qitbvg6aic] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-qitbvg6aic] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-qitbvg6aic] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-qitbvg6aic] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-qitbvg6aic] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-qitbvg6aic] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-qitbvg6aic] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-qitbvg6aic] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.workorder-page[b-qitbvg6aic]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.workorder-page[b-qitbvg6aic]  .row-action.view {
    color: #2d79a2;
}

.workorder-page[b-qitbvg6aic]  .row-action.edit {
    color: var(--theme-primary);
}

.workorder-page[b-qitbvg6aic]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.workorder-page[b-qitbvg6aic]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-qitbvg6aic] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-qitbvg6aic] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-qitbvg6aic] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-qitbvg6aic] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-qitbvg6aic] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.workorder-form-modal[b-qitbvg6aic],
.workorder-view-modal[b-qitbvg6aic],
.delete-modal[b-qitbvg6aic] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-qitbvg6aic .22s ease-out;
}

@keyframes modalAppear-b-qitbvg6aic {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.workorder-form-modal[b-qitbvg6aic] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-qitbvg6aic] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-qitbvg6aic] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-qitbvg6aic] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-qitbvg6aic] {
    margin-top: 24px;
}

.form-section-title > span[b-qitbvg6aic] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-qitbvg6aic] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-qitbvg6aic] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-qitbvg6aic] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-qitbvg6aic] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-qitbvg6aic] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-qitbvg6aic] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-qitbvg6aic] {
    min-height: 310px;
}

.photo-preview img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-qitbvg6aic] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-qitbvg6aic] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-qitbvg6aic] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-qitbvg6aic],
.remove-photo-button[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-qitbvg6aic] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-qitbvg6aic] {
    display: none;
}

.remove-photo-button[b-qitbvg6aic] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.workorder-page[b-qitbvg6aic]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.workorder-page[b-qitbvg6aic]  .cancel-button,
.workorder-page[b-qitbvg6aic]  .save-button,
.workorder-page[b-qitbvg6aic]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.workorder-page[b-qitbvg6aic]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.workorder-page[b-qitbvg6aic]  .save-button {
    min-width: 170px;
}

.workorder-view-modal[b-qitbvg6aic] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-qitbvg6aic] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-qitbvg6aic] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-qitbvg6aic] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-qitbvg6aic] {
    font-size: 5rem;
}

.view-cover-overlay[b-qitbvg6aic] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-qitbvg6aic] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-qitbvg6aic] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-qitbvg6aic] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-qitbvg6aic] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-qitbvg6aic] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-qitbvg6aic] {
    padding: 22px;
}

.view-toolbar[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-qitbvg6aic] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-qitbvg6aic],
.view-info-grid span[b-qitbvg6aic],
.view-description small[b-qitbvg6aic],
.attachment-heading small[b-qitbvg6aic],
.view-note small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-qitbvg6aic] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-qitbvg6aic] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-qitbvg6aic] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-qitbvg6aic] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-qitbvg6aic] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-qitbvg6aic] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-qitbvg6aic] {
    background: #f3efe5;
}

.attachment-card img[b-qitbvg6aic] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-qitbvg6aic] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-qitbvg6aic] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-qitbvg6aic] {
    font-size: 2.3rem;
}

.view-note[b-qitbvg6aic] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-qitbvg6aic] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-qitbvg6aic] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-qitbvg6aic] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-qitbvg6aic] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-qitbvg6aic] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-qitbvg6aic] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-qitbvg6aic] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-qitbvg6aic] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-qitbvg6aic] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-qitbvg6aic] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-qitbvg6aic] {
    color: #963b36;
}

.delete-warning[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.workorder-page[b-qitbvg6aic]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .workorder-hero[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-qitbvg6aic] {
        max-width: 570px;
    }

    .list-toolbar[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-qitbvg6aic] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .workorder-page[b-qitbvg6aic] {
        padding: 15px 12px 30px;
    }

    .workorder-hero[b-qitbvg6aic] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-qitbvg6aic] {
        font-size: 2.3rem;
    }

    .hero-meta[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-qitbvg6aic] {
        width: 100%;
    }

    .filter-heading[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }

    .workorder-page[b-qitbvg6aic]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-qitbvg6aic] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-qitbvg6aic],
    .attachment-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-qitbvg6aic],
    .view-info-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-qitbvg6aic] {
        align-items: end;
        padding: 0;
    }

    .workorder-form-modal[b-qitbvg6aic],
    .workorder-view-modal[b-qitbvg6aic] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-qitbvg6aic] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-qitbvg6aic],
    .workorder-list-panel[b-qitbvg6aic] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-qitbvg6aic] {
        align-items: flex-start;
    }

    .modal-icon[b-qitbvg6aic] {
        display: none;
    }

    .modal-footer[b-qitbvg6aic] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .workorder-page[b-qitbvg6aic]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-qitbvg6aic] {
        padding: 0;
    }

    .image-preview-modal[b-qitbvg6aic] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-qitbvg6aic],
    .workorder-form-modal[b-qitbvg6aic],
    .workorder-view-modal[b-qitbvg6aic],
    .delete-modal[b-qitbvg6aic] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-qitbvg6aic] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-qitbvg6aic],
.status-overview-card.selected[b-qitbvg6aic] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-qitbvg6aic] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-qitbvg6aic] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-qitbvg6aic] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-qitbvg6aic] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-qitbvg6aic] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-qitbvg6aic] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-qitbvg6aic] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-qitbvg6aic] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-qitbvg6aic],
.complainant-cell small[b-qitbvg6aic] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-qitbvg6aic] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-qitbvg6aic] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-qitbvg6aic] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-qitbvg6aic] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-qitbvg6aic] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-qitbvg6aic] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-qitbvg6aic] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-qitbvg6aic] {
    min-width: 116px;
}

.privacy-chip[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-qitbvg6aic] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-qitbvg6aic] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-qitbvg6aic],
.status-chip.cancelled[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-qitbvg6aic] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-qitbvg6aic] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-qitbvg6aic] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-qitbvg6aic] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-qitbvg6aic] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-qitbvg6aic] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-qitbvg6aic] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-qitbvg6aic],
.evidence-preview[b-qitbvg6aic] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.workorder-view-modal[b-qitbvg6aic] {
    width: min(100%, 920px);
}

.desired-resolution[b-qitbvg6aic],
.screening-panel[b-qitbvg6aic],
.attachment-panel[b-qitbvg6aic] {
    margin-top: 15px;
}

.desired-resolution[b-qitbvg6aic] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-qitbvg6aic],
.screening-panel small[b-qitbvg6aic],
.section-heading small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-qitbvg6aic],
.screening-panel p[b-qitbvg6aic] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-qitbvg6aic] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-qitbvg6aic] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-qitbvg6aic] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-qitbvg6aic] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-qitbvg6aic] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-qitbvg6aic] {
    background: #f3efe5;
}

.attachment-card img[b-qitbvg6aic] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-qitbvg6aic] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-qitbvg6aic] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-qitbvg6aic] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-qitbvg6aic] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-qitbvg6aic],
    .screening-panel[b-qitbvg6aic],
    .attachment-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-qitbvg6aic] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-qitbvg6aic] {
    background: #aa453e;
}

.summary-card.overdue[b-qitbvg6aic],
.summary-card.urgent[b-qitbvg6aic] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-qitbvg6aic] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-qitbvg6aic] {
    min-width: 150px;
}

.progress-heading[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-qitbvg6aic] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-qitbvg6aic],
.latest-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-qitbvg6aic],
.latest-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-qitbvg6aic],
.latest-cell small[b-qitbvg6aic] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-qitbvg6aic],
.due-cell.overdue small[b-qitbvg6aic] {
    color: #b54842;
}

.overdue-chip[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-qitbvg6aic] {
    margin-top: 8px;
}

.form-progress-preview[b-qitbvg6aic] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-qitbvg6aic] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-qitbvg6aic],
.history-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-qitbvg6aic],
.section-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-qitbvg6aic],
.section-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-qitbvg6aic],
.section-heading h3[b-qitbvg6aic] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-qitbvg6aic]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-qitbvg6aic] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-qitbvg6aic] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-qitbvg6aic]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-qitbvg6aic] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-qitbvg6aic] {
    padding-bottom: 0;
}

.timeline-marker[b-qitbvg6aic] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-qitbvg6aic] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-qitbvg6aic] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-qitbvg6aic] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-qitbvg6aic] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-qitbvg6aic],
.timeline-item.cancelled .timeline-marker[b-qitbvg6aic] {
    background: #aa453e;
}

.timeline-content[b-qitbvg6aic] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-qitbvg6aic] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-qitbvg6aic] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-qitbvg6aic] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-qitbvg6aic] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-qitbvg6aic] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-qitbvg6aic] {
    color: #2d78a4;
}

.summary-card.progress[b-qitbvg6aic] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-qitbvg6aic] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-qitbvg6aic] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-qitbvg6aic] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-qitbvg6aic] {
    background: #aa453e;
}

.tracking-number-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-qitbvg6aic] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-qitbvg6aic],
.assigned-by-cell[b-qitbvg6aic],
.latest-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-qitbvg6aic],
.assigned-by-cell strong[b-qitbvg6aic],
.latest-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-qitbvg6aic],
.assigned-by-cell small[b-qitbvg6aic],
.latest-cell small[b-qitbvg6aic] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-qitbvg6aic] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-qitbvg6aic],
.status-chip.cancelled[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-qitbvg6aic] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-qitbvg6aic] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.workorder-view-modal[b-qitbvg6aic] {
    width: min(100%, 940px);
}

.tracking-banner[b-qitbvg6aic] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-qitbvg6aic] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-qitbvg6aic],
.banner-officer[b-qitbvg6aic],
.banner-due[b-qitbvg6aic],
.banner-progress[b-qitbvg6aic] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-qitbvg6aic] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-qitbvg6aic] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-qitbvg6aic],
.detail-note-grid[b-qitbvg6aic],
.history-panel[b-qitbvg6aic],
.attachment-panel[b-qitbvg6aic] {
    margin-top: 15px;
}

.assignment-instruction[b-qitbvg6aic] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-qitbvg6aic],
.detail-note-grid small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-qitbvg6aic],
.detail-note-grid p[b-qitbvg6aic] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-qitbvg6aic] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-qitbvg6aic] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-qitbvg6aic] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-qitbvg6aic]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-qitbvg6aic],
.timeline-item.cancelled .timeline-marker[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-qitbvg6aic],
.evidence-preview[b-qitbvg6aic] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-qitbvg6aic],
    .detail-note-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-qitbvg6aic] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-qitbvg6aic] {
    width: 100%;
}

.available-count-card[b-qitbvg6aic] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-qitbvg6aic] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-qitbvg6aic] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-qitbvg6aic] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-qitbvg6aic]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-qitbvg6aic]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-qitbvg6aic] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-qitbvg6aic] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-qitbvg6aic] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-qitbvg6aic] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-qitbvg6aic] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-qitbvg6aic] {
    font-size: 1.55rem;
}

.picker-photo[b-qitbvg6aic] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-qitbvg6aic] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-qitbvg6aic] {
    font-size: 2rem;
}

.picker-content[b-qitbvg6aic] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-qitbvg6aic] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-qitbvg6aic] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-qitbvg6aic] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-qitbvg6aic] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-qitbvg6aic] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-qitbvg6aic] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-qitbvg6aic] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-qitbvg6aic] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-qitbvg6aic] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-qitbvg6aic] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-qitbvg6aic] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-qitbvg6aic] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-qitbvg6aic] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-qitbvg6aic] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-qitbvg6aic] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-qitbvg6aic] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-qitbvg6aic] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-qitbvg6aic] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-qitbvg6aic] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-qitbvg6aic] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-qitbvg6aic] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-qitbvg6aic],
    .selected-complaint-panel[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-qitbvg6aic] {
        min-height: 220px;
    }

    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-qitbvg6aic] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-qitbvg6aic] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-qitbvg6aic] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-qitbvg6aic] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-qitbvg6aic] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-qitbvg6aic] {
    color: #b47b22;
}

.summary-card.overdue[b-qitbvg6aic] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-qitbvg6aic] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-qitbvg6aic] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-qitbvg6aic] {
    background: #75837d;
}

.status-overview-card.completed > span[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-qitbvg6aic] {
    background: #bc4d45;
}

.tracking-number-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-qitbvg6aic] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-qitbvg6aic],
.progress-cell[b-qitbvg6aic],
.followup-cell[b-qitbvg6aic],
.latest-cell[b-qitbvg6aic],
.department-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-qitbvg6aic],
.followup-cell strong[b-qitbvg6aic],
.latest-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-qitbvg6aic],
.followup-cell small[b-qitbvg6aic],
.latest-cell small[b-qitbvg6aic] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-qitbvg6aic] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-qitbvg6aic] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-qitbvg6aic] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-qitbvg6aic] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-qitbvg6aic] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-qitbvg6aic] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-qitbvg6aic] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-qitbvg6aic] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-qitbvg6aic] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-qitbvg6aic] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-qitbvg6aic] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-qitbvg6aic] {
    width: 100%;
}

.source-picker-list[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-qitbvg6aic] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-qitbvg6aic] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-qitbvg6aic] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-qitbvg6aic] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-qitbvg6aic] {
    display: block;
}

.picker-photo[b-qitbvg6aic] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-qitbvg6aic] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-qitbvg6aic] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-qitbvg6aic] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-qitbvg6aic] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-qitbvg6aic] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-qitbvg6aic],
.picker-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-qitbvg6aic] {
    gap: 8px 12px;
}

.picker-meta span[b-qitbvg6aic] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-qitbvg6aic] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-qitbvg6aic] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-qitbvg6aic] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-qitbvg6aic] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-qitbvg6aic] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-qitbvg6aic] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-qitbvg6aic] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-qitbvg6aic] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-qitbvg6aic] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-qitbvg6aic] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-qitbvg6aic] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-qitbvg6aic] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-qitbvg6aic] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-qitbvg6aic] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-qitbvg6aic] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-qitbvg6aic] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-qitbvg6aic] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-qitbvg6aic],
.attachment-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-qitbvg6aic] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-qitbvg6aic]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-qitbvg6aic] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-qitbvg6aic] {
    background: #e7f2f9;
}

.attachment-card.after[b-qitbvg6aic] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-qitbvg6aic],
.after-preview[b-qitbvg6aic] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-qitbvg6aic],
    .selected-source-panel[b-qitbvg6aic],
    .tracking-banner[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-qitbvg6aic] {
        min-height: 220px;
    }

    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-qitbvg6aic] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-qitbvg6aic] {
    color: var(--theme-primary);
}

.summary-card.sla[b-qitbvg6aic] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-qitbvg6aic] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-qitbvg6aic] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-qitbvg6aic] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-qitbvg6aic] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-qitbvg6aic] {
    background: var(--theme-primary);
}

.workorder-number-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.workorder-number-cell > span[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.workorder-number-cell small[b-qitbvg6aic] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-qitbvg6aic] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-qitbvg6aic] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-qitbvg6aic] {
    font-size: .36rem;
}

.resolution-chip[b-qitbvg6aic],
.publication-chip[b-qitbvg6aic],
.sla-chip[b-qitbvg6aic],
.source-sla-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-qitbvg6aic] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-qitbvg6aic],
.source-sla-chip.within[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-qitbvg6aic],
.source-sla-chip.over[b-qitbvg6aic] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-qitbvg6aic],
.closed-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-qitbvg6aic],
.closed-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-qitbvg6aic],
.closed-cell small[b-qitbvg6aic] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-qitbvg6aic] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-qitbvg6aic] {
    color: #aa453e;
}

.score-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-qitbvg6aic] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-qitbvg6aic] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-qitbvg6aic] {
    color: #d0a43f;
}

.score-cell small[b-qitbvg6aic] {
    color: #8c9893;
    font-size: .47rem;
}

.workorder-banner[b-qitbvg6aic] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.workorder-banner > div[b-qitbvg6aic] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.workorder-banner .banner-department[b-qitbvg6aic] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.workorder-banner small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .48rem;
}

.workorder-banner strong[b-qitbvg6aic] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-qitbvg6aic] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-qitbvg6aic] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-qitbvg6aic] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-qitbvg6aic] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-qitbvg6aic] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-qitbvg6aic] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-qitbvg6aic] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-qitbvg6aic] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-qitbvg6aic] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-qitbvg6aic] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-qitbvg6aic] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-qitbvg6aic] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-qitbvg6aic] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-qitbvg6aic] {
    display: block;
}

@media (max-width: 1200px) {
    .workorder-banner[b-qitbvg6aic],
    .three-columns[b-qitbvg6aic] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .workorder-banner[b-qitbvg6aic],
    .three-columns[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-qitbvg6aic] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-qitbvg6aic] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-qitbvg6aic] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-qitbvg6aic] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-qitbvg6aic] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-qitbvg6aic] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-qitbvg6aic] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.workorder-page[b-qitbvg6aic]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-qitbvg6aic] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-qitbvg6aic] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-qitbvg6aic] { background: #6e7d77; }
.status-overview-card.assigned > span[b-qitbvg6aic] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-qitbvg6aic] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-qitbvg6aic] { background: #ad721a; }
.status-overview-card.completed > span[b-qitbvg6aic] { background: var(--theme-primary); }

.workorder-number-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.workorder-number-cell > span[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.workorder-number-cell small[b-qitbvg6aic] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-qitbvg6aic] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-qitbvg6aic] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-qitbvg6aic] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-qitbvg6aic] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-qitbvg6aic] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-qitbvg6aic],
.schedule-cell[b-qitbvg6aic],
.budget-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-qitbvg6aic],
.schedule-cell strong[b-qitbvg6aic],
.budget-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-qitbvg6aic],
.schedule-cell small[b-qitbvg6aic],
.budget-cell small[b-qitbvg6aic] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-qitbvg6aic] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-qitbvg6aic],
.schedule-cell.overdue small[b-qitbvg6aic] {
    color: #b3463d;
}

.budget-cell strong[b-qitbvg6aic] {
    color: #9c7932;
}

.progress-cell[b-qitbvg6aic] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-qitbvg6aic] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-qitbvg6aic] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-qitbvg6aic] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-qitbvg6aic] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-qitbvg6aic] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-qitbvg6aic] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-qitbvg6aic] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-qitbvg6aic] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-qitbvg6aic] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-qitbvg6aic] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-qitbvg6aic] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-qitbvg6aic] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-qitbvg6aic] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-qitbvg6aic] {
    display: block;
}

.picker-photo[b-qitbvg6aic] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-qitbvg6aic] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-qitbvg6aic] {
    min-width: 0;
}

.picker-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-qitbvg6aic] {
    min-width: 0;
}

.picker-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-qitbvg6aic] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-qitbvg6aic] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-qitbvg6aic] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-qitbvg6aic] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-qitbvg6aic] {
    font-size: .47rem;
}

.selected-source-panel[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-qitbvg6aic] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-qitbvg6aic] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-qitbvg6aic] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-qitbvg6aic] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-qitbvg6aic] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-qitbvg6aic] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-qitbvg6aic] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-qitbvg6aic] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-qitbvg6aic] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-qitbvg6aic] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-qitbvg6aic] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.workorder-banner[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.workorder-banner > div[b-qitbvg6aic] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.workorder-banner .banner-technician[b-qitbvg6aic] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-qitbvg6aic] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.workorder-banner small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .48rem;
}

.workorder-banner strong[b-qitbvg6aic] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-qitbvg6aic] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-qitbvg6aic] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-qitbvg6aic] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-qitbvg6aic] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-qitbvg6aic] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-qitbvg6aic] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-qitbvg6aic] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-qitbvg6aic] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-qitbvg6aic] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-qitbvg6aic] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-qitbvg6aic] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-qitbvg6aic] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-qitbvg6aic] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-qitbvg6aic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-qitbvg6aic] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-qitbvg6aic] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-qitbvg6aic] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-qitbvg6aic] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-qitbvg6aic],
.history-meta b[b-qitbvg6aic] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-qitbvg6aic] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-qitbvg6aic] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-qitbvg6aic] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-qitbvg6aic] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-qitbvg6aic] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .workorder-banner[b-qitbvg6aic],
    .four-columns[b-qitbvg6aic] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-qitbvg6aic] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .workorder-banner[b-qitbvg6aic],
    .detail-note-grid[b-qitbvg6aic],
    .four-columns[b-qitbvg6aic] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-qitbvg6aic] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-qitbvg6aic] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-qitbvg6aic],
    .source-picker-card[b-qitbvg6aic],
    .selected-info-grid[b-qitbvg6aic] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-qitbvg6aic] {
        height: 180px;
    }
}
/* /Components/Pages/01Ziticen/06Emergency/EmergencyCenter.razor.rz.scp.css */
.emergency-center-page[b-gdm8yiae6u] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.emergency-center-page[b-gdm8yiae6u]  .emergency-center-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.emergency-hero[b-gdm8yiae6u] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-gdm8yiae6u] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-gdm8yiae6u] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-gdm8yiae6u] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-gdm8yiae6u] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-gdm8yiae6u] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-gdm8yiae6u] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-gdm8yiae6u] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-gdm8yiae6u] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-gdm8yiae6u] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-gdm8yiae6u] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.emergency-center-page[b-gdm8yiae6u]  .hero-add-button,
.emergency-center-page[b-gdm8yiae6u]  .search-button,
.emergency-center-page[b-gdm8yiae6u]  .toolbar-add-button,
.emergency-center-page[b-gdm8yiae6u]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.emergency-center-page[b-gdm8yiae6u]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-gdm8yiae6u] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-gdm8yiae6u] {
    opacity: .55;
    cursor: not-allowed;
}

.emergency-center-page[b-gdm8yiae6u]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.emergency-center-page[b-gdm8yiae6u]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-gdm8yiae6u] {
    margin-top: 7px;
}

.summary-card[b-gdm8yiae6u] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-gdm8yiae6u] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-gdm8yiae6u] {
    color: #2c7da8;
}

.summary-card.pending[b-gdm8yiae6u] {
    color: #7658a7;
}

.summary-card.urgent[b-gdm8yiae6u] {
    color: #c05b4e;
}

.summary-line[b-gdm8yiae6u] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-gdm8yiae6u] {
    min-width: 0;
}

.summary-card small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-gdm8yiae6u] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-gdm8yiae6u] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-gdm8yiae6u] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-gdm8yiae6u],
.incident-list-panel[b-gdm8yiae6u] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-gdm8yiae6u],
.list-toolbar[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-gdm8yiae6u],
.panel-kicker[b-gdm8yiae6u] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-gdm8yiae6u],
.list-toolbar h2[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-gdm8yiae6u],
.list-toolbar p[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-gdm8yiae6u] {
    align-items: center;
}

.emergency-center-page[b-gdm8yiae6u]  .premium-field,
.emergency-center-page[b-gdm8yiae6u]  .form-field {
    width: 100%;
}

.emergency-center-page[b-gdm8yiae6u]  .premium-field .mud-input-outlined-border,
.emergency-center-page[b-gdm8yiae6u]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.emergency-center-page[b-gdm8yiae6u]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.emergency-center-page[b-gdm8yiae6u]  .sort-select {
    width: 170px;
}

.emergency-center-page[b-gdm8yiae6u]  .toolbar-add-button {
    min-height: 42px;
}

.emergency-center-page[b-gdm8yiae6u]  .incident-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.emergency-center-page[b-gdm8yiae6u]  .incident-table .mud-table-head {
    background: #eef6f2;
}

.emergency-center-page[b-gdm8yiae6u]  .incident-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-gdm8yiae6u] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-gdm8yiae6u],
.mini-photo-empty[b-gdm8yiae6u] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-gdm8yiae6u] {
    cursor: zoom-in;
}

.mini-photo-button img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-gdm8yiae6u] {
    object-fit: cover;
}

.mini-photo-button small[b-gdm8yiae6u] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-gdm8yiae6u] {
    color: #9c7b38;
}

.applicant-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-gdm8yiae6u],
.applicant-cell small[b-gdm8yiae6u] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-gdm8yiae6u] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-gdm8yiae6u],
.channel-chip[b-gdm8yiae6u],
.priority-chip[b-gdm8yiae6u],
.status-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-gdm8yiae6u],
.type-chip.construction[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-gdm8yiae6u],
.type-chip.food_license[b-gdm8yiae6u],
.type-chip.tax[b-gdm8yiae6u] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-gdm8yiae6u],
.type-chip.environment[b-gdm8yiae6u] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-gdm8yiae6u],
.date-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-gdm8yiae6u],
.date-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-gdm8yiae6u],
.date-cell small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-gdm8yiae6u] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-gdm8yiae6u] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-gdm8yiae6u] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-gdm8yiae6u] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-gdm8yiae6u] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-gdm8yiae6u] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-gdm8yiae6u] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.emergency-center-page[b-gdm8yiae6u]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.emergency-center-page[b-gdm8yiae6u]  .row-action.view {
    color: #2d79a2;
}

.emergency-center-page[b-gdm8yiae6u]  .row-action.edit {
    color: var(--theme-primary);
}

.emergency-center-page[b-gdm8yiae6u]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.emergency-center-page[b-gdm8yiae6u]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-gdm8yiae6u] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-gdm8yiae6u] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-gdm8yiae6u] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-gdm8yiae6u] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-gdm8yiae6u] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.incident-form-modal[b-gdm8yiae6u],
.incident-view-modal[b-gdm8yiae6u],
.delete-modal[b-gdm8yiae6u] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-gdm8yiae6u .22s ease-out;
}

@keyframes modalAppear-b-gdm8yiae6u {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.incident-form-modal[b-gdm8yiae6u] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-gdm8yiae6u] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-gdm8yiae6u] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-gdm8yiae6u] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-gdm8yiae6u] {
    margin-top: 24px;
}

.form-section-title > span[b-gdm8yiae6u] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-gdm8yiae6u] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-gdm8yiae6u] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-gdm8yiae6u] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-gdm8yiae6u] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-gdm8yiae6u] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-gdm8yiae6u] {
    min-height: 310px;
}

.photo-preview img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-gdm8yiae6u] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-gdm8yiae6u] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-gdm8yiae6u] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-gdm8yiae6u],
.remove-photo-button[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-gdm8yiae6u] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-gdm8yiae6u] {
    display: none;
}

.remove-photo-button[b-gdm8yiae6u] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.emergency-center-page[b-gdm8yiae6u]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.emergency-center-page[b-gdm8yiae6u]  .cancel-button,
.emergency-center-page[b-gdm8yiae6u]  .save-button,
.emergency-center-page[b-gdm8yiae6u]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.emergency-center-page[b-gdm8yiae6u]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.emergency-center-page[b-gdm8yiae6u]  .save-button {
    min-width: 170px;
}

.incident-view-modal[b-gdm8yiae6u] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-gdm8yiae6u] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-gdm8yiae6u] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-gdm8yiae6u] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-gdm8yiae6u] {
    font-size: 5rem;
}

.view-cover-overlay[b-gdm8yiae6u] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-gdm8yiae6u] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-gdm8yiae6u] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-gdm8yiae6u] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-gdm8yiae6u] {
    padding: 22px;
}

.view-toolbar[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-gdm8yiae6u] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-gdm8yiae6u],
.view-info-grid span[b-gdm8yiae6u],
.view-description small[b-gdm8yiae6u],
.attachment-heading small[b-gdm8yiae6u],
.view-note small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-gdm8yiae6u] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-gdm8yiae6u] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-gdm8yiae6u] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-gdm8yiae6u] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-gdm8yiae6u] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-gdm8yiae6u] {
    background: #f3efe5;
}

.attachment-card img[b-gdm8yiae6u] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-gdm8yiae6u] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-gdm8yiae6u] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-gdm8yiae6u] {
    font-size: 2.3rem;
}

.view-note[b-gdm8yiae6u] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-gdm8yiae6u] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-gdm8yiae6u] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-gdm8yiae6u] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-gdm8yiae6u] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-gdm8yiae6u] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-gdm8yiae6u] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-gdm8yiae6u] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-gdm8yiae6u] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-gdm8yiae6u] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-gdm8yiae6u] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-gdm8yiae6u] {
    color: #963b36;
}

.delete-warning[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.emergency-center-page[b-gdm8yiae6u]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .emergency-hero[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-gdm8yiae6u] {
        max-width: 570px;
    }

    .list-toolbar[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-gdm8yiae6u] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .emergency-center-page[b-gdm8yiae6u] {
        padding: 15px 12px 30px;
    }

    .emergency-hero[b-gdm8yiae6u] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-gdm8yiae6u] {
        font-size: 2.3rem;
    }

    .hero-meta[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-gdm8yiae6u] {
        width: 100%;
    }

    .filter-heading[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }

    .emergency-center-page[b-gdm8yiae6u]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-gdm8yiae6u] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-gdm8yiae6u],
    .attachment-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-gdm8yiae6u],
    .view-info-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-gdm8yiae6u] {
        align-items: end;
        padding: 0;
    }

    .incident-form-modal[b-gdm8yiae6u],
    .incident-view-modal[b-gdm8yiae6u] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-gdm8yiae6u] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-gdm8yiae6u],
    .incident-list-panel[b-gdm8yiae6u] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-gdm8yiae6u] {
        align-items: flex-start;
    }

    .modal-icon[b-gdm8yiae6u] {
        display: none;
    }

    .modal-footer[b-gdm8yiae6u] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .emergency-center-page[b-gdm8yiae6u]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-gdm8yiae6u] {
        padding: 0;
    }

    .image-preview-modal[b-gdm8yiae6u] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-gdm8yiae6u],
    .incident-form-modal[b-gdm8yiae6u],
    .incident-view-modal[b-gdm8yiae6u],
    .delete-modal[b-gdm8yiae6u] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-gdm8yiae6u] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-gdm8yiae6u],
.status-overview-card.selected[b-gdm8yiae6u] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-gdm8yiae6u] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-gdm8yiae6u] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-gdm8yiae6u] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-gdm8yiae6u] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-gdm8yiae6u] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-gdm8yiae6u] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-gdm8yiae6u] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-gdm8yiae6u],
.complainant-cell small[b-gdm8yiae6u] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-gdm8yiae6u] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-gdm8yiae6u] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-gdm8yiae6u] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-gdm8yiae6u] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-gdm8yiae6u] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-gdm8yiae6u] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-gdm8yiae6u] {
    min-width: 116px;
}

.privacy-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-gdm8yiae6u] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-gdm8yiae6u] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-gdm8yiae6u],
.status-chip.cancelled[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-gdm8yiae6u] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-gdm8yiae6u] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-gdm8yiae6u] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-gdm8yiae6u] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-gdm8yiae6u] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-gdm8yiae6u] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-gdm8yiae6u],
.evidence-preview[b-gdm8yiae6u] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.incident-view-modal[b-gdm8yiae6u] {
    width: min(100%, 920px);
}

.desired-resolution[b-gdm8yiae6u],
.screening-panel[b-gdm8yiae6u],
.attachment-panel[b-gdm8yiae6u] {
    margin-top: 15px;
}

.desired-resolution[b-gdm8yiae6u] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-gdm8yiae6u],
.screening-panel small[b-gdm8yiae6u],
.section-heading small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-gdm8yiae6u],
.screening-panel p[b-gdm8yiae6u] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-gdm8yiae6u] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-gdm8yiae6u] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-gdm8yiae6u] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-gdm8yiae6u] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-gdm8yiae6u] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-gdm8yiae6u] {
    background: #f3efe5;
}

.attachment-card img[b-gdm8yiae6u] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-gdm8yiae6u] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-gdm8yiae6u] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-gdm8yiae6u] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-gdm8yiae6u] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-gdm8yiae6u],
    .screening-panel[b-gdm8yiae6u],
    .attachment-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-gdm8yiae6u] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-gdm8yiae6u] {
    background: #aa453e;
}

.summary-card.overdue[b-gdm8yiae6u],
.summary-card.urgent[b-gdm8yiae6u] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-gdm8yiae6u] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-gdm8yiae6u] {
    min-width: 150px;
}

.progress-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-gdm8yiae6u],
.latest-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-gdm8yiae6u],
.latest-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-gdm8yiae6u],
.latest-cell small[b-gdm8yiae6u] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-gdm8yiae6u],
.due-cell.overdue small[b-gdm8yiae6u] {
    color: #b54842;
}

.overdue-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-gdm8yiae6u] {
    margin-top: 8px;
}

.form-progress-preview[b-gdm8yiae6u] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-gdm8yiae6u] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-gdm8yiae6u],
.history-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-gdm8yiae6u],
.section-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-gdm8yiae6u],
.section-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-gdm8yiae6u],
.section-heading h3[b-gdm8yiae6u] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-gdm8yiae6u]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-gdm8yiae6u] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-gdm8yiae6u] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-gdm8yiae6u]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-gdm8yiae6u] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-gdm8yiae6u] {
    padding-bottom: 0;
}

.timeline-marker[b-gdm8yiae6u] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-gdm8yiae6u] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-gdm8yiae6u] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-gdm8yiae6u] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-gdm8yiae6u] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-gdm8yiae6u],
.timeline-item.cancelled .timeline-marker[b-gdm8yiae6u] {
    background: #aa453e;
}

.timeline-content[b-gdm8yiae6u] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-gdm8yiae6u] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-gdm8yiae6u] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-gdm8yiae6u] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-gdm8yiae6u] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-gdm8yiae6u] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-gdm8yiae6u] {
    color: #2d78a4;
}

.summary-card.progress[b-gdm8yiae6u] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-gdm8yiae6u] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-gdm8yiae6u] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-gdm8yiae6u] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-gdm8yiae6u] {
    background: #aa453e;
}

.tracking-number-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-gdm8yiae6u] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-gdm8yiae6u],
.assigned-by-cell[b-gdm8yiae6u],
.latest-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-gdm8yiae6u],
.assigned-by-cell strong[b-gdm8yiae6u],
.latest-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-gdm8yiae6u],
.assigned-by-cell small[b-gdm8yiae6u],
.latest-cell small[b-gdm8yiae6u] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-gdm8yiae6u] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-gdm8yiae6u],
.status-chip.cancelled[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-gdm8yiae6u] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-gdm8yiae6u] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.incident-view-modal[b-gdm8yiae6u] {
    width: min(100%, 940px);
}

.tracking-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-gdm8yiae6u],
.banner-officer[b-gdm8yiae6u],
.banner-due[b-gdm8yiae6u],
.banner-progress[b-gdm8yiae6u] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-gdm8yiae6u] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-gdm8yiae6u],
.detail-note-grid[b-gdm8yiae6u],
.history-panel[b-gdm8yiae6u],
.attachment-panel[b-gdm8yiae6u] {
    margin-top: 15px;
}

.assignment-instruction[b-gdm8yiae6u] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-gdm8yiae6u],
.detail-note-grid small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-gdm8yiae6u],
.detail-note-grid p[b-gdm8yiae6u] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-gdm8yiae6u] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-gdm8yiae6u] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-gdm8yiae6u] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-gdm8yiae6u]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-gdm8yiae6u],
.timeline-item.cancelled .timeline-marker[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-gdm8yiae6u],
.evidence-preview[b-gdm8yiae6u] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-gdm8yiae6u],
    .detail-note-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-gdm8yiae6u] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-gdm8yiae6u] {
    width: 100%;
}

.available-count-card[b-gdm8yiae6u] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-gdm8yiae6u] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-gdm8yiae6u] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-gdm8yiae6u] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-gdm8yiae6u]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-gdm8yiae6u]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-gdm8yiae6u] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-gdm8yiae6u] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-gdm8yiae6u] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-gdm8yiae6u] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-gdm8yiae6u] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-gdm8yiae6u] {
    font-size: 1.55rem;
}

.picker-photo[b-gdm8yiae6u] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-gdm8yiae6u] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-gdm8yiae6u] {
    font-size: 2rem;
}

.picker-content[b-gdm8yiae6u] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-gdm8yiae6u] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-gdm8yiae6u] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-gdm8yiae6u] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-gdm8yiae6u] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-gdm8yiae6u] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-gdm8yiae6u] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-gdm8yiae6u] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-gdm8yiae6u] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-gdm8yiae6u] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-gdm8yiae6u] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-gdm8yiae6u] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-gdm8yiae6u] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-gdm8yiae6u] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-gdm8yiae6u] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-gdm8yiae6u] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-gdm8yiae6u] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-gdm8yiae6u] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-gdm8yiae6u] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-gdm8yiae6u] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-gdm8yiae6u],
    .selected-complaint-panel[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-gdm8yiae6u] {
        min-height: 220px;
    }

    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-gdm8yiae6u] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-gdm8yiae6u] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-gdm8yiae6u] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-gdm8yiae6u] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-gdm8yiae6u] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-gdm8yiae6u] {
    color: #b47b22;
}

.summary-card.overdue[b-gdm8yiae6u] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-gdm8yiae6u] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-gdm8yiae6u] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-gdm8yiae6u] {
    background: #75837d;
}

.status-overview-card.completed > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-gdm8yiae6u] {
    background: #bc4d45;
}

.tracking-number-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-gdm8yiae6u] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-gdm8yiae6u],
.progress-cell[b-gdm8yiae6u],
.followup-cell[b-gdm8yiae6u],
.latest-cell[b-gdm8yiae6u],
.department-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-gdm8yiae6u],
.followup-cell strong[b-gdm8yiae6u],
.latest-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-gdm8yiae6u],
.followup-cell small[b-gdm8yiae6u],
.latest-cell small[b-gdm8yiae6u] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-gdm8yiae6u] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-gdm8yiae6u] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-gdm8yiae6u] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-gdm8yiae6u] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-gdm8yiae6u] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-gdm8yiae6u] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-gdm8yiae6u] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-gdm8yiae6u] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-gdm8yiae6u] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-gdm8yiae6u] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-gdm8yiae6u] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-gdm8yiae6u] {
    width: 100%;
}

.source-picker-list[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-gdm8yiae6u] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-gdm8yiae6u] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-gdm8yiae6u] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-gdm8yiae6u] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-gdm8yiae6u] {
    display: block;
}

.picker-photo[b-gdm8yiae6u] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-gdm8yiae6u] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-gdm8yiae6u] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-gdm8yiae6u] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-gdm8yiae6u] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-gdm8yiae6u] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-gdm8yiae6u],
.picker-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-gdm8yiae6u] {
    gap: 8px 12px;
}

.picker-meta span[b-gdm8yiae6u] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-gdm8yiae6u] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-gdm8yiae6u] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-gdm8yiae6u] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-gdm8yiae6u] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-gdm8yiae6u] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-gdm8yiae6u] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-gdm8yiae6u] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-gdm8yiae6u] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-gdm8yiae6u] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-gdm8yiae6u] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-gdm8yiae6u] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-gdm8yiae6u] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-gdm8yiae6u] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-gdm8yiae6u],
.attachment-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-gdm8yiae6u] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-gdm8yiae6u]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-gdm8yiae6u] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-gdm8yiae6u] {
    background: #e7f2f9;
}

.attachment-card.after[b-gdm8yiae6u] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-gdm8yiae6u],
.after-preview[b-gdm8yiae6u] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-gdm8yiae6u],
    .selected-source-panel[b-gdm8yiae6u],
    .tracking-banner[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-gdm8yiae6u] {
        min-height: 220px;
    }

    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-gdm8yiae6u] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-gdm8yiae6u] {
    color: var(--theme-primary);
}

.summary-card.sla[b-gdm8yiae6u] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-gdm8yiae6u] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-gdm8yiae6u] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-gdm8yiae6u] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-gdm8yiae6u] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.asset-number-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-gdm8yiae6u] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-gdm8yiae6u] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-gdm8yiae6u] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-gdm8yiae6u] {
    font-size: .36rem;
}

.resolution-chip[b-gdm8yiae6u],
.publication-chip[b-gdm8yiae6u],
.sla-chip[b-gdm8yiae6u],
.source-sla-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-gdm8yiae6u] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-gdm8yiae6u],
.source-sla-chip.within[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-gdm8yiae6u],
.source-sla-chip.over[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-gdm8yiae6u],
.closed-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-gdm8yiae6u],
.closed-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-gdm8yiae6u],
.closed-cell small[b-gdm8yiae6u] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-gdm8yiae6u] {
    color: #aa453e;
}

.score-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-gdm8yiae6u] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-gdm8yiae6u] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-gdm8yiae6u] {
    color: #d0a43f;
}

.score-cell small[b-gdm8yiae6u] {
    color: #8c9893;
    font-size: .47rem;
}

.incident-command-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.incident-command-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.incident-command-banner .banner-department[b-gdm8yiae6u] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.incident-command-banner small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .48rem;
}

.incident-command-banner strong[b-gdm8yiae6u] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-gdm8yiae6u] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-gdm8yiae6u] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-gdm8yiae6u] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-gdm8yiae6u] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-gdm8yiae6u] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-gdm8yiae6u] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-gdm8yiae6u] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-gdm8yiae6u] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-gdm8yiae6u] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-gdm8yiae6u] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-gdm8yiae6u] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-gdm8yiae6u] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-gdm8yiae6u] {
    display: block;
}

@media (max-width: 1200px) {
    .incident-command-banner[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .incident-command-banner[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-gdm8yiae6u] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-gdm8yiae6u] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-gdm8yiae6u] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-gdm8yiae6u] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-gdm8yiae6u] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-gdm8yiae6u] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-gdm8yiae6u] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.emergency-center-page[b-gdm8yiae6u]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-gdm8yiae6u] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-gdm8yiae6u] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-gdm8yiae6u] { background: #6e7d77; }
.status-overview-card.assigned > span[b-gdm8yiae6u] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-gdm8yiae6u] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-gdm8yiae6u] { background: #ad721a; }
.status-overview-card.completed > span[b-gdm8yiae6u] { background: var(--theme-primary); }

.asset-number-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-gdm8yiae6u] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-gdm8yiae6u] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-gdm8yiae6u] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-gdm8yiae6u] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-gdm8yiae6u] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-gdm8yiae6u] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-gdm8yiae6u],
.schedule-cell[b-gdm8yiae6u],
.budget-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-gdm8yiae6u],
.schedule-cell strong[b-gdm8yiae6u],
.budget-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-gdm8yiae6u],
.schedule-cell small[b-gdm8yiae6u],
.budget-cell small[b-gdm8yiae6u] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-gdm8yiae6u],
.schedule-cell.overdue small[b-gdm8yiae6u] {
    color: #b3463d;
}

.budget-cell strong[b-gdm8yiae6u] {
    color: #9c7932;
}

.progress-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-gdm8yiae6u] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-gdm8yiae6u] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-gdm8yiae6u] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-gdm8yiae6u] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-gdm8yiae6u] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-gdm8yiae6u] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-gdm8yiae6u] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-gdm8yiae6u] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-gdm8yiae6u] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-gdm8yiae6u] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-gdm8yiae6u] {
    display: block;
}

.picker-photo[b-gdm8yiae6u] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-gdm8yiae6u] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-gdm8yiae6u] {
    min-width: 0;
}

.picker-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-gdm8yiae6u] {
    min-width: 0;
}

.picker-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-gdm8yiae6u] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-gdm8yiae6u] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-gdm8yiae6u] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-gdm8yiae6u] {
    font-size: .47rem;
}

.selected-source-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-gdm8yiae6u] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-gdm8yiae6u] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-gdm8yiae6u] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-gdm8yiae6u] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-gdm8yiae6u] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-gdm8yiae6u] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-gdm8yiae6u] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-gdm8yiae6u] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.incident-command-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.incident-command-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.incident-command-banner .banner-technician[b-gdm8yiae6u] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-gdm8yiae6u] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.incident-command-banner small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .48rem;
}

.incident-command-banner strong[b-gdm8yiae6u] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-gdm8yiae6u] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-gdm8yiae6u] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-gdm8yiae6u] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-gdm8yiae6u] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-gdm8yiae6u] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-gdm8yiae6u] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-gdm8yiae6u] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-gdm8yiae6u] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-gdm8yiae6u] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-gdm8yiae6u] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-gdm8yiae6u] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-gdm8yiae6u] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-gdm8yiae6u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-gdm8yiae6u],
.history-meta b[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-gdm8yiae6u] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-gdm8yiae6u] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-gdm8yiae6u] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .incident-command-banner[b-gdm8yiae6u],
    .four-columns[b-gdm8yiae6u] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-gdm8yiae6u] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .incident-command-banner[b-gdm8yiae6u],
    .detail-note-grid[b-gdm8yiae6u],
    .four-columns[b-gdm8yiae6u] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-gdm8yiae6u] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-gdm8yiae6u] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-gdm8yiae6u],
    .source-picker-card[b-gdm8yiae6u],
    .selected-info-grid[b-gdm8yiae6u] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-gdm8yiae6u] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-gdm8yiae6u] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-gdm8yiae6u] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-gdm8yiae6u] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-gdm8yiae6u] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.emergency-center-page[b-gdm8yiae6u]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-gdm8yiae6u] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-gdm8yiae6u] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-gdm8yiae6u] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-gdm8yiae6u] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-gdm8yiae6u] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-gdm8yiae6u] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-gdm8yiae6u],
.asset-location-cell[b-gdm8yiae6u],
.department-cell[b-gdm8yiae6u],
.status-condition-cell[b-gdm8yiae6u],
.value-cell[b-gdm8yiae6u],
.inspection-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-gdm8yiae6u],
.asset-location-cell strong[b-gdm8yiae6u],
.department-cell strong[b-gdm8yiae6u],
.value-cell strong[b-gdm8yiae6u],
.inspection-cell strong[b-gdm8yiae6u] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-gdm8yiae6u],
.asset-location-cell small[b-gdm8yiae6u],
.department-cell small[b-gdm8yiae6u],
.value-cell small[b-gdm8yiae6u],
.inspection-cell small[b-gdm8yiae6u] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-gdm8yiae6u] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-gdm8yiae6u] {
    width: fit-content;
}

.status-condition-cell[b-gdm8yiae6u] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-gdm8yiae6u],
.inspection-cell.overdue small[b-gdm8yiae6u] {
    color: #b3463d;
}

.condition-chip[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-gdm8yiae6u] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-gdm8yiae6u] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-gdm8yiae6u] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-gdm8yiae6u] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-gdm8yiae6u] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-gdm8yiae6u] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-gdm8yiae6u] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-gdm8yiae6u] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-gdm8yiae6u] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-gdm8yiae6u] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.incident-photo-upload-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.incident-command-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.incident-command-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.incident-command-banner .asset-banner-icon[b-gdm8yiae6u] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-gdm8yiae6u] {
    font-size: 1.7rem;
}

.incident-command-banner small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.incident-command-banner strong[b-gdm8yiae6u] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-gdm8yiae6u] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-gdm8yiae6u] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-gdm8yiae6u] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-gdm8yiae6u] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-gdm8yiae6u] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-gdm8yiae6u] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.emergency-center-page[b-gdm8yiae6u]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-gdm8yiae6u] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-gdm8yiae6u] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-gdm8yiae6u] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-gdm8yiae6u] {
    font-style: normal;
}

.asset-location-panel a[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-gdm8yiae6u] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-gdm8yiae6u] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-gdm8yiae6u] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-gdm8yiae6u] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-gdm8yiae6u] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .incident-photo-upload-grid[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .incident-command-banner > div:nth-child(4)[b-gdm8yiae6u],
    .incident-command-banner > div:nth-child(5)[b-gdm8yiae6u] {
        grid-column: auto;
    }

    .inspection-date-grid[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .incident-photo-upload-grid[b-gdm8yiae6u],
    .asset-value-preview[b-gdm8yiae6u],
    .asset-detail-note-grid[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .incident-command-banner .asset-banner-icon[b-gdm8yiae6u] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-gdm8yiae6u] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-gdm8yiae6u] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-gdm8yiae6u] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-gdm8yiae6u] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-gdm8yiae6u] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-gdm8yiae6u],
    .emergency-center-page[b-gdm8yiae6u]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY CENTER PREMIUM
   ========================================================= */

.emergency-center-page[b-gdm8yiae6u] {
    --emergency-red: #b83f35;
    --emergency-deep: #651e1a;
    --emergency-soft: #fff1ef;
    --command-navy: #263b4a;
}

.emergency-hero[b-gdm8yiae6u] {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255, 177, 144, .18),
            transparent 23rem),
        radial-gradient(
            circle at 16% 80%,
            rgba(201, 166, 93, .13),
            transparent 19rem),
        linear-gradient(
            135deg,
            #6f211c 0%,
            #421411 54%,
            #24100f 100%) !important;
}

.hero-alert-line[b-gdm8yiae6u] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffb28e 18%,
            #f6db9f 50%,
            #ffb28e 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(255, 153, 112, .55);
}

.emergency-online .status-dot[b-gdm8yiae6u] {
    background: #ffb28e !important;

    box-shadow:
        0 0 0 5px rgba(255, 178, 142, .15),
        0 0 14px rgba(255, 178, 142, .78) !important;
}

.emergency-center-page[b-gdm8yiae6u]  .hero-add-button,
.emergency-center-page[b-gdm8yiae6u]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #d95e46,
            #a72f29) !important;

    box-shadow:
        0 11px 24px rgba(119, 31, 25, .28) !important;
}

.summary-card.critical[b-gdm8yiae6u] {
    --summary-accent: #bd3e35;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 62, 53, .20);
}

.summary-card.active[b-gdm8yiae6u] {
    --summary-accent: #8b529f;
    --summary-soft: #f3eafb;
    --summary-border: rgba(139, 82, 159, .20);
}

.summary-card.sla[b-gdm8yiae6u] {
    --summary-accent: #c27a22;
    --summary-soft: #fff3df;
    --summary-border: rgba(194, 122, 34, .20);
}

.summary-card.resolved[b-gdm8yiae6u] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.emergency-center-page[b-gdm8yiae6u]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.new > span[b-gdm8yiae6u] {
    background: #bd3e35;
}

.status-overview-card.dispatched > span[b-gdm8yiae6u] {
    background: #2d78a4;
}

.status-overview-card.active > span[b-gdm8yiae6u] {
    background: #8b529f;
}

.status-overview-card.over-sla > span[b-gdm8yiae6u] {
    background: #c27a22;
}

.status-overview-card.resolved > span[b-gdm8yiae6u] {
    background: var(--theme-primary);
}

.incident-code-photo-cell[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 152px;
    align-items: center;
    gap: 8px;
}

.incident-photo-mini[b-gdm8yiae6u] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(184, 63, 53, .12);
    border-radius: 12px;

    color: #b83f35;
    background: #fff2f0;
}

.incident-photo-mini button[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.incident-photo-mini img[b-gdm8yiae6u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.incident-code-photo-cell > div:last-child[b-gdm8yiae6u] {
    min-width: 0;
}

.incident-code-photo-cell strong[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(184, 63, 53, .14);
    border-radius: 8px;

    color: #a3362f;
    background: #fff3f1;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.incident-code-photo-cell small[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-subject-cell[b-gdm8yiae6u],
.priority-status-cell[b-gdm8yiae6u],
.response-unit-cell[b-gdm8yiae6u],
.sla-cell[b-gdm8yiae6u],
.responder-cell[b-gdm8yiae6u],
.latest-update-cell[b-gdm8yiae6u] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.incident-subject-cell[b-gdm8yiae6u] {
    gap: 4px;
}

.incident-subject-cell strong[b-gdm8yiae6u],
.response-unit-cell strong[b-gdm8yiae6u],
.sla-cell strong[b-gdm8yiae6u],
.responder-cell strong[b-gdm8yiae6u],
.latest-update-cell strong[b-gdm8yiae6u] {
    color: #3f4e49;
    font-size: .56rem;
    line-height: 1.48;
}

.incident-subject-cell small[b-gdm8yiae6u],
.response-unit-cell small[b-gdm8yiae6u],
.sla-cell small[b-gdm8yiae6u],
.responder-cell small[b-gdm8yiae6u],
.latest-update-cell small[b-gdm8yiae6u] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.response-unit-cell em[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e8f3f9;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.priority-status-cell[b-gdm8yiae6u] {
    align-items: flex-start;
    gap: 5px;
}

.sla-cell.overdue strong[b-gdm8yiae6u],
.sla-cell.overdue small[b-gdm8yiae6u] {
    color: #b13e36;
}

.latest-update-cell small[b-gdm8yiae6u] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.type-chip[b-gdm8yiae6u] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5b625e;
    background: #edf1ef;

    font-size: .41rem;
    font-weight: 700;
}

.type-chip.fire[b-gdm8yiae6u] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-gdm8yiae6u] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-gdm8yiae6u] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-gdm8yiae6u] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-gdm8yiae6u] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-gdm8yiae6u] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-gdm8yiae6u] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-gdm8yiae6u] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-gdm8yiae6u] {
    color: #815f43;
    background: #f2e9df;
}

.priority-chip.critical[b-gdm8yiae6u] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d65043,
            #9f2e29);

    box-shadow:
        0 5px 13px rgba(159, 46, 41, .18);
}

.priority-chip.urgent[b-gdm8yiae6u] {
    color: #a33c32;
    background: #ffe4df;
}

.priority-chip.high[b-gdm8yiae6u] {
    color: #a46622;
    background: #fff0d8;
}

.priority-chip.normal[b-gdm8yiae6u] {
    color: #39745a;
    background: #e7f5ee;
}

.status-chip.new[b-gdm8yiae6u] {
    color: #ad382f;
    background: #fff0ee;
}

.status-chip.dispatched[b-gdm8yiae6u] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.on-scene[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in-progress[b-gdm8yiae6u] {
    color: #7d4c96;
    background: #f3e9fa;
}

.status-chip.resolved[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.closed[b-gdm8yiae6u] {
    color: #3d6657;
    background: #e9f1ed;
}

.status-chip.cancelled[b-gdm8yiae6u] {
    color: #697770;
    background: #edf1ef;
}

.anonymous-switch-card[b-gdm8yiae6u] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 12px;

    background: #fff8f7;
}

.incident-photo-upload-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.privacy-note[b-gdm8yiae6u] {
    margin-top: 12px;
}

.incident-command-banner[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        70px
        minmax(160px, 1fr)
        minmax(150px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 16px;

    background: rgba(184, 63, 53, .10);

    box-shadow:
        0 12px 30px rgba(88, 31, 26, .07);
}

.incident-command-banner > div[b-gdm8yiae6u] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 182, 148, .08),
            transparent 12rem),
        #fff;
}

.incident-command-banner .command-icon[b-gdm8yiae6u] {
    color: #ffd5c3;
    background:
        linear-gradient(
            145deg,
            #8c2b25,
            #4c1714);
}

.command-icon .mud-icon-root[b-gdm8yiae6u] {
    font-size: 1.7rem;
}

.incident-command-banner small[b-gdm8yiae6u] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-command-banner strong[b-gdm8yiae6u] {
    margin-top: 4px;

    color: #3f4e49;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.response-timeline-overview[b-gdm8yiae6u] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 177, 144, .09),
            transparent 18rem),
        #fbf9f8;
}

.response-heading[b-gdm8yiae6u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.response-heading small[b-gdm8yiae6u] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.response-heading h3[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: #3f4e49;
    font-size: .74rem;
}

.response-badge[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.response-badge.normal[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.response-badge.overdue[b-gdm8yiae6u] {
    color: #ad382f;
    background: #fff0ee;
}

.response-time-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.response-time-grid > div[b-gdm8yiae6u] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(184, 63, 53, .07);
    border-radius: 10px;

    background: #fff;
}

.response-time-grid span[b-gdm8yiae6u] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.response-time-grid strong[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;

    color: #3f4e49;
    font-size: .51rem;
}

.incident-location-panel[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.incident-location-panel > span[b-gdm8yiae6u] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.incident-location-panel small[b-gdm8yiae6u] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.incident-location-panel h3[b-gdm8yiae6u] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.incident-location-panel p[b-gdm8yiae6u] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.incident-location-panel p em[b-gdm8yiae6u] {
    font-style: normal;
}

.incident-location-panel b[b-gdm8yiae6u] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.incident-location-panel a[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.incident-note-grid[b-gdm8yiae6u] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.incident-note-grid > div[b-gdm8yiae6u] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.incident-note-grid .danger-note[b-gdm8yiae6u] {
    border-color: rgba(184, 63, 53, .13);
    background: #fff7f5;
}

.incident-note-grid .risk-note[b-gdm8yiae6u] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.incident-note-grid small[b-gdm8yiae6u] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
}

.incident-note-grid p[b-gdm8yiae6u] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-gdm8yiae6u] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6b5148;
    background: #f4ece8;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-gdm8yiae6u] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-gdm8yiae6u] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-gdm8yiae6u] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-gdm8yiae6u] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .incident-photo-upload-grid[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .response-time-grid[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .incident-photo-upload-grid[b-gdm8yiae6u],
    .incident-note-grid[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .incident-command-banner .command-icon[b-gdm8yiae6u] {
        grid-column: 1 / -1;
    }

    .response-time-grid[b-gdm8yiae6u],
    .three-columns[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .incident-location-panel[b-gdm8yiae6u] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .incident-location-panel a[b-gdm8yiae6u] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .incident-command-banner[b-gdm8yiae6u] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-gdm8yiae6u] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-gdm8yiae6u],
    .emergency-center-page[b-gdm8yiae6u]  .view-edit-button {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/06Emergency/EmergencyDispatchAssignments.razor.rz.scp.css */
.emergency-dispatch-page[b-mq5n76odh8] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.emergency-dispatch-page[b-mq5n76odh8]  .emergency-dispatch-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.dispatch-hero[b-mq5n76odh8] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-mq5n76odh8] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-mq5n76odh8] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-mq5n76odh8] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-mq5n76odh8] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-mq5n76odh8] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-mq5n76odh8] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-mq5n76odh8] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-mq5n76odh8] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-mq5n76odh8] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-mq5n76odh8] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-mq5n76odh8] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.emergency-dispatch-page[b-mq5n76odh8]  .hero-add-button,
.emergency-dispatch-page[b-mq5n76odh8]  .search-button,
.emergency-dispatch-page[b-mq5n76odh8]  .toolbar-add-button,
.emergency-dispatch-page[b-mq5n76odh8]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.emergency-dispatch-page[b-mq5n76odh8]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-mq5n76odh8] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-mq5n76odh8] {
    opacity: .55;
    cursor: not-allowed;
}

.emergency-dispatch-page[b-mq5n76odh8]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-mq5n76odh8] {
    margin-top: 7px;
}

.summary-card[b-mq5n76odh8] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-mq5n76odh8] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-mq5n76odh8] {
    color: #2c7da8;
}

.summary-card.pending[b-mq5n76odh8] {
    color: #7658a7;
}

.summary-card.urgent[b-mq5n76odh8] {
    color: #c05b4e;
}

.summary-line[b-mq5n76odh8] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-mq5n76odh8] {
    min-width: 0;
}

.summary-card small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-mq5n76odh8] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-mq5n76odh8] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-mq5n76odh8] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-mq5n76odh8],
.dispatch-list-panel[b-mq5n76odh8] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-mq5n76odh8],
.list-toolbar[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-mq5n76odh8],
.panel-kicker[b-mq5n76odh8] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-mq5n76odh8],
.list-toolbar h2[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-mq5n76odh8],
.list-toolbar p[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-mq5n76odh8] {
    align-items: center;
}

.emergency-dispatch-page[b-mq5n76odh8]  .premium-field,
.emergency-dispatch-page[b-mq5n76odh8]  .form-field {
    width: 100%;
}

.emergency-dispatch-page[b-mq5n76odh8]  .premium-field .mud-input-outlined-border,
.emergency-dispatch-page[b-mq5n76odh8]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.emergency-dispatch-page[b-mq5n76odh8]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .sort-select {
    width: 170px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .toolbar-add-button {
    min-height: 42px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .dispatch-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .dispatch-table .mud-table-head {
    background: #eef6f2;
}

.emergency-dispatch-page[b-mq5n76odh8]  .dispatch-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-mq5n76odh8] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-mq5n76odh8],
.mini-photo-empty[b-mq5n76odh8] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-mq5n76odh8] {
    cursor: zoom-in;
}

.mini-photo-button img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-mq5n76odh8] {
    object-fit: cover;
}

.mini-photo-button small[b-mq5n76odh8] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-mq5n76odh8] {
    color: #9c7b38;
}

.applicant-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-mq5n76odh8],
.applicant-cell small[b-mq5n76odh8] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-mq5n76odh8] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-mq5n76odh8] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-mq5n76odh8],
.channel-chip[b-mq5n76odh8],
.priority-chip[b-mq5n76odh8],
.status-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-mq5n76odh8],
.type-chip.construction[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-mq5n76odh8],
.type-chip.food_license[b-mq5n76odh8],
.type-chip.tax[b-mq5n76odh8] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-mq5n76odh8],
.type-chip.environment[b-mq5n76odh8] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-mq5n76odh8],
.date-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-mq5n76odh8],
.date-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-mq5n76odh8],
.date-cell small[b-mq5n76odh8] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-mq5n76odh8] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-mq5n76odh8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-mq5n76odh8] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-mq5n76odh8] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-mq5n76odh8] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-mq5n76odh8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-mq5n76odh8] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .row-action.view {
    color: #2d79a2;
}

.emergency-dispatch-page[b-mq5n76odh8]  .row-action.edit {
    color: var(--theme-primary);
}

.emergency-dispatch-page[b-mq5n76odh8]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.emergency-dispatch-page[b-mq5n76odh8]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-mq5n76odh8] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-mq5n76odh8] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-mq5n76odh8] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-mq5n76odh8] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-mq5n76odh8] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.dispatch-form-modal[b-mq5n76odh8],
.dispatch-view-modal[b-mq5n76odh8],
.delete-modal[b-mq5n76odh8] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-mq5n76odh8 .22s ease-out;
}

@keyframes modalAppear-b-mq5n76odh8 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.dispatch-form-modal[b-mq5n76odh8] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-mq5n76odh8] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-mq5n76odh8] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-mq5n76odh8] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-mq5n76odh8] {
    margin-top: 24px;
}

.form-section-title > span[b-mq5n76odh8] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-mq5n76odh8] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-mq5n76odh8] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-mq5n76odh8] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-mq5n76odh8] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-mq5n76odh8] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-mq5n76odh8] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-mq5n76odh8] {
    min-height: 310px;
}

.photo-preview img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-mq5n76odh8] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-mq5n76odh8] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-mq5n76odh8] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-mq5n76odh8],
.remove-photo-button[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-mq5n76odh8] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-mq5n76odh8] {
    display: none;
}

.remove-photo-button[b-mq5n76odh8] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.emergency-dispatch-page[b-mq5n76odh8]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.emergency-dispatch-page[b-mq5n76odh8]  .cancel-button,
.emergency-dispatch-page[b-mq5n76odh8]  .save-button,
.emergency-dispatch-page[b-mq5n76odh8]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.emergency-dispatch-page[b-mq5n76odh8]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.emergency-dispatch-page[b-mq5n76odh8]  .save-button {
    min-width: 170px;
}

.dispatch-view-modal[b-mq5n76odh8] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-mq5n76odh8] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-mq5n76odh8] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-mq5n76odh8] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-mq5n76odh8] {
    font-size: 5rem;
}

.view-cover-overlay[b-mq5n76odh8] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-mq5n76odh8] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-mq5n76odh8] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-mq5n76odh8] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-mq5n76odh8] {
    padding: 22px;
}

.view-toolbar[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-mq5n76odh8] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-mq5n76odh8],
.view-info-grid span[b-mq5n76odh8],
.view-description small[b-mq5n76odh8],
.attachment-heading small[b-mq5n76odh8],
.view-note small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-mq5n76odh8] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-mq5n76odh8] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-mq5n76odh8] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-mq5n76odh8] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-mq5n76odh8] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-mq5n76odh8] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-mq5n76odh8] {
    background: #f3efe5;
}

.attachment-card img[b-mq5n76odh8] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-mq5n76odh8] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-mq5n76odh8] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-mq5n76odh8] {
    font-size: 2.3rem;
}

.view-note[b-mq5n76odh8] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-mq5n76odh8] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-mq5n76odh8] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-mq5n76odh8] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-mq5n76odh8] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-mq5n76odh8] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-mq5n76odh8] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-mq5n76odh8] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-mq5n76odh8] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-mq5n76odh8] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-mq5n76odh8] {
    color: #963b36;
}

.delete-warning[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.emergency-dispatch-page[b-mq5n76odh8]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .dispatch-hero[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-mq5n76odh8] {
        max-width: 570px;
    }

    .list-toolbar[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-mq5n76odh8] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .emergency-dispatch-page[b-mq5n76odh8] {
        padding: 15px 12px 30px;
    }

    .dispatch-hero[b-mq5n76odh8] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-mq5n76odh8] {
        font-size: 2.3rem;
    }

    .hero-meta[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-mq5n76odh8] {
        width: 100%;
    }

    .filter-heading[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }

    .emergency-dispatch-page[b-mq5n76odh8]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-mq5n76odh8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-mq5n76odh8],
    .attachment-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-mq5n76odh8],
    .view-info-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-mq5n76odh8] {
        align-items: end;
        padding: 0;
    }

    .dispatch-form-modal[b-mq5n76odh8],
    .dispatch-view-modal[b-mq5n76odh8] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-mq5n76odh8] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-mq5n76odh8],
    .dispatch-list-panel[b-mq5n76odh8] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-mq5n76odh8] {
        align-items: flex-start;
    }

    .modal-icon[b-mq5n76odh8] {
        display: none;
    }

    .modal-footer[b-mq5n76odh8] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .emergency-dispatch-page[b-mq5n76odh8]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-mq5n76odh8] {
        padding: 0;
    }

    .image-preview-modal[b-mq5n76odh8] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-mq5n76odh8],
    .dispatch-form-modal[b-mq5n76odh8],
    .dispatch-view-modal[b-mq5n76odh8],
    .delete-modal[b-mq5n76odh8] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-mq5n76odh8] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-mq5n76odh8],
.status-overview-card.selected[b-mq5n76odh8] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-mq5n76odh8] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-mq5n76odh8] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-mq5n76odh8] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-mq5n76odh8] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-mq5n76odh8] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-mq5n76odh8] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-mq5n76odh8],
.complainant-cell small[b-mq5n76odh8] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-mq5n76odh8] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-mq5n76odh8] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-mq5n76odh8] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-mq5n76odh8] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-mq5n76odh8] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-mq5n76odh8] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-mq5n76odh8] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-mq5n76odh8] {
    min-width: 116px;
}

.privacy-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-mq5n76odh8] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-mq5n76odh8] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-mq5n76odh8],
.status-chip.cancelled[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-mq5n76odh8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-mq5n76odh8] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-mq5n76odh8] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-mq5n76odh8] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-mq5n76odh8] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-mq5n76odh8] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-mq5n76odh8] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-mq5n76odh8],
.evidence-preview[b-mq5n76odh8] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.dispatch-view-modal[b-mq5n76odh8] {
    width: min(100%, 920px);
}

.desired-resolution[b-mq5n76odh8],
.screening-panel[b-mq5n76odh8],
.attachment-panel[b-mq5n76odh8] {
    margin-top: 15px;
}

.desired-resolution[b-mq5n76odh8] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-mq5n76odh8],
.screening-panel small[b-mq5n76odh8],
.section-heading small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-mq5n76odh8],
.screening-panel p[b-mq5n76odh8] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-mq5n76odh8] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-mq5n76odh8] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-mq5n76odh8] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-mq5n76odh8] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-mq5n76odh8] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-mq5n76odh8] {
    background: #f3efe5;
}

.attachment-card img[b-mq5n76odh8] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-mq5n76odh8] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-mq5n76odh8] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-mq5n76odh8] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-mq5n76odh8] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-mq5n76odh8],
    .screening-panel[b-mq5n76odh8],
    .attachment-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-mq5n76odh8] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-mq5n76odh8] {
    background: #aa453e;
}

.summary-card.overdue[b-mq5n76odh8],
.summary-card.urgent[b-mq5n76odh8] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-mq5n76odh8] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-mq5n76odh8] {
    min-width: 150px;
}

.progress-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-mq5n76odh8],
.latest-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-mq5n76odh8],
.latest-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-mq5n76odh8],
.latest-cell small[b-mq5n76odh8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-mq5n76odh8],
.due-cell.overdue small[b-mq5n76odh8] {
    color: #b54842;
}

.overdue-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-mq5n76odh8] {
    margin-top: 8px;
}

.form-progress-preview[b-mq5n76odh8] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-mq5n76odh8] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-mq5n76odh8],
.history-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-mq5n76odh8],
.section-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-mq5n76odh8],
.section-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-mq5n76odh8],
.section-heading h3[b-mq5n76odh8] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-mq5n76odh8]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-mq5n76odh8] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-mq5n76odh8] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-mq5n76odh8]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-mq5n76odh8] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-mq5n76odh8] {
    padding-bottom: 0;
}

.timeline-marker[b-mq5n76odh8] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-mq5n76odh8] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-mq5n76odh8] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-mq5n76odh8] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-mq5n76odh8] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-mq5n76odh8],
.timeline-item.cancelled .timeline-marker[b-mq5n76odh8] {
    background: #aa453e;
}

.timeline-content[b-mq5n76odh8] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-mq5n76odh8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-mq5n76odh8] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-mq5n76odh8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-mq5n76odh8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-mq5n76odh8] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-mq5n76odh8] {
    color: #2d78a4;
}

.summary-card.progress[b-mq5n76odh8] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-mq5n76odh8] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-mq5n76odh8] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-mq5n76odh8] {
    background: #aa453e;
}

.tracking-number-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-mq5n76odh8] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-mq5n76odh8],
.assigned-by-cell[b-mq5n76odh8],
.latest-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-mq5n76odh8],
.assigned-by-cell strong[b-mq5n76odh8],
.latest-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-mq5n76odh8],
.assigned-by-cell small[b-mq5n76odh8],
.latest-cell small[b-mq5n76odh8] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-mq5n76odh8] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-mq5n76odh8],
.status-chip.cancelled[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-mq5n76odh8] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-mq5n76odh8] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.dispatch-view-modal[b-mq5n76odh8] {
    width: min(100%, 940px);
}

.tracking-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-mq5n76odh8],
.banner-officer[b-mq5n76odh8],
.banner-due[b-mq5n76odh8],
.banner-progress[b-mq5n76odh8] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-mq5n76odh8] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-mq5n76odh8] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-mq5n76odh8],
.detail-note-grid[b-mq5n76odh8],
.history-panel[b-mq5n76odh8],
.attachment-panel[b-mq5n76odh8] {
    margin-top: 15px;
}

.assignment-instruction[b-mq5n76odh8] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-mq5n76odh8],
.detail-note-grid small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-mq5n76odh8],
.detail-note-grid p[b-mq5n76odh8] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-mq5n76odh8] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-mq5n76odh8] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-mq5n76odh8] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-mq5n76odh8]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-mq5n76odh8],
.timeline-item.cancelled .timeline-marker[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-mq5n76odh8],
.evidence-preview[b-mq5n76odh8] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-mq5n76odh8],
    .detail-note-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-mq5n76odh8] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-mq5n76odh8] {
    width: 100%;
}

.available-count-card[b-mq5n76odh8] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-mq5n76odh8] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-mq5n76odh8] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-mq5n76odh8] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-mq5n76odh8]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-mq5n76odh8]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-mq5n76odh8] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-mq5n76odh8] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-mq5n76odh8] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-mq5n76odh8] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-mq5n76odh8] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-mq5n76odh8] {
    font-size: 1.55rem;
}

.picker-photo[b-mq5n76odh8] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-mq5n76odh8] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-mq5n76odh8] {
    font-size: 2rem;
}

.picker-content[b-mq5n76odh8] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-mq5n76odh8] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-mq5n76odh8] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-mq5n76odh8] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-mq5n76odh8] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-mq5n76odh8] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-mq5n76odh8] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-mq5n76odh8] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-mq5n76odh8] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-mq5n76odh8] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-mq5n76odh8] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-mq5n76odh8] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-mq5n76odh8] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-mq5n76odh8] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-mq5n76odh8] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-mq5n76odh8] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-mq5n76odh8] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-mq5n76odh8] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-mq5n76odh8] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-mq5n76odh8],
    .selected-complaint-panel[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-mq5n76odh8] {
        min-height: 220px;
    }

    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-mq5n76odh8] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-mq5n76odh8] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-mq5n76odh8] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-mq5n76odh8] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-mq5n76odh8] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-mq5n76odh8] {
    color: #b47b22;
}

.summary-card.overdue[b-mq5n76odh8] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-mq5n76odh8] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-mq5n76odh8] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-mq5n76odh8] {
    background: #75837d;
}

.status-overview-card.completed > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-mq5n76odh8] {
    background: #bc4d45;
}

.tracking-number-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-mq5n76odh8] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-mq5n76odh8],
.progress-cell[b-mq5n76odh8],
.followup-cell[b-mq5n76odh8],
.latest-cell[b-mq5n76odh8],
.department-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-mq5n76odh8],
.followup-cell strong[b-mq5n76odh8],
.latest-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-mq5n76odh8],
.followup-cell small[b-mq5n76odh8],
.latest-cell small[b-mq5n76odh8] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-mq5n76odh8] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-mq5n76odh8] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-mq5n76odh8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-mq5n76odh8] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-mq5n76odh8] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-mq5n76odh8] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-mq5n76odh8] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-mq5n76odh8] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-mq5n76odh8] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-mq5n76odh8] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-mq5n76odh8] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-mq5n76odh8] {
    width: 100%;
}

.source-picker-list[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-mq5n76odh8] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-mq5n76odh8] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-mq5n76odh8] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-mq5n76odh8] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-mq5n76odh8] {
    display: block;
}

.picker-photo[b-mq5n76odh8] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-mq5n76odh8] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-mq5n76odh8] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-mq5n76odh8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-mq5n76odh8] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-mq5n76odh8] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-mq5n76odh8],
.picker-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-mq5n76odh8] {
    gap: 8px 12px;
}

.picker-meta span[b-mq5n76odh8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-mq5n76odh8] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-mq5n76odh8] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-mq5n76odh8] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-mq5n76odh8] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-mq5n76odh8] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-mq5n76odh8] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-mq5n76odh8] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-mq5n76odh8] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-mq5n76odh8] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-mq5n76odh8] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-mq5n76odh8] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-mq5n76odh8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-mq5n76odh8] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-mq5n76odh8],
.attachment-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-mq5n76odh8] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-mq5n76odh8]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-mq5n76odh8] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-mq5n76odh8] {
    background: #e7f2f9;
}

.attachment-card.after[b-mq5n76odh8] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-mq5n76odh8],
.after-preview[b-mq5n76odh8] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-mq5n76odh8],
    .selected-source-panel[b-mq5n76odh8],
    .tracking-banner[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-mq5n76odh8] {
        min-height: 220px;
    }

    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-mq5n76odh8] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-mq5n76odh8] {
    color: var(--theme-primary);
}

.summary-card.sla[b-mq5n76odh8] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-mq5n76odh8] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-mq5n76odh8] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-mq5n76odh8] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.asset-number-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-mq5n76odh8] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-mq5n76odh8] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-mq5n76odh8] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-mq5n76odh8] {
    font-size: .36rem;
}

.resolution-chip[b-mq5n76odh8],
.publication-chip[b-mq5n76odh8],
.sla-chip[b-mq5n76odh8],
.source-sla-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-mq5n76odh8] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-mq5n76odh8],
.source-sla-chip.within[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-mq5n76odh8],
.source-sla-chip.over[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-mq5n76odh8],
.closed-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-mq5n76odh8],
.closed-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-mq5n76odh8],
.closed-cell small[b-mq5n76odh8] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-mq5n76odh8] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-mq5n76odh8] {
    color: #aa453e;
}

.score-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-mq5n76odh8] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-mq5n76odh8] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-mq5n76odh8] {
    color: #d0a43f;
}

.score-cell small[b-mq5n76odh8] {
    color: #8c9893;
    font-size: .47rem;
}

.dispatch-command-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.dispatch-command-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.dispatch-command-banner .banner-department[b-mq5n76odh8] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.dispatch-command-banner small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .48rem;
}

.dispatch-command-banner strong[b-mq5n76odh8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-mq5n76odh8] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-mq5n76odh8] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-mq5n76odh8] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-mq5n76odh8] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-mq5n76odh8] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-mq5n76odh8] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-mq5n76odh8] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-mq5n76odh8] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-mq5n76odh8] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-mq5n76odh8] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-mq5n76odh8] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-mq5n76odh8] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-mq5n76odh8] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-mq5n76odh8] {
    display: block;
}

@media (max-width: 1200px) {
    .dispatch-command-banner[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .dispatch-command-banner[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-mq5n76odh8] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-mq5n76odh8] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-mq5n76odh8] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-mq5n76odh8] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-mq5n76odh8] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-mq5n76odh8] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-mq5n76odh8] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.emergency-dispatch-page[b-mq5n76odh8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-mq5n76odh8] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-mq5n76odh8] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-mq5n76odh8] { background: #6e7d77; }
.status-overview-card.assigned > span[b-mq5n76odh8] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-mq5n76odh8] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-mq5n76odh8] { background: #ad721a; }
.status-overview-card.completed > span[b-mq5n76odh8] { background: var(--theme-primary); }

.asset-number-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-mq5n76odh8] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-mq5n76odh8] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-mq5n76odh8] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-mq5n76odh8] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-mq5n76odh8] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-mq5n76odh8] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-mq5n76odh8],
.schedule-cell[b-mq5n76odh8],
.budget-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-mq5n76odh8],
.schedule-cell strong[b-mq5n76odh8],
.budget-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-mq5n76odh8],
.schedule-cell small[b-mq5n76odh8],
.budget-cell small[b-mq5n76odh8] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-mq5n76odh8],
.schedule-cell.overdue small[b-mq5n76odh8] {
    color: #b3463d;
}

.budget-cell strong[b-mq5n76odh8] {
    color: #9c7932;
}

.progress-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-mq5n76odh8] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-mq5n76odh8] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-mq5n76odh8] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-mq5n76odh8] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-mq5n76odh8] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-mq5n76odh8] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-mq5n76odh8] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-mq5n76odh8] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-mq5n76odh8] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-mq5n76odh8] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-mq5n76odh8] {
    display: block;
}

.picker-photo[b-mq5n76odh8] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-mq5n76odh8] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-mq5n76odh8] {
    min-width: 0;
}

.picker-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-mq5n76odh8] {
    min-width: 0;
}

.picker-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-mq5n76odh8] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-mq5n76odh8] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-mq5n76odh8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-mq5n76odh8] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-mq5n76odh8] {
    font-size: .47rem;
}

.selected-source-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-mq5n76odh8] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-mq5n76odh8] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-mq5n76odh8] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-mq5n76odh8] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-mq5n76odh8] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-mq5n76odh8] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-mq5n76odh8] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-mq5n76odh8] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.dispatch-command-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.dispatch-command-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.dispatch-command-banner .banner-technician[b-mq5n76odh8] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-mq5n76odh8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.dispatch-command-banner small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .48rem;
}

.dispatch-command-banner strong[b-mq5n76odh8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-mq5n76odh8] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-mq5n76odh8] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-mq5n76odh8] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-mq5n76odh8] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-mq5n76odh8] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-mq5n76odh8] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-mq5n76odh8] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-mq5n76odh8] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-mq5n76odh8] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-mq5n76odh8] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-mq5n76odh8] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-mq5n76odh8],
.history-meta b[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-mq5n76odh8] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-mq5n76odh8] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-mq5n76odh8] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .dispatch-command-banner[b-mq5n76odh8],
    .four-columns[b-mq5n76odh8] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-mq5n76odh8] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .dispatch-command-banner[b-mq5n76odh8],
    .detail-note-grid[b-mq5n76odh8],
    .four-columns[b-mq5n76odh8] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-mq5n76odh8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-mq5n76odh8] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-mq5n76odh8],
    .source-picker-card[b-mq5n76odh8],
    .selected-info-grid[b-mq5n76odh8] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-mq5n76odh8] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-mq5n76odh8] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-mq5n76odh8] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-mq5n76odh8] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-mq5n76odh8] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.emergency-dispatch-page[b-mq5n76odh8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-mq5n76odh8] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-mq5n76odh8] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-mq5n76odh8] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-mq5n76odh8] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-mq5n76odh8] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-mq5n76odh8],
.asset-location-cell[b-mq5n76odh8],
.department-cell[b-mq5n76odh8],
.status-condition-cell[b-mq5n76odh8],
.value-cell[b-mq5n76odh8],
.inspection-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-mq5n76odh8],
.asset-location-cell strong[b-mq5n76odh8],
.department-cell strong[b-mq5n76odh8],
.value-cell strong[b-mq5n76odh8],
.inspection-cell strong[b-mq5n76odh8] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-mq5n76odh8],
.asset-location-cell small[b-mq5n76odh8],
.department-cell small[b-mq5n76odh8],
.value-cell small[b-mq5n76odh8],
.inspection-cell small[b-mq5n76odh8] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-mq5n76odh8] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-mq5n76odh8] {
    width: fit-content;
}

.status-condition-cell[b-mq5n76odh8] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-mq5n76odh8],
.inspection-cell.overdue small[b-mq5n76odh8] {
    color: #b3463d;
}

.condition-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-mq5n76odh8] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-mq5n76odh8] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-mq5n76odh8] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-mq5n76odh8] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-mq5n76odh8] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-mq5n76odh8] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-mq5n76odh8] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-mq5n76odh8] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-mq5n76odh8] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-mq5n76odh8] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-mq5n76odh8] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.dispatch-photo-upload-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.dispatch-command-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.dispatch-command-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.dispatch-command-banner .asset-banner-icon[b-mq5n76odh8] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-mq5n76odh8] {
    font-size: 1.7rem;
}

.dispatch-command-banner small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.dispatch-command-banner strong[b-mq5n76odh8] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-mq5n76odh8] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-mq5n76odh8] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-mq5n76odh8] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-mq5n76odh8] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-mq5n76odh8] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-mq5n76odh8] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.emergency-dispatch-page[b-mq5n76odh8]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-mq5n76odh8] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-mq5n76odh8] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-mq5n76odh8] {
    font-style: normal;
}

.asset-location-panel a[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-mq5n76odh8] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-mq5n76odh8] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-mq5n76odh8] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-mq5n76odh8] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .dispatch-photo-upload-grid[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner > div:nth-child(4)[b-mq5n76odh8],
    .dispatch-command-banner > div:nth-child(5)[b-mq5n76odh8] {
        grid-column: auto;
    }

    .inspection-date-grid[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .dispatch-photo-upload-grid[b-mq5n76odh8],
    .asset-value-preview[b-mq5n76odh8],
    .asset-detail-note-grid[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner .asset-banner-icon[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-mq5n76odh8] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-mq5n76odh8] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-mq5n76odh8] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-mq5n76odh8],
    .emergency-dispatch-page[b-mq5n76odh8]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY CENTER PREMIUM
   ========================================================= */

.emergency-dispatch-page[b-mq5n76odh8] {
    --emergency-red: #b83f35;
    --emergency-deep: #651e1a;
    --emergency-soft: #fff1ef;
    --command-navy: #263b4a;
}

.dispatch-hero[b-mq5n76odh8] {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255, 177, 144, .18),
            transparent 23rem),
        radial-gradient(
            circle at 16% 80%,
            rgba(201, 166, 93, .13),
            transparent 19rem),
        linear-gradient(
            135deg,
            #6f211c 0%,
            #421411 54%,
            #24100f 100%) !important;
}

.hero-alert-line[b-mq5n76odh8] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffb28e 18%,
            #f6db9f 50%,
            #ffb28e 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(255, 153, 112, .55);
}

.emergency-online .status-dot[b-mq5n76odh8] {
    background: #ffb28e !important;

    box-shadow:
        0 0 0 5px rgba(255, 178, 142, .15),
        0 0 14px rgba(255, 178, 142, .78) !important;
}

.emergency-dispatch-page[b-mq5n76odh8]  .hero-add-button,
.emergency-dispatch-page[b-mq5n76odh8]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #d95e46,
            #a72f29) !important;

    box-shadow:
        0 11px 24px rgba(119, 31, 25, .28) !important;
}

.summary-card.critical[b-mq5n76odh8] {
    --summary-accent: #bd3e35;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 62, 53, .20);
}

.summary-card.active[b-mq5n76odh8] {
    --summary-accent: #8b529f;
    --summary-soft: #f3eafb;
    --summary-border: rgba(139, 82, 159, .20);
}

.summary-card.sla[b-mq5n76odh8] {
    --summary-accent: #c27a22;
    --summary-soft: #fff3df;
    --summary-border: rgba(194, 122, 34, .20);
}

.summary-card.resolved[b-mq5n76odh8] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.emergency-dispatch-page[b-mq5n76odh8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.new > span[b-mq5n76odh8] {
    background: #bd3e35;
}

.status-overview-card.dispatched > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.active > span[b-mq5n76odh8] {
    background: #8b529f;
}

.status-overview-card.over-sla > span[b-mq5n76odh8] {
    background: #c27a22;
}

.status-overview-card.resolved > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.incident-code-photo-cell[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 152px;
    align-items: center;
    gap: 8px;
}

.incident-photo-mini[b-mq5n76odh8] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(184, 63, 53, .12);
    border-radius: 12px;

    color: #b83f35;
    background: #fff2f0;
}

.incident-photo-mini button[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.incident-photo-mini img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.incident-code-photo-cell > div:last-child[b-mq5n76odh8] {
    min-width: 0;
}

.incident-code-photo-cell strong[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(184, 63, 53, .14);
    border-radius: 8px;

    color: #a3362f;
    background: #fff3f1;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.incident-code-photo-cell small[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-subject-cell[b-mq5n76odh8],
.priority-status-cell[b-mq5n76odh8],
.response-unit-cell[b-mq5n76odh8],
.sla-cell[b-mq5n76odh8],
.responder-cell[b-mq5n76odh8],
.latest-update-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.incident-subject-cell[b-mq5n76odh8] {
    gap: 4px;
}

.incident-subject-cell strong[b-mq5n76odh8],
.response-unit-cell strong[b-mq5n76odh8],
.sla-cell strong[b-mq5n76odh8],
.responder-cell strong[b-mq5n76odh8],
.latest-update-cell strong[b-mq5n76odh8] {
    color: #3f4e49;
    font-size: .56rem;
    line-height: 1.48;
}

.incident-subject-cell small[b-mq5n76odh8],
.response-unit-cell small[b-mq5n76odh8],
.sla-cell small[b-mq5n76odh8],
.responder-cell small[b-mq5n76odh8],
.latest-update-cell small[b-mq5n76odh8] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.response-unit-cell em[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e8f3f9;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.priority-status-cell[b-mq5n76odh8] {
    align-items: flex-start;
    gap: 5px;
}

.sla-cell.overdue strong[b-mq5n76odh8],
.sla-cell.overdue small[b-mq5n76odh8] {
    color: #b13e36;
}

.latest-update-cell small[b-mq5n76odh8] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.type-chip[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5b625e;
    background: #edf1ef;

    font-size: .41rem;
    font-weight: 700;
}

.type-chip.fire[b-mq5n76odh8] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-mq5n76odh8] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-mq5n76odh8] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-mq5n76odh8] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-mq5n76odh8] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-mq5n76odh8] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-mq5n76odh8] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-mq5n76odh8] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-mq5n76odh8] {
    color: #815f43;
    background: #f2e9df;
}

.priority-chip.critical[b-mq5n76odh8] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d65043,
            #9f2e29);

    box-shadow:
        0 5px 13px rgba(159, 46, 41, .18);
}

.priority-chip.urgent[b-mq5n76odh8] {
    color: #a33c32;
    background: #ffe4df;
}

.priority-chip.high[b-mq5n76odh8] {
    color: #a46622;
    background: #fff0d8;
}

.priority-chip.normal[b-mq5n76odh8] {
    color: #39745a;
    background: #e7f5ee;
}

.status-chip.new[b-mq5n76odh8] {
    color: #ad382f;
    background: #fff0ee;
}

.status-chip.dispatched[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.on-scene[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in-progress[b-mq5n76odh8] {
    color: #7d4c96;
    background: #f3e9fa;
}

.status-chip.resolved[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.closed[b-mq5n76odh8] {
    color: #3d6657;
    background: #e9f1ed;
}

.status-chip.cancelled[b-mq5n76odh8] {
    color: #697770;
    background: #edf1ef;
}

.anonymous-switch-card[b-mq5n76odh8] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 12px;

    background: #fff8f7;
}

.dispatch-photo-upload-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.privacy-note[b-mq5n76odh8] {
    margin-top: 12px;
}

.dispatch-command-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        70px
        minmax(160px, 1fr)
        minmax(150px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 16px;

    background: rgba(184, 63, 53, .10);

    box-shadow:
        0 12px 30px rgba(88, 31, 26, .07);
}

.dispatch-command-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 182, 148, .08),
            transparent 12rem),
        #fff;
}

.dispatch-command-banner .command-icon[b-mq5n76odh8] {
    color: #ffd5c3;
    background:
        linear-gradient(
            145deg,
            #8c2b25,
            #4c1714);
}

.command-icon .mud-icon-root[b-mq5n76odh8] {
    font-size: 1.7rem;
}

.dispatch-command-banner small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.dispatch-command-banner strong[b-mq5n76odh8] {
    margin-top: 4px;

    color: #3f4e49;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.response-timeline-overview[b-mq5n76odh8] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 177, 144, .09),
            transparent 18rem),
        #fbf9f8;
}

.response-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.response-heading small[b-mq5n76odh8] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.response-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #3f4e49;
    font-size: .74rem;
}

.response-badge[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.response-badge.normal[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.response-badge.overdue[b-mq5n76odh8] {
    color: #ad382f;
    background: #fff0ee;
}

.response-time-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.response-time-grid > div[b-mq5n76odh8] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(184, 63, 53, .07);
    border-radius: 10px;

    background: #fff;
}

.response-time-grid span[b-mq5n76odh8] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.response-time-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: #3f4e49;
    font-size: .51rem;
}

.dispatch-location-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.dispatch-location-panel > span[b-mq5n76odh8] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.dispatch-location-panel small[b-mq5n76odh8] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.dispatch-location-panel h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.dispatch-location-panel p[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.dispatch-location-panel p em[b-mq5n76odh8] {
    font-style: normal;
}

.dispatch-location-panel b[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.dispatch-location-panel a[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.dispatch-note-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.dispatch-note-grid > div[b-mq5n76odh8] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.dispatch-note-grid .danger-note[b-mq5n76odh8] {
    border-color: rgba(184, 63, 53, .13);
    background: #fff7f5;
}

.dispatch-note-grid .risk-note[b-mq5n76odh8] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.dispatch-note-grid small[b-mq5n76odh8] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
}

.dispatch-note-grid p[b-mq5n76odh8] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6b5148;
    background: #f4ece8;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-mq5n76odh8] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-mq5n76odh8] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .dispatch-photo-upload-grid[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .response-time-grid[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .dispatch-photo-upload-grid[b-mq5n76odh8],
    .dispatch-note-grid[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner .command-icon[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }

    .response-time-grid[b-mq5n76odh8],
    .three-columns[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .dispatch-location-panel[b-mq5n76odh8] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .dispatch-location-panel a[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-mq5n76odh8] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-mq5n76odh8],
    .emergency-dispatch-page[b-mq5n76odh8]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY DISPATCH & TEAM ASSIGNMENT PREMIUM
   ========================================================= */

.emergency-dispatch-page[b-mq5n76odh8] {
    --dispatch-purple: #6e4d91;
    --dispatch-deep: #352441;
    --dispatch-soft: #f4effa;
    --dispatch-gold: #c99f52;
}

.dispatch-hero[b-mq5n76odh8] {
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(200, 166, 238, .20),
            transparent 24rem),
        radial-gradient(
            circle at 14% 80%,
            rgba(201, 166, 93, .14),
            transparent 19rem),
        linear-gradient(
            135deg,
            #49325e 0%,
            #30213e 54%,
            #1e1527 100%) !important;
}

.hero-command-line[b-mq5n76odh8] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c9a6ee 18%,
            #f2d69e 50%,
            #c9a6ee 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(184, 139, 226, .50);
}

.dispatch-online .status-dot[b-mq5n76odh8] {
    background: #cba8ec !important;

    box-shadow:
        0 0 0 5px rgba(203, 168, 236, .15),
        0 0 14px rgba(203, 168, 236, .78) !important;
}

.emergency-dispatch-page[b-mq5n76odh8]  .hero-add-button,
.emergency-dispatch-page[b-mq5n76odh8]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #845baa,
            #594075) !important;

    box-shadow:
        0 11px 24px rgba(64, 42, 84, .28) !important;
}

.summary-card.pending[b-mq5n76odh8] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.moving[b-mq5n76odh8] {
    --summary-accent: #2d78a4;
    --summary-soft: #e6f2f9;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.scene[b-mq5n76odh8] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.eta[b-mq5n76odh8] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.emergency-dispatch-page[b-mq5n76odh8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-mq5n76odh8] {
    grid-template-columns:
        repeat(7, minmax(0, 1fr)) !important;
}

.status-overview-card.draft > span[b-mq5n76odh8] {
    background: #7658a7;
}

.status-overview-card.dispatched > span[b-mq5n76odh8] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-mq5n76odh8] {
    background: var(--theme-primary);
}

.status-overview-card.en-route > span[b-mq5n76odh8] {
    background: #557d9c;
}

.status-overview-card.on-scene > span[b-mq5n76odh8] {
    background: #8b529f;
}

.status-overview-card.completed > span[b-mq5n76odh8] {
    background: #3f8650;
}

.dispatch-code-photo-cell[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.dispatch-photo-mini[b-mq5n76odh8] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 12px;

    color: #6e4d91;
    background: #f4effa;
}

.dispatch-photo-mini button[b-mq5n76odh8] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.dispatch-photo-mini img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-code-photo-cell > div:last-child[b-mq5n76odh8] {
    min-width: 0;
}

.dispatch-code-photo-cell strong[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(110, 77, 145, .14);
    border-radius: 8px;

    color: #68498a;
    background: #f7f2fb;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.dispatch-code-photo-cell small[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: #9c7932;
    font-size: .43rem;
    font-weight: 650;
}

.source-incident-cell[b-mq5n76odh8],
.team-cell[b-mq5n76odh8],
.assignment-status-cell[b-mq5n76odh8],
.vehicle-cell[b-mq5n76odh8],
.responder-cell[b-mq5n76odh8],
.latest-update-cell[b-mq5n76odh8] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.source-incident-cell[b-mq5n76odh8] {
    min-width: 190px;
}

.source-incident-cell > div[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.source-incident-cell strong[b-mq5n76odh8],
.team-cell strong[b-mq5n76odh8],
.vehicle-cell strong[b-mq5n76odh8],
.responder-cell strong[b-mq5n76odh8],
.latest-update-cell strong[b-mq5n76odh8] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.48;
}

.source-incident-cell small[b-mq5n76odh8],
.team-cell small[b-mq5n76odh8],
.vehicle-cell small[b-mq5n76odh8],
.responder-cell small[b-mq5n76odh8],
.latest-update-cell small[b-mq5n76odh8] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.team-cell em[b-mq5n76odh8] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6e4d91;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.assignment-status-cell[b-mq5n76odh8] {
    align-items: flex-start;
    gap: 5px;
}

.assignment-status-cell small[b-mq5n76odh8] {
    color: #687a73;
    font-size: .43rem;
    font-weight: 650;
}

.assignment-status-cell small.eta-overdue[b-mq5n76odh8] {
    color: #b13e36;
}

.latest-update-cell small[b-mq5n76odh8] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.status-chip.draft[b-mq5n76odh8] {
    color: #6e4d91;
    background: #f0eafb;
}

.status-chip.dispatched[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.accepted[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.en-route[b-mq5n76odh8] {
    color: #476f8e;
    background: #eaf2f7;
}

.status-chip.on-scene[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-mq5n76odh8] {
    color: #347849;
    background: #e7f5ec;
}

.status-chip.cancelled[b-mq5n76odh8] {
    color: #697770;
    background: #edf1ef;
}

.incident-status-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #4b655c;
    background: #edf3f0;

    font-size: .42rem;
    font-weight: 700;
}

.incident-status-chip.new[b-mq5n76odh8] {
    color: #ad382f;
    background: #fff0ee;
}

.incident-status-chip.dispatched[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.incident-status-chip.on-scene[b-mq5n76odh8],
.incident-status-chip.in-progress[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.source-incident-picker[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-incident-card[b-mq5n76odh8] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(110, 77, 145, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(63, 42, 82, .06);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-incident-card:hover[b-mq5n76odh8] {
    transform: translateY(-2px);

    border-color: rgba(110, 77, 145, .30);

    box-shadow:
        0 15px 31px rgba(63, 42, 82, .12);
}

.source-incident-card.selected[b-mq5n76odh8] {
    border: 2px solid #7658a7;

    box-shadow:
        0 0 0 4px rgba(118, 88, 167, .09),
        0 16px 34px rgba(63, 42, 82, .14);
}

.source-picker-cover[b-mq5n76odh8] {
    position: relative;

    display: grid;
    height: 125px;
    overflow: hidden;

    place-items: center;

    color: #7658a7;
    background:
        radial-gradient(
            circle,
            rgba(118, 88, 167, .13),
            transparent 58%),
        #f2eef7;
}

.source-picker-cover img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-mq5n76odh8] {
    font-size: 2rem;
}

.priority-badge[b-mq5n76odh8] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(75, 84, 79, .84);

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.priority-badge.critical[b-mq5n76odh8] {
    background: rgba(183, 57, 48, .92);
}

.priority-badge.urgent[b-mq5n76odh8] {
    background: rgba(190, 101, 31, .92);
}

.priority-badge.high[b-mq5n76odh8] {
    background: rgba(166, 111, 35, .92);
}

.priority-badge.normal[b-mq5n76odh8] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-mq5n76odh8] {
    padding: 10px;
}

.source-picker-content > small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-mq5n76odh8] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-mq5n76odh8] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.received-chip[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #476f8e;
    background: #eaf2f7;

    font-family: 'Kanit', sans-serif;
    font-size: .39rem;
    font-weight: 650;
}

.source-empty-alert[b-mq5n76odh8] {
    margin-bottom: 16px;
}

.locked-incident-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .11),
            transparent 20rem),
        #faf8fc;
}

.locked-incident-cover[b-mq5n76odh8] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #7658a7;
    background: #eee8f4;
}

.locked-incident-cover img[b-mq5n76odh8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-incident-cover .mud-icon-root[b-mq5n76odh8] {
    font-size: 2.4rem;
}

.locked-incident-content[b-mq5n76odh8] {
    min-width: 0;
}

.locked-incident-heading[b-mq5n76odh8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-incident-heading small[b-mq5n76odh8] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-incident-heading h3[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .83rem;
}

.locked-incident-heading p[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #7658a7;
    font-size: .50rem;
    font-weight: 700;
}

.locked-incident-badges[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-mq5n76odh8] {
    margin: 10px 0 0;

    color: var(--theme-muted);
    font-size: .55rem;
    line-height: 1.72;
}

.locked-incident-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-incident-grid > div[b-mq5n76odh8] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(110, 77, 145, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-incident-grid span[b-mq5n76odh8] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-incident-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-risk-note[b-mq5n76odh8] {
    display: flex;
    min-height: 38px;

    align-items: center;
    gap: 7px;

    margin-top: 9px;
    padding: 8px 10px;

    border: 1px solid rgba(194, 122, 34, .16);
    border-radius: 10px;

    color: #8f621d;
    background: #fff9ed;

    font-size: .46rem;
}

.source-panel-actions[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-mq5n76odh8],
.source-panel-actions button[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(110, 77, 145, .16);
    border-radius: 9px;

    color: #68498a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.source-link-note[b-mq5n76odh8] {
    margin-top: 12px;
}

.dispatch-photo-upload-grid[b-mq5n76odh8] {
    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;
}

.dispatch-command-banner[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        70px
        minmax(150px, 1fr)
        minmax(140px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .75fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 16px;

    background: rgba(110, 77, 145, .10);

    box-shadow:
        0 12px 30px rgba(63, 42, 82, .07);
}

.dispatch-command-banner > div[b-mq5n76odh8] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.dispatch-command-banner .command-banner-icon[b-mq5n76odh8] {
    color: #e5d5ff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3d2c51);
}

.command-banner-icon .mud-icon-root[b-mq5n76odh8] {
    font-size: 1.75rem;
}

.dispatch-command-banner small[b-mq5n76odh8] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.dispatch-command-banner strong[b-mq5n76odh8] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .57rem;
    line-height: 1.45;
    text-align: center;
}

.source-incident-detail[b-mq5n76odh8] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .11),
            transparent 18rem),
        #f9f6fc;
}

.source-detail-icon[b-mq5n76odh8] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3f2d54);

    box-shadow:
        0 10px 22px rgba(63, 42, 82, .20);
}

.source-incident-detail small[b-mq5n76odh8] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-incident-detail h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-incident-detail p[b-mq5n76odh8] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-mq5n76odh8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.dispatch-location-panel[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.dispatch-location-panel > span[b-mq5n76odh8] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.dispatch-location-panel small[b-mq5n76odh8] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.dispatch-location-panel h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.dispatch-location-panel p[b-mq5n76odh8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.dispatch-location-panel p em[b-mq5n76odh8] {
    font-style: normal;
}

.dispatch-location-panel b[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.dispatch-location-panel a[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.dispatch-time-panel[b-mq5n76odh8] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .09),
            transparent 18rem),
        #faf8fc;
}

.dispatch-time-heading[b-mq5n76odh8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dispatch-time-heading small[b-mq5n76odh8] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.dispatch-time-heading h3[b-mq5n76odh8] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .73rem;
}

.eta-badge[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.eta-badge.normal[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.eta-badge.overdue[b-mq5n76odh8] {
    color: #ad382f;
    background: #fff0ee;
}

.eta-badge.arrived[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.dispatch-time-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.dispatch-time-grid > div[b-mq5n76odh8] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(110, 77, 145, .07);
    border-radius: 10px;

    background: #fff;
}

.dispatch-time-grid span[b-mq5n76odh8] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.dispatch-time-grid strong[b-mq5n76odh8] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.dispatch-note-grid[b-mq5n76odh8] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.dispatch-note-grid > div[b-mq5n76odh8] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.dispatch-note-grid .command-note[b-mq5n76odh8] {
    border-color: rgba(110, 77, 145, .14);
    background: #faf7fc;
}

.dispatch-note-grid .safety-note[b-mq5n76odh8] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.dispatch-note-grid small[b-mq5n76odh8] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
}

.dispatch-note-grid p[b-mq5n76odh8] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-mq5n76odh8] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #604d70;
    background: #f0eaf5;

    font-size: .41rem;
    font-style: normal;
}

.four-columns[b-mq5n76odh8] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-mq5n76odh8] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-mq5n76odh8] {
    color: #2d78a4;
    background: #e8f3f9;
}

.attachment-card.assignment span[b-mq5n76odh8] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-mq5n76odh8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1380px) {
    .status-overview[b-mq5n76odh8] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr)) !important;
    }

    .source-incident-picker[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-time-grid[b-mq5n76odh8],
    .four-columns[b-mq5n76odh8] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-incident-panel[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-incident-cover[b-mq5n76odh8] {
        max-height: 310px;
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .locked-incident-grid[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-time-grid[b-mq5n76odh8],
    .four-columns[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .status-overview[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .source-incident-picker[b-mq5n76odh8],
    .dispatch-photo-upload-grid[b-mq5n76odh8],
    .dispatch-note-grid[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .dispatch-command-banner .command-banner-icon[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }

    .dispatch-time-grid[b-mq5n76odh8],
    .four-columns[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .dispatch-location-panel[b-mq5n76odh8] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .dispatch-location-panel a[b-mq5n76odh8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-mq5n76odh8],
    .locked-incident-grid[b-mq5n76odh8],
    .dispatch-command-banner[b-mq5n76odh8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-incident-heading[b-mq5n76odh8] {
        flex-direction: column;
    }

    .locked-incident-badges[b-mq5n76odh8] {
        justify-content: flex-start;
    }

    .view-toolbar-actions[b-mq5n76odh8] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-mq5n76odh8],
    .emergency-dispatch-page[b-mq5n76odh8]  .view-edit-button {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/06Emergency/EmergencyHistory.razor.rz.scp.css */
.emergency-history-page[b-kae7ta56cc] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.emergency-history-page[b-kae7ta56cc]  .emergency-history-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.history-hero[b-kae7ta56cc] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-kae7ta56cc] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-kae7ta56cc] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-kae7ta56cc] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-kae7ta56cc] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-kae7ta56cc] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-kae7ta56cc] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-kae7ta56cc] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-kae7ta56cc] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-kae7ta56cc] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-kae7ta56cc] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-kae7ta56cc] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button,
.emergency-history-page[b-kae7ta56cc]  .search-button,
.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button,
.emergency-history-page[b-kae7ta56cc]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-kae7ta56cc] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-kae7ta56cc] {
    opacity: .55;
    cursor: not-allowed;
}

.emergency-history-page[b-kae7ta56cc]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.emergency-history-page[b-kae7ta56cc]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-kae7ta56cc] {
    margin-top: 7px;
}

.summary-card[b-kae7ta56cc] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-kae7ta56cc] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-kae7ta56cc] {
    color: #2c7da8;
}

.summary-card.pending[b-kae7ta56cc] {
    color: #7658a7;
}

.summary-card.urgent[b-kae7ta56cc] {
    color: #c05b4e;
}

.summary-line[b-kae7ta56cc] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-kae7ta56cc] {
    min-width: 0;
}

.summary-card small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-kae7ta56cc] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-kae7ta56cc] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-kae7ta56cc] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-kae7ta56cc],
.history-list-panel[b-kae7ta56cc] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-kae7ta56cc],
.list-toolbar[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-kae7ta56cc],
.panel-kicker[b-kae7ta56cc] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-kae7ta56cc],
.list-toolbar h2[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-kae7ta56cc],
.list-toolbar p[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-kae7ta56cc] {
    align-items: center;
}

.emergency-history-page[b-kae7ta56cc]  .premium-field,
.emergency-history-page[b-kae7ta56cc]  .form-field {
    width: 100%;
}

.emergency-history-page[b-kae7ta56cc]  .premium-field .mud-input-outlined-border,
.emergency-history-page[b-kae7ta56cc]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.emergency-history-page[b-kae7ta56cc]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.emergency-history-page[b-kae7ta56cc]  .sort-select {
    width: 170px;
}

.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button {
    min-height: 42px;
}

.emergency-history-page[b-kae7ta56cc]  .history-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.emergency-history-page[b-kae7ta56cc]  .history-table .mud-table-head {
    background: #eef6f2;
}

.emergency-history-page[b-kae7ta56cc]  .history-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-kae7ta56cc] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-kae7ta56cc],
.mini-photo-empty[b-kae7ta56cc] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-kae7ta56cc] {
    cursor: zoom-in;
}

.mini-photo-button img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-kae7ta56cc] {
    object-fit: cover;
}

.mini-photo-button small[b-kae7ta56cc] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-kae7ta56cc] {
    color: #9c7b38;
}

.applicant-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-kae7ta56cc],
.applicant-cell small[b-kae7ta56cc] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-kae7ta56cc] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-kae7ta56cc] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-kae7ta56cc],
.channel-chip[b-kae7ta56cc],
.priority-chip[b-kae7ta56cc],
.status-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-kae7ta56cc],
.type-chip.construction[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-kae7ta56cc],
.type-chip.food_license[b-kae7ta56cc],
.type-chip.tax[b-kae7ta56cc] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-kae7ta56cc],
.type-chip.environment[b-kae7ta56cc] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-kae7ta56cc],
.date-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-kae7ta56cc],
.date-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-kae7ta56cc],
.date-cell small[b-kae7ta56cc] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-kae7ta56cc] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-kae7ta56cc] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-kae7ta56cc] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-kae7ta56cc] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-kae7ta56cc] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-kae7ta56cc] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-kae7ta56cc] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.emergency-history-page[b-kae7ta56cc]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.emergency-history-page[b-kae7ta56cc]  .row-action.view {
    color: #2d79a2;
}

.emergency-history-page[b-kae7ta56cc]  .row-action.edit {
    color: var(--theme-primary);
}

.emergency-history-page[b-kae7ta56cc]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.emergency-history-page[b-kae7ta56cc]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-kae7ta56cc] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-kae7ta56cc] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-kae7ta56cc] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-kae7ta56cc] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-kae7ta56cc] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.shelter-form-modal[b-kae7ta56cc],
.history-view-modal[b-kae7ta56cc],
.delete-modal[b-kae7ta56cc] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-kae7ta56cc .22s ease-out;
}

@keyframes modalAppear-b-kae7ta56cc {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.shelter-form-modal[b-kae7ta56cc] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-kae7ta56cc] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-kae7ta56cc] {
    margin-top: 24px;
}

.form-section-title > span[b-kae7ta56cc] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-kae7ta56cc] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-kae7ta56cc] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-kae7ta56cc] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-kae7ta56cc] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-kae7ta56cc] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-kae7ta56cc] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-kae7ta56cc] {
    min-height: 310px;
}

.photo-preview img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-kae7ta56cc] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-kae7ta56cc] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-kae7ta56cc] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-kae7ta56cc],
.remove-photo-button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-kae7ta56cc] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-kae7ta56cc] {
    display: none;
}

.remove-photo-button[b-kae7ta56cc] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.emergency-history-page[b-kae7ta56cc]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.emergency-history-page[b-kae7ta56cc]  .cancel-button,
.emergency-history-page[b-kae7ta56cc]  .save-button,
.emergency-history-page[b-kae7ta56cc]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.emergency-history-page[b-kae7ta56cc]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.emergency-history-page[b-kae7ta56cc]  .save-button {
    min-width: 170px;
}

.history-view-modal[b-kae7ta56cc] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-kae7ta56cc] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-kae7ta56cc] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-kae7ta56cc] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-kae7ta56cc] {
    font-size: 5rem;
}

.view-cover-overlay[b-kae7ta56cc] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-kae7ta56cc] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-kae7ta56cc] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-kae7ta56cc] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-kae7ta56cc] {
    padding: 22px;
}

.view-toolbar[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-kae7ta56cc] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-kae7ta56cc],
.view-info-grid span[b-kae7ta56cc],
.view-description small[b-kae7ta56cc],
.attachment-heading small[b-kae7ta56cc],
.view-note small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-kae7ta56cc] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-kae7ta56cc] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-kae7ta56cc] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-kae7ta56cc] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-kae7ta56cc] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-kae7ta56cc] {
    background: #f3efe5;
}

.attachment-card img[b-kae7ta56cc] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-kae7ta56cc] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-kae7ta56cc] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-kae7ta56cc] {
    font-size: 2.3rem;
}

.view-note[b-kae7ta56cc] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-kae7ta56cc] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-kae7ta56cc] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-kae7ta56cc] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-kae7ta56cc] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-kae7ta56cc] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-kae7ta56cc] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-kae7ta56cc] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-kae7ta56cc] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-kae7ta56cc] {
    color: #963b36;
}

.delete-warning[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.emergency-history-page[b-kae7ta56cc]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .history-hero[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-kae7ta56cc] {
        max-width: 570px;
    }

    .list-toolbar[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-kae7ta56cc] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .emergency-history-page[b-kae7ta56cc] {
        padding: 15px 12px 30px;
    }

    .history-hero[b-kae7ta56cc] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-kae7ta56cc] {
        font-size: 2.3rem;
    }

    .hero-meta[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-kae7ta56cc] {
        width: 100%;
    }

    .filter-heading[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }

    .emergency-history-page[b-kae7ta56cc]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-kae7ta56cc] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-kae7ta56cc],
    .attachment-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-kae7ta56cc],
    .view-info-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-kae7ta56cc] {
        align-items: end;
        padding: 0;
    }

    .shelter-form-modal[b-kae7ta56cc],
    .history-view-modal[b-kae7ta56cc] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-kae7ta56cc] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-kae7ta56cc],
    .history-list-panel[b-kae7ta56cc] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-kae7ta56cc] {
        align-items: flex-start;
    }

    .modal-icon[b-kae7ta56cc] {
        display: none;
    }

    .modal-footer[b-kae7ta56cc] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .emergency-history-page[b-kae7ta56cc]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-kae7ta56cc] {
        padding: 0;
    }

    .image-preview-modal[b-kae7ta56cc] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-kae7ta56cc],
    .shelter-form-modal[b-kae7ta56cc],
    .history-view-modal[b-kae7ta56cc],
    .delete-modal[b-kae7ta56cc] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-kae7ta56cc] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-kae7ta56cc],
.status-overview-card.selected[b-kae7ta56cc] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-kae7ta56cc] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-kae7ta56cc] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-kae7ta56cc] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-kae7ta56cc] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-kae7ta56cc] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-kae7ta56cc] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-kae7ta56cc],
.complainant-cell small[b-kae7ta56cc] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-kae7ta56cc] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-kae7ta56cc] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-kae7ta56cc] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-kae7ta56cc] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-kae7ta56cc] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-kae7ta56cc] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-kae7ta56cc] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-kae7ta56cc] {
    min-width: 116px;
}

.privacy-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-kae7ta56cc] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-kae7ta56cc] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-kae7ta56cc],
.status-chip.cancelled[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-kae7ta56cc] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-kae7ta56cc] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-kae7ta56cc] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-kae7ta56cc] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-kae7ta56cc] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-kae7ta56cc] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-kae7ta56cc] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-kae7ta56cc],
.evidence-preview[b-kae7ta56cc] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.history-view-modal[b-kae7ta56cc] {
    width: min(100%, 920px);
}

.desired-resolution[b-kae7ta56cc],
.screening-panel[b-kae7ta56cc],
.attachment-panel[b-kae7ta56cc] {
    margin-top: 15px;
}

.desired-resolution[b-kae7ta56cc] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-kae7ta56cc],
.screening-panel small[b-kae7ta56cc],
.section-heading small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-kae7ta56cc],
.screening-panel p[b-kae7ta56cc] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-kae7ta56cc] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-kae7ta56cc] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-kae7ta56cc] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-kae7ta56cc] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-kae7ta56cc] {
    background: #f3efe5;
}

.attachment-card img[b-kae7ta56cc] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-kae7ta56cc] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-kae7ta56cc] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-kae7ta56cc] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-kae7ta56cc] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-kae7ta56cc],
    .screening-panel[b-kae7ta56cc],
    .attachment-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-kae7ta56cc] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-kae7ta56cc] {
    background: #aa453e;
}

.summary-card.overdue[b-kae7ta56cc],
.summary-card.urgent[b-kae7ta56cc] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-kae7ta56cc] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-kae7ta56cc] {
    min-width: 150px;
}

.progress-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-kae7ta56cc],
.latest-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-kae7ta56cc],
.latest-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-kae7ta56cc],
.latest-cell small[b-kae7ta56cc] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-kae7ta56cc],
.due-cell.overdue small[b-kae7ta56cc] {
    color: #b54842;
}

.overdue-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-kae7ta56cc] {
    margin-top: 8px;
}

.form-progress-preview[b-kae7ta56cc] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-kae7ta56cc] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-kae7ta56cc],
.history-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-kae7ta56cc],
.section-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-kae7ta56cc],
.section-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-kae7ta56cc],
.section-heading h3[b-kae7ta56cc] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-kae7ta56cc]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-kae7ta56cc] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-kae7ta56cc] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-kae7ta56cc]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-kae7ta56cc] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-kae7ta56cc] {
    padding-bottom: 0;
}

.timeline-marker[b-kae7ta56cc] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-kae7ta56cc] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-kae7ta56cc] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-kae7ta56cc] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-kae7ta56cc] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-kae7ta56cc],
.timeline-item.cancelled .timeline-marker[b-kae7ta56cc] {
    background: #aa453e;
}

.timeline-content[b-kae7ta56cc] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-kae7ta56cc] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-kae7ta56cc] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-kae7ta56cc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-kae7ta56cc] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-kae7ta56cc] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-kae7ta56cc] {
    color: #2d78a4;
}

.summary-card.progress[b-kae7ta56cc] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-kae7ta56cc] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-kae7ta56cc] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-kae7ta56cc] {
    background: #aa453e;
}

.tracking-number-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-kae7ta56cc] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-kae7ta56cc],
.assigned-by-cell[b-kae7ta56cc],
.latest-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-kae7ta56cc],
.assigned-by-cell strong[b-kae7ta56cc],
.latest-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-kae7ta56cc],
.assigned-by-cell small[b-kae7ta56cc],
.latest-cell small[b-kae7ta56cc] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-kae7ta56cc] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-kae7ta56cc],
.status-chip.cancelled[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-kae7ta56cc] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-kae7ta56cc] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.history-view-modal[b-kae7ta56cc] {
    width: min(100%, 940px);
}

.tracking-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-kae7ta56cc],
.banner-officer[b-kae7ta56cc],
.banner-due[b-kae7ta56cc],
.banner-progress[b-kae7ta56cc] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-kae7ta56cc] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-kae7ta56cc] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-kae7ta56cc],
.detail-note-grid[b-kae7ta56cc],
.history-panel[b-kae7ta56cc],
.attachment-panel[b-kae7ta56cc] {
    margin-top: 15px;
}

.assignment-instruction[b-kae7ta56cc] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-kae7ta56cc],
.detail-note-grid small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-kae7ta56cc],
.detail-note-grid p[b-kae7ta56cc] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-kae7ta56cc] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-kae7ta56cc] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-kae7ta56cc] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-kae7ta56cc]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-kae7ta56cc],
.timeline-item.cancelled .timeline-marker[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-kae7ta56cc],
.evidence-preview[b-kae7ta56cc] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-kae7ta56cc],
    .detail-note-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-kae7ta56cc] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-kae7ta56cc] {
    width: 100%;
}

.available-count-card[b-kae7ta56cc] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-kae7ta56cc] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-kae7ta56cc] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-kae7ta56cc] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-kae7ta56cc]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-kae7ta56cc]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-kae7ta56cc] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-kae7ta56cc] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-kae7ta56cc] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-kae7ta56cc] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.55rem;
}

.picker-photo[b-kae7ta56cc] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-kae7ta56cc] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-kae7ta56cc] {
    font-size: 2rem;
}

.picker-content[b-kae7ta56cc] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-kae7ta56cc] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-kae7ta56cc] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-kae7ta56cc] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-kae7ta56cc] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-kae7ta56cc] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-kae7ta56cc] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-kae7ta56cc] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-kae7ta56cc] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-kae7ta56cc] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-kae7ta56cc] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-kae7ta56cc] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-kae7ta56cc] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-kae7ta56cc] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-kae7ta56cc] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-kae7ta56cc] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-kae7ta56cc] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-kae7ta56cc] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-kae7ta56cc] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-kae7ta56cc],
    .selected-complaint-panel[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-kae7ta56cc] {
        min-height: 220px;
    }

    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-kae7ta56cc] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-kae7ta56cc] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-kae7ta56cc] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-kae7ta56cc] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-kae7ta56cc] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-kae7ta56cc] {
    color: #b47b22;
}

.summary-card.overdue[b-kae7ta56cc] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-kae7ta56cc] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-kae7ta56cc] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-kae7ta56cc] {
    background: #75837d;
}

.status-overview-card.completed > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-kae7ta56cc] {
    background: #bc4d45;
}

.tracking-number-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-kae7ta56cc] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-kae7ta56cc],
.progress-cell[b-kae7ta56cc],
.followup-cell[b-kae7ta56cc],
.latest-cell[b-kae7ta56cc],
.department-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-kae7ta56cc],
.followup-cell strong[b-kae7ta56cc],
.latest-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-kae7ta56cc],
.followup-cell small[b-kae7ta56cc],
.latest-cell small[b-kae7ta56cc] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-kae7ta56cc] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-kae7ta56cc] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-kae7ta56cc] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-kae7ta56cc] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-kae7ta56cc] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-kae7ta56cc] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-kae7ta56cc] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-kae7ta56cc] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-kae7ta56cc] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-kae7ta56cc] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-kae7ta56cc] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-kae7ta56cc] {
    width: 100%;
}

.source-picker-list[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-kae7ta56cc] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-kae7ta56cc] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-kae7ta56cc] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-kae7ta56cc] {
    display: block;
}

.picker-photo[b-kae7ta56cc] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-kae7ta56cc] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-kae7ta56cc] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-kae7ta56cc] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-kae7ta56cc] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-kae7ta56cc],
.picker-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-kae7ta56cc] {
    gap: 8px 12px;
}

.picker-meta span[b-kae7ta56cc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-kae7ta56cc] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-kae7ta56cc] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-kae7ta56cc] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-kae7ta56cc] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-kae7ta56cc] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-kae7ta56cc] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-kae7ta56cc] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-kae7ta56cc] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-kae7ta56cc] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-kae7ta56cc] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-kae7ta56cc] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-kae7ta56cc] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-kae7ta56cc] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-kae7ta56cc],
.attachment-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-kae7ta56cc] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-kae7ta56cc]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-kae7ta56cc] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-kae7ta56cc] {
    background: #e7f2f9;
}

.attachment-card.after[b-kae7ta56cc] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-kae7ta56cc],
.after-preview[b-kae7ta56cc] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-kae7ta56cc],
    .selected-source-panel[b-kae7ta56cc],
    .tracking-banner[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-kae7ta56cc] {
        min-height: 220px;
    }

    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-kae7ta56cc] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-kae7ta56cc] {
    color: var(--theme-primary);
}

.summary-card.sla[b-kae7ta56cc] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-kae7ta56cc] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-kae7ta56cc] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-kae7ta56cc] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.asset-number-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-kae7ta56cc] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-kae7ta56cc] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-kae7ta56cc] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-kae7ta56cc] {
    font-size: .36rem;
}

.resolution-chip[b-kae7ta56cc],
.publication-chip[b-kae7ta56cc],
.sla-chip[b-kae7ta56cc],
.source-sla-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-kae7ta56cc] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-kae7ta56cc],
.source-sla-chip.within[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-kae7ta56cc],
.source-sla-chip.over[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-kae7ta56cc],
.closed-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-kae7ta56cc],
.closed-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-kae7ta56cc],
.closed-cell small[b-kae7ta56cc] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-kae7ta56cc] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-kae7ta56cc] {
    color: #aa453e;
}

.score-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-kae7ta56cc] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-kae7ta56cc] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-kae7ta56cc] {
    color: #d0a43f;
}

.score-cell small[b-kae7ta56cc] {
    color: #8c9893;
    font-size: .47rem;
}

.shelter-capacity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.shelter-capacity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.shelter-capacity-banner .banner-department[b-kae7ta56cc] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.shelter-capacity-banner small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .48rem;
}

.shelter-capacity-banner strong[b-kae7ta56cc] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-kae7ta56cc] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-kae7ta56cc] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-kae7ta56cc] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-kae7ta56cc] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-kae7ta56cc] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-kae7ta56cc] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-kae7ta56cc] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-kae7ta56cc] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-kae7ta56cc] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-kae7ta56cc] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-kae7ta56cc] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-kae7ta56cc] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-kae7ta56cc] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-kae7ta56cc] {
    display: block;
}

@media (max-width: 1200px) {
    .shelter-capacity-banner[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-capacity-banner[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-kae7ta56cc] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-kae7ta56cc] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-kae7ta56cc] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-kae7ta56cc] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-kae7ta56cc] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-kae7ta56cc] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-kae7ta56cc] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-kae7ta56cc] { background: #6e7d77; }
.status-overview-card.assigned > span[b-kae7ta56cc] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-kae7ta56cc] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-kae7ta56cc] { background: #ad721a; }
.status-overview-card.completed > span[b-kae7ta56cc] { background: var(--theme-primary); }

.asset-number-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-kae7ta56cc] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-kae7ta56cc] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-kae7ta56cc] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-kae7ta56cc] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-kae7ta56cc] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-kae7ta56cc] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-kae7ta56cc],
.schedule-cell[b-kae7ta56cc],
.budget-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-kae7ta56cc],
.schedule-cell strong[b-kae7ta56cc],
.budget-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-kae7ta56cc],
.schedule-cell small[b-kae7ta56cc],
.budget-cell small[b-kae7ta56cc] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-kae7ta56cc],
.schedule-cell.overdue small[b-kae7ta56cc] {
    color: #b3463d;
}

.budget-cell strong[b-kae7ta56cc] {
    color: #9c7932;
}

.progress-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-kae7ta56cc] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-kae7ta56cc] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-kae7ta56cc] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-kae7ta56cc] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-kae7ta56cc] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-kae7ta56cc] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-kae7ta56cc] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-kae7ta56cc] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-kae7ta56cc] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-kae7ta56cc] {
    display: block;
}

.picker-photo[b-kae7ta56cc] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-kae7ta56cc] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-kae7ta56cc] {
    min-width: 0;
}

.picker-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-kae7ta56cc] {
    min-width: 0;
}

.picker-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-kae7ta56cc] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-kae7ta56cc] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-kae7ta56cc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-kae7ta56cc] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-kae7ta56cc] {
    font-size: .47rem;
}

.selected-source-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-kae7ta56cc] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-kae7ta56cc] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-kae7ta56cc] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-kae7ta56cc] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-kae7ta56cc] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-kae7ta56cc] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-kae7ta56cc] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-kae7ta56cc] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.shelter-capacity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.shelter-capacity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.shelter-capacity-banner .banner-technician[b-kae7ta56cc] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-kae7ta56cc] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.shelter-capacity-banner small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .48rem;
}

.shelter-capacity-banner strong[b-kae7ta56cc] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-kae7ta56cc] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-kae7ta56cc] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-kae7ta56cc] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-kae7ta56cc] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-kae7ta56cc] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-kae7ta56cc] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-kae7ta56cc] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-kae7ta56cc] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-kae7ta56cc] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-kae7ta56cc] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-kae7ta56cc] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-kae7ta56cc],
.history-meta b[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-kae7ta56cc] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-kae7ta56cc] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-kae7ta56cc] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .shelter-capacity-banner[b-kae7ta56cc],
    .four-columns[b-kae7ta56cc] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-kae7ta56cc] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .shelter-capacity-banner[b-kae7ta56cc],
    .detail-note-grid[b-kae7ta56cc],
    .four-columns[b-kae7ta56cc] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-kae7ta56cc] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-kae7ta56cc] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-kae7ta56cc],
    .source-picker-card[b-kae7ta56cc],
    .selected-info-grid[b-kae7ta56cc] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-kae7ta56cc] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-kae7ta56cc] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-kae7ta56cc] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-kae7ta56cc] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-kae7ta56cc] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-kae7ta56cc] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-kae7ta56cc] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-kae7ta56cc] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-kae7ta56cc] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-kae7ta56cc],
.asset-location-cell[b-kae7ta56cc],
.department-cell[b-kae7ta56cc],
.status-condition-cell[b-kae7ta56cc],
.value-cell[b-kae7ta56cc],
.inspection-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-kae7ta56cc],
.asset-location-cell strong[b-kae7ta56cc],
.department-cell strong[b-kae7ta56cc],
.value-cell strong[b-kae7ta56cc],
.inspection-cell strong[b-kae7ta56cc] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-kae7ta56cc],
.asset-location-cell small[b-kae7ta56cc],
.department-cell small[b-kae7ta56cc],
.value-cell small[b-kae7ta56cc],
.inspection-cell small[b-kae7ta56cc] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-kae7ta56cc] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-kae7ta56cc] {
    width: fit-content;
}

.status-condition-cell[b-kae7ta56cc] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-kae7ta56cc],
.inspection-cell.overdue small[b-kae7ta56cc] {
    color: #b3463d;
}

.condition-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-kae7ta56cc] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-kae7ta56cc] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-kae7ta56cc] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-kae7ta56cc] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-kae7ta56cc] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-kae7ta56cc] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-kae7ta56cc] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-kae7ta56cc] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-kae7ta56cc] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-kae7ta56cc] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.shelter-photo-upload-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.shelter-capacity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.shelter-capacity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .asset-banner-icon[b-kae7ta56cc] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.7rem;
}

.shelter-capacity-banner small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.shelter-capacity-banner strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-kae7ta56cc] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-kae7ta56cc] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-kae7ta56cc] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-kae7ta56cc] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-kae7ta56cc] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-kae7ta56cc] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.emergency-history-page[b-kae7ta56cc]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-kae7ta56cc] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-kae7ta56cc] {
    font-style: normal;
}

.asset-location-panel a[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-kae7ta56cc] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-kae7ta56cc] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-kae7ta56cc] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-kae7ta56cc] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .shelter-photo-upload-grid[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner > div:nth-child(4)[b-kae7ta56cc],
    .shelter-capacity-banner > div:nth-child(5)[b-kae7ta56cc] {
        grid-column: auto;
    }

    .inspection-date-grid[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-photo-upload-grid[b-kae7ta56cc],
    .asset-value-preview[b-kae7ta56cc],
    .asset-detail-note-grid[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .asset-banner-icon[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-kae7ta56cc] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-kae7ta56cc] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-kae7ta56cc] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-kae7ta56cc],
    .emergency-history-page[b-kae7ta56cc]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY CENTER PREMIUM
   ========================================================= */

.emergency-history-page[b-kae7ta56cc] {
    --emergency-red: #b83f35;
    --emergency-deep: #651e1a;
    --emergency-soft: #fff1ef;
    --command-navy: #263b4a;
}

.history-hero[b-kae7ta56cc] {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255, 177, 144, .18),
            transparent 23rem),
        radial-gradient(
            circle at 16% 80%,
            rgba(201, 166, 93, .13),
            transparent 19rem),
        linear-gradient(
            135deg,
            #6f211c 0%,
            #421411 54%,
            #24100f 100%) !important;
}

.hero-alert-line[b-kae7ta56cc] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffb28e 18%,
            #f6db9f 50%,
            #ffb28e 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(255, 153, 112, .55);
}

.emergency-online .status-dot[b-kae7ta56cc] {
    background: #ffb28e !important;

    box-shadow:
        0 0 0 5px rgba(255, 178, 142, .15),
        0 0 14px rgba(255, 178, 142, .78) !important;
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button,
.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #d95e46,
            #a72f29) !important;

    box-shadow:
        0 11px 24px rgba(119, 31, 25, .28) !important;
}

.summary-card.critical[b-kae7ta56cc] {
    --summary-accent: #bd3e35;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 62, 53, .20);
}

.summary-card.active[b-kae7ta56cc] {
    --summary-accent: #8b529f;
    --summary-soft: #f3eafb;
    --summary-border: rgba(139, 82, 159, .20);
}

.summary-card.sla[b-kae7ta56cc] {
    --summary-accent: #c27a22;
    --summary-soft: #fff3df;
    --summary-border: rgba(194, 122, 34, .20);
}

.summary-card.resolved[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.new > span[b-kae7ta56cc] {
    background: #bd3e35;
}

.status-overview-card.dispatched > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.active > span[b-kae7ta56cc] {
    background: #8b529f;
}

.status-overview-card.over-sla > span[b-kae7ta56cc] {
    background: #c27a22;
}

.status-overview-card.resolved > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.incident-code-photo-cell[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 152px;
    align-items: center;
    gap: 8px;
}

.incident-photo-mini[b-kae7ta56cc] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(184, 63, 53, .12);
    border-radius: 12px;

    color: #b83f35;
    background: #fff2f0;
}

.incident-photo-mini button[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.incident-photo-mini img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.incident-code-photo-cell > div:last-child[b-kae7ta56cc] {
    min-width: 0;
}

.incident-code-photo-cell strong[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(184, 63, 53, .14);
    border-radius: 8px;

    color: #a3362f;
    background: #fff3f1;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.incident-code-photo-cell small[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-subject-cell[b-kae7ta56cc],
.priority-status-cell[b-kae7ta56cc],
.response-unit-cell[b-kae7ta56cc],
.sla-cell[b-kae7ta56cc],
.responder-cell[b-kae7ta56cc],
.latest-update-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.incident-subject-cell[b-kae7ta56cc] {
    gap: 4px;
}

.incident-subject-cell strong[b-kae7ta56cc],
.response-unit-cell strong[b-kae7ta56cc],
.sla-cell strong[b-kae7ta56cc],
.responder-cell strong[b-kae7ta56cc],
.latest-update-cell strong[b-kae7ta56cc] {
    color: #3f4e49;
    font-size: .56rem;
    line-height: 1.48;
}

.incident-subject-cell small[b-kae7ta56cc],
.response-unit-cell small[b-kae7ta56cc],
.sla-cell small[b-kae7ta56cc],
.responder-cell small[b-kae7ta56cc],
.latest-update-cell small[b-kae7ta56cc] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.response-unit-cell em[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e8f3f9;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.priority-status-cell[b-kae7ta56cc] {
    align-items: flex-start;
    gap: 5px;
}

.sla-cell.overdue strong[b-kae7ta56cc],
.sla-cell.overdue small[b-kae7ta56cc] {
    color: #b13e36;
}

.latest-update-cell small[b-kae7ta56cc] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.type-chip[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5b625e;
    background: #edf1ef;

    font-size: .41rem;
    font-weight: 700;
}

.type-chip.fire[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-kae7ta56cc] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-kae7ta56cc] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-kae7ta56cc] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-kae7ta56cc] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-kae7ta56cc] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-kae7ta56cc] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-kae7ta56cc] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-kae7ta56cc] {
    color: #815f43;
    background: #f2e9df;
}

.priority-chip.critical[b-kae7ta56cc] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d65043,
            #9f2e29);

    box-shadow:
        0 5px 13px rgba(159, 46, 41, .18);
}

.priority-chip.urgent[b-kae7ta56cc] {
    color: #a33c32;
    background: #ffe4df;
}

.priority-chip.high[b-kae7ta56cc] {
    color: #a46622;
    background: #fff0d8;
}

.priority-chip.normal[b-kae7ta56cc] {
    color: #39745a;
    background: #e7f5ee;
}

.status-chip.new[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.status-chip.dispatched[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.on-scene[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in-progress[b-kae7ta56cc] {
    color: #7d4c96;
    background: #f3e9fa;
}

.status-chip.resolved[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.closed[b-kae7ta56cc] {
    color: #3d6657;
    background: #e9f1ed;
}

.status-chip.cancelled[b-kae7ta56cc] {
    color: #697770;
    background: #edf1ef;
}

.anonymous-switch-card[b-kae7ta56cc] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 12px;

    background: #fff8f7;
}

.shelter-photo-upload-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.privacy-note[b-kae7ta56cc] {
    margin-top: 12px;
}

.shelter-capacity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        70px
        minmax(160px, 1fr)
        minmax(150px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 16px;

    background: rgba(184, 63, 53, .10);

    box-shadow:
        0 12px 30px rgba(88, 31, 26, .07);
}

.shelter-capacity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 182, 148, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .command-icon[b-kae7ta56cc] {
    color: #ffd5c3;
    background:
        linear-gradient(
            145deg,
            #8c2b25,
            #4c1714);
}

.command-icon .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.7rem;
}

.shelter-capacity-banner small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.shelter-capacity-banner strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: #3f4e49;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.response-timeline-overview[b-kae7ta56cc] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 177, 144, .09),
            transparent 18rem),
        #fbf9f8;
}

.response-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.response-heading small[b-kae7ta56cc] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.response-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #3f4e49;
    font-size: .74rem;
}

.response-badge[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.response-badge.normal[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.response-badge.overdue[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.response-time-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.response-time-grid > div[b-kae7ta56cc] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(184, 63, 53, .07);
    border-radius: 10px;

    background: #fff;
}

.response-time-grid span[b-kae7ta56cc] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.response-time-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: #3f4e49;
    font-size: .51rem;
}

.shelter-location-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.shelter-location-panel > span[b-kae7ta56cc] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.shelter-location-panel small[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.shelter-location-panel h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.shelter-location-panel p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.shelter-location-panel p em[b-kae7ta56cc] {
    font-style: normal;
}

.shelter-location-panel b[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.shelter-location-panel a[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.shelter-detail-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.shelter-detail-grid > div[b-kae7ta56cc] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.shelter-detail-grid .danger-note[b-kae7ta56cc] {
    border-color: rgba(184, 63, 53, .13);
    background: #fff7f5;
}

.shelter-detail-grid .risk-note[b-kae7ta56cc] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.shelter-detail-grid small[b-kae7ta56cc] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
}

.shelter-detail-grid p[b-kae7ta56cc] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6b5148;
    background: #f4ece8;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-kae7ta56cc] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-kae7ta56cc] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .shelter-photo-upload-grid[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .response-time-grid[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-photo-upload-grid[b-kae7ta56cc],
    .shelter-detail-grid[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .command-icon[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }

    .response-time-grid[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-location-panel[b-kae7ta56cc] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .shelter-location-panel a[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-kae7ta56cc] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-kae7ta56cc],
    .emergency-history-page[b-kae7ta56cc]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY DISPATCH & TEAM ASSIGNMENT PREMIUM
   ========================================================= */

.emergency-history-page[b-kae7ta56cc] {
    --dispatch-purple: #6e4d91;
    --dispatch-deep: #352441;
    --dispatch-soft: #f4effa;
    --dispatch-gold: #c99f52;
}

.history-hero[b-kae7ta56cc] {
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(200, 166, 238, .20),
            transparent 24rem),
        radial-gradient(
            circle at 14% 80%,
            rgba(201, 166, 93, .14),
            transparent 19rem),
        linear-gradient(
            135deg,
            #49325e 0%,
            #30213e 54%,
            #1e1527 100%) !important;
}

.hero-command-line[b-kae7ta56cc] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c9a6ee 18%,
            #f2d69e 50%,
            #c9a6ee 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(184, 139, 226, .50);
}

.dispatch-online .status-dot[b-kae7ta56cc] {
    background: #cba8ec !important;

    box-shadow:
        0 0 0 5px rgba(203, 168, 236, .15),
        0 0 14px rgba(203, 168, 236, .78) !important;
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button,
.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #845baa,
            #594075) !important;

    box-shadow:
        0 11px 24px rgba(64, 42, 84, .28) !important;
}

.summary-card.pending[b-kae7ta56cc] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.moving[b-kae7ta56cc] {
    --summary-accent: #2d78a4;
    --summary-soft: #e6f2f9;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.scene[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.eta[b-kae7ta56cc] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-kae7ta56cc] {
    grid-template-columns:
        repeat(7, minmax(0, 1fr)) !important;
}

.status-overview-card.draft > span[b-kae7ta56cc] {
    background: #7658a7;
}

.status-overview-card.dispatched > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.status-overview-card.en-route > span[b-kae7ta56cc] {
    background: #557d9c;
}

.status-overview-card.on-scene > span[b-kae7ta56cc] {
    background: #8b529f;
}

.status-overview-card.completed > span[b-kae7ta56cc] {
    background: #3f8650;
}

.dispatch-code-photo-cell[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.dispatch-photo-mini[b-kae7ta56cc] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 12px;

    color: #6e4d91;
    background: #f4effa;
}

.dispatch-photo-mini button[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.dispatch-photo-mini img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-code-photo-cell > div:last-child[b-kae7ta56cc] {
    min-width: 0;
}

.dispatch-code-photo-cell strong[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(110, 77, 145, .14);
    border-radius: 8px;

    color: #68498a;
    background: #f7f2fb;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.dispatch-code-photo-cell small[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: #9c7932;
    font-size: .43rem;
    font-weight: 650;
}

.source-incident-cell[b-kae7ta56cc],
.team-cell[b-kae7ta56cc],
.assignment-status-cell[b-kae7ta56cc],
.vehicle-cell[b-kae7ta56cc],
.responder-cell[b-kae7ta56cc],
.latest-update-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.source-incident-cell[b-kae7ta56cc] {
    min-width: 190px;
}

.source-incident-cell > div[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.source-incident-cell strong[b-kae7ta56cc],
.team-cell strong[b-kae7ta56cc],
.vehicle-cell strong[b-kae7ta56cc],
.responder-cell strong[b-kae7ta56cc],
.latest-update-cell strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.48;
}

.source-incident-cell small[b-kae7ta56cc],
.team-cell small[b-kae7ta56cc],
.vehicle-cell small[b-kae7ta56cc],
.responder-cell small[b-kae7ta56cc],
.latest-update-cell small[b-kae7ta56cc] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.team-cell em[b-kae7ta56cc] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6e4d91;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.assignment-status-cell[b-kae7ta56cc] {
    align-items: flex-start;
    gap: 5px;
}

.assignment-status-cell small[b-kae7ta56cc] {
    color: #687a73;
    font-size: .43rem;
    font-weight: 650;
}

.assignment-status-cell small.eta-overdue[b-kae7ta56cc] {
    color: #b13e36;
}

.latest-update-cell small[b-kae7ta56cc] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.status-chip.draft[b-kae7ta56cc] {
    color: #6e4d91;
    background: #f0eafb;
}

.status-chip.dispatched[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.accepted[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.en-route[b-kae7ta56cc] {
    color: #476f8e;
    background: #eaf2f7;
}

.status-chip.on-scene[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-kae7ta56cc] {
    color: #347849;
    background: #e7f5ec;
}

.status-chip.cancelled[b-kae7ta56cc] {
    color: #697770;
    background: #edf1ef;
}

.incident-status-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #4b655c;
    background: #edf3f0;

    font-size: .42rem;
    font-weight: 700;
}

.incident-status-chip.new[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.incident-status-chip.dispatched[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.incident-status-chip.on-scene[b-kae7ta56cc],
.incident-status-chip.in-progress[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.dispatch-picker[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.dispatch-source-card[b-kae7ta56cc] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(110, 77, 145, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(63, 42, 82, .06);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.dispatch-source-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);

    border-color: rgba(110, 77, 145, .30);

    box-shadow:
        0 15px 31px rgba(63, 42, 82, .12);
}

.dispatch-source-card.selected[b-kae7ta56cc] {
    border: 2px solid #7658a7;

    box-shadow:
        0 0 0 4px rgba(118, 88, 167, .09),
        0 16px 34px rgba(63, 42, 82, .14);
}

.dispatch-picker-cover[b-kae7ta56cc] {
    position: relative;

    display: grid;
    height: 125px;
    overflow: hidden;

    place-items: center;

    color: #7658a7;
    background:
        radial-gradient(
            circle,
            rgba(118, 88, 167, .13),
            transparent 58%),
        #f2eef7;
}

.dispatch-picker-cover img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-picker-cover > span .mud-icon-root[b-kae7ta56cc] {
    font-size: 2rem;
}

.priority-badge[b-kae7ta56cc] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(75, 84, 79, .84);

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.priority-badge.critical[b-kae7ta56cc] {
    background: rgba(183, 57, 48, .92);
}

.priority-badge.urgent[b-kae7ta56cc] {
    background: rgba(190, 101, 31, .92);
}

.priority-badge.high[b-kae7ta56cc] {
    background: rgba(166, 111, 35, .92);
}

.priority-badge.normal[b-kae7ta56cc] {
    background: rgba(48, 112, 81, .90);
}

.dispatch-picker-content[b-kae7ta56cc] {
    padding: 10px;
}

.dispatch-picker-content > small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
}

.dispatch-picker-content > strong[b-kae7ta56cc] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > p[b-kae7ta56cc] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > div[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.received-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #476f8e;
    background: #eaf2f7;

    font-family: 'Kanit', sans-serif;
    font-size: .39rem;
    font-weight: 650;
}

.source-empty-alert[b-kae7ta56cc] {
    margin-bottom: 16px;
}

.locked-dispatch-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .11),
            transparent 20rem),
        #faf8fc;
}

.locked-dispatch-cover[b-kae7ta56cc] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #7658a7;
    background: #eee8f4;
}

.locked-dispatch-cover img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-dispatch-cover .mud-icon-root[b-kae7ta56cc] {
    font-size: 2.4rem;
}

.locked-dispatch-content[b-kae7ta56cc] {
    min-width: 0;
}

.locked-dispatch-heading[b-kae7ta56cc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-dispatch-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-dispatch-heading h3[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .83rem;
}

.locked-dispatch-heading p[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #7658a7;
    font-size: .50rem;
    font-weight: 700;
}

.locked-incident-badges[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-kae7ta56cc] {
    margin: 10px 0 0;

    color: var(--theme-muted);
    font-size: .55rem;
    line-height: 1.72;
}

.locked-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-grid > div[b-kae7ta56cc] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(110, 77, 145, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-grid span[b-kae7ta56cc] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-risk-note[b-kae7ta56cc] {
    display: flex;
    min-height: 38px;

    align-items: center;
    gap: 7px;

    margin-top: 9px;
    padding: 8px 10px;

    border: 1px solid rgba(194, 122, 34, .16);
    border-radius: 10px;

    color: #8f621d;
    background: #fff9ed;

    font-size: .46rem;
}

.source-panel-actions[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-kae7ta56cc],
.source-panel-actions button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(110, 77, 145, .16);
    border-radius: 9px;

    color: #68498a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.source-link-note[b-kae7ta56cc] {
    margin-top: 12px;
}

.shelter-photo-upload-grid[b-kae7ta56cc] {
    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;
}

.shelter-capacity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        70px
        minmax(150px, 1fr)
        minmax(140px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .75fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 16px;

    background: rgba(110, 77, 145, .10);

    box-shadow:
        0 12px 30px rgba(63, 42, 82, .07);
}

.shelter-capacity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .command-banner-icon[b-kae7ta56cc] {
    color: #e5d5ff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3d2c51);
}

.command-banner-icon .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.75rem;
}

.shelter-capacity-banner small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.shelter-capacity-banner strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .57rem;
    line-height: 1.45;
    text-align: center;
}

.source-incident-detail[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .11),
            transparent 18rem),
        #f9f6fc;
}

.source-detail-icon[b-kae7ta56cc] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3f2d54);

    box-shadow:
        0 10px 22px rgba(63, 42, 82, .20);
}

.source-incident-detail small[b-kae7ta56cc] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-incident-detail h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-incident-detail p[b-kae7ta56cc] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.shelter-location-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.shelter-location-panel > span[b-kae7ta56cc] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.shelter-location-panel small[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.shelter-location-panel h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.shelter-location-panel p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.shelter-location-panel p em[b-kae7ta56cc] {
    font-style: normal;
}

.shelter-location-panel b[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.shelter-location-panel a[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.resource-time-panel[b-kae7ta56cc] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .09),
            transparent 18rem),
        #faf8fc;
}

.dispatch-time-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dispatch-time-heading small[b-kae7ta56cc] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.dispatch-time-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .73rem;
}

.eta-badge[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.eta-badge.normal[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.eta-badge.overdue[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.eta-badge.arrived[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resource-time-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.resource-time-grid > div[b-kae7ta56cc] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(110, 77, 145, .07);
    border-radius: 10px;

    background: #fff;
}

.resource-time-grid span[b-kae7ta56cc] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.resource-time-grid strong[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.shelter-detail-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.shelter-detail-grid > div[b-kae7ta56cc] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.shelter-detail-grid .command-note[b-kae7ta56cc] {
    border-color: rgba(110, 77, 145, .14);
    background: #faf7fc;
}

.shelter-detail-grid .safety-note[b-kae7ta56cc] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.shelter-detail-grid small[b-kae7ta56cc] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
}

.shelter-detail-grid p[b-kae7ta56cc] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #604d70;
    background: #f0eaf5;

    font-size: .41rem;
    font-style: normal;
}

.four-columns[b-kae7ta56cc] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-kae7ta56cc] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.attachment-card.assignment span[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1380px) {
    .status-overview[b-kae7ta56cc] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-kae7ta56cc],
    .four-columns[b-kae7ta56cc] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-dispatch-panel[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-dispatch-cover[b-kae7ta56cc] {
        max-height: 310px;
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .locked-grid[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-kae7ta56cc],
    .four-columns[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .status-overview[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-kae7ta56cc],
    .shelter-photo-upload-grid[b-kae7ta56cc],
    .shelter-detail-grid[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .command-banner-icon[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }

    .resource-time-grid[b-kae7ta56cc],
    .four-columns[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-location-panel[b-kae7ta56cc] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .shelter-location-panel a[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-kae7ta56cc],
    .locked-grid[b-kae7ta56cc],
    .shelter-capacity-banner[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-dispatch-heading[b-kae7ta56cc] {
        flex-direction: column;
    }

    .locked-incident-badges[b-kae7ta56cc] {
        justify-content: flex-start;
    }

    .view-toolbar-actions[b-kae7ta56cc] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-kae7ta56cc],
    .emergency-history-page[b-kae7ta56cc]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY PERSONNEL & EQUIPMENT PREMIUM
   ========================================================= */

.emergency-history-page[b-kae7ta56cc] {
    --resource-green: var(--theme-primary);
    --resource-deep: #163f35;
    --resource-soft: #edf7f3;
    --resource-gold: #c49a4c;
}

.history-hero[b-kae7ta56cc] {
    background:
        radial-gradient(circle at 88% 18%, rgba(130, 218, 183, .18), transparent 24rem),
        radial-gradient(circle at 14% 80%, rgba(201, 166, 93, .14), transparent 19rem),
        linear-gradient(135deg, #145b49 0%, #0a3e32 54%, #08271f 100%) !important;
}

.hero-accent-line[b-kae7ta56cc] {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, transparent, #8fd9b8 18%, #f2d69e 50%, #8fd9b8 82%, transparent);
    box-shadow: 0 0 18px rgba(99, 205, 159, .46);
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button,
.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button {
    color: #fff !important;
    background: linear-gradient(145deg, #15936e, #0a684f) !important;
    box-shadow: 0 11px 24px rgba(8, 91, 68, .28) !important;
}

.summary-card.personnel[b-kae7ta56cc] { --summary-accent:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); --summary-border:rgba(11,116,88,.20); }
.summary-card.equipment[b-kae7ta56cc] { --summary-accent:#2d78a4; --summary-soft:#e6f2f9; --summary-border:rgba(45,120,164,.20); }
.summary-card.readiness[b-kae7ta56cc] { --summary-accent:#805fa8; --summary-soft:#f0eafb; --summary-border:rgba(128,95,168,.20); }
.summary-card.warning[b-kae7ta56cc] { --summary-accent:#bd4f43; --summary-soft:#fff0ee; --summary-border:rgba(189,79,67,.20); }
.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root { color:var(--summary-accent) !important; }

.status-overview[b-kae7ta56cc] { grid-template-columns:repeat(6,minmax(0,1fr)) !important; }
.status-overview-card.checking > span[b-kae7ta56cc] { background:#2d78a4; }
.status-overview-card.ready > span[b-kae7ta56cc] { background:var(--theme-primary); }
.status-overview-card.mission > span[b-kae7ta56cc] { background:#7658a7; }
.status-overview-card.returned > span[b-kae7ta56cc] { background:#4e725f; }
.status-overview-card.not-ready > span[b-kae7ta56cc] { background:#bd4f43; }

.resource-code-photo-cell[b-kae7ta56cc] { display:grid; grid-template-columns:50px minmax(0,1fr); min-width:155px; align-items:center; gap:8px; }
.resource-photo-mini[b-kae7ta56cc] { display:grid; width:50px; height:50px; overflow:hidden; place-items:center; border:1px solid rgba(11,116,88,.13); border-radius:12px; color:var(--theme-primary); background:#edf7f3; }
.resource-photo-mini button[b-kae7ta56cc] { width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.resource-photo-mini img[b-kae7ta56cc] { width:100%; height:100%; object-fit:cover; }
.resource-code-photo-cell strong[b-kae7ta56cc] { display:inline-flex; min-height:28px; align-items:center; padding:0 8px; border:1px solid rgba(11,116,88,.14); border-radius:8px; color:#0a684f; background:#eff8f4; font-size:.50rem; font-weight:760; white-space:nowrap; }
.resource-code-photo-cell small[b-kae7ta56cc] { display:block; margin-top:4px; color:#9c7932; font-size:.43rem; font-weight:650; }

.source-cell[b-kae7ta56cc],.team-cell[b-kae7ta56cc],.equipment-cell[b-kae7ta56cc],.readiness-cell[b-kae7ta56cc],.fuel-return-cell[b-kae7ta56cc],.latest-cell[b-kae7ta56cc] { display:flex; min-width:132px; flex-direction:column; }
.source-cell[b-kae7ta56cc] { min-width:190px; }
.source-cell>div[b-kae7ta56cc] { display:flex; flex-wrap:wrap; gap:4px; }
.source-cell strong[b-kae7ta56cc],.team-cell strong[b-kae7ta56cc],.equipment-cell strong[b-kae7ta56cc],.fuel-return-cell strong[b-kae7ta56cc],.latest-cell strong[b-kae7ta56cc] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.55rem; line-height:1.48; }
.source-cell small[b-kae7ta56cc],.team-cell small[b-kae7ta56cc],.equipment-cell small[b-kae7ta56cc],.latest-cell small[b-kae7ta56cc],.fuel-return-cell small[b-kae7ta56cc] { margin-top:3px; color:#84928d; font-size:.44rem; line-height:1.5; }
.team-cell em[b-kae7ta56cc],.equipment-cell em[b-kae7ta56cc] { display:-webkit-box; margin-top:5px; overflow:hidden; color:var(--theme-primary); font-size:.40rem; font-style:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.readiness-cell[b-kae7ta56cc] { align-items:flex-start; gap:5px; }
.latest-cell small[b-kae7ta56cc] { display:-webkit-box; max-width:190px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }

.readiness-chip[b-kae7ta56cc] { display:inline-flex; min-height:24px; align-items:center; padding:0 8px; border-radius:999px; font-size:.42rem; font-weight:700; }
.readiness-chip.ready[b-kae7ta56cc] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.readiness-chip.partial[b-kae7ta56cc] { color:#94651b; background:#fff1d7; }
.readiness-chip.not-ready[b-kae7ta56cc] { color:#aa453e; background:#fff0ef; }
.status-chip.planned[b-kae7ta56cc] { color:#6e4d91; background:#f0eafb; }
.status-chip.checking[b-kae7ta56cc] { color:#2d78a4; background:#e8f3f9; }
.status-chip.ready[b-kae7ta56cc] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.issued[b-kae7ta56cc] { color:#8d641f; background:#fff1d7; }
.status-chip.on-mission[b-kae7ta56cc] { color:#7658a7; background:#f0eafb; }
.status-chip.returned[b-kae7ta56cc] { color:#3d6657; background:#e9f1ed; }
.status-chip.cancelled[b-kae7ta56cc] { color:#697770; background:#edf1ef; }

.fuel-track[b-kae7ta56cc] { width:95px; height:6px; margin-top:5px; overflow:hidden; border-radius:999px; background:#e6ece9; }
.fuel-track span[b-kae7ta56cc] { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#d49a37,var(--theme-primary)); }
.fuel-return-cell small.overdue[b-kae7ta56cc] { color:#b13e36; font-weight:700; }

.dispatch-picker[b-kae7ta56cc] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.dispatch-source-card[b-kae7ta56cc] { overflow:hidden; padding:0; border:1px solid rgba(11,116,88,.12); border-radius:15px; background:#fff; box-shadow:0 10px 25px rgba(8,75,56,.06); cursor:pointer; text-align:left; transition:.17s ease; }
.dispatch-source-card:hover[b-kae7ta56cc] { transform:translateY(-2px); border-color:rgba(11,116,88,.30); box-shadow:0 15px 31px rgba(8,75,56,.12); }
.dispatch-source-card.selected[b-kae7ta56cc] { border:2px solid var(--theme-primary); box-shadow:0 0 0 4px rgba(11,116,88,.09),0 16px 34px rgba(8,75,56,.14); }
.dispatch-picker-cover[b-kae7ta56cc] { position:relative; display:grid; height:125px; overflow:hidden; place-items:center; color:var(--theme-primary); background:radial-gradient(circle,rgba(11,116,88,.13),transparent 58%),#edf7f3; }
.dispatch-picker-cover img[b-kae7ta56cc] { width:100%; height:100%; object-fit:cover; }
.dispatch-picker-cover .mud-icon-root[b-kae7ta56cc] { font-size:2rem; }
.dispatch-picker-content[b-kae7ta56cc] { padding:10px; }
.dispatch-picker-content>small[b-kae7ta56cc] { color:#9c7932; font-size:.42rem; font-weight:700; }
.dispatch-picker-content>strong[b-kae7ta56cc] { display:-webkit-box; min-height:38px; margin-top:4px; overflow:hidden; color:#354740; font-size:.57rem; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>p[b-kae7ta56cc] { display:-webkit-box; min-height:30px; margin:5px 0 0; overflow:hidden; color:var(--theme-muted); font-size:.43rem; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>div[b-kae7ta56cc] { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
.source-status-chip[b-kae7ta56cc] { display:inline-flex; min-height:23px; align-items:center; padding:0 7px; border-radius:999px; color:#476f8e; background:#eaf2f7; font-size:.39rem; font-weight:650; }

.locked-dispatch-panel[b-kae7ta56cc] { display:grid; grid-template-columns:240px minmax(0,1fr); gap:15px; margin-bottom:16px; overflow:hidden; padding:14px; border:1px solid rgba(11,116,88,.13); border-radius:16px; background:radial-gradient(circle at 100% 0%,rgba(201,166,93,.11),transparent 20rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.locked-dispatch-cover[b-kae7ta56cc] { display:grid; min-height:220px; overflow:hidden; place-items:center; border-radius:13px; color:var(--theme-primary); background:#e8f3ee; }
.locked-dispatch-cover img[b-kae7ta56cc] { width:100%; height:100%; object-fit:cover; }
.locked-dispatch-cover .mud-icon-root[b-kae7ta56cc] { font-size:2.4rem; }
.locked-dispatch-heading[b-kae7ta56cc] { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.locked-dispatch-heading small[b-kae7ta56cc] { color:#9c7932; font-size:.46rem; font-weight:700; }
.locked-dispatch-heading h3[b-kae7ta56cc] { margin:4px 0 0; color:#34483f; font-size:.83rem; }
.locked-dispatch-heading p[b-kae7ta56cc] { margin:3px 0 0; color:var(--theme-primary); font-size:.50rem; font-weight:700; }
.locked-grid[b-kae7ta56cc] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-top:12px; }
.locked-grid>div[b-kae7ta56cc] { min-height:58px; padding:8px; border:1px solid rgba(11,116,88,.08); border-radius:10px; background:#fff; }
.locked-grid span[b-kae7ta56cc] { display:block; color:var(--theme-muted); font-size:.40rem; }
.locked-grid strong[b-kae7ta56cc] { display:block; margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.49rem; line-height:1.42; }
.command-readonly[b-kae7ta56cc] { margin-top:9px; padding:10px; border-left:3px solid var(--theme-primary); border-radius:8px; background:#fff; }
.command-readonly small[b-kae7ta56cc] { color:var(--theme-primary); font-size:.42rem; font-weight:700; }
.command-readonly p[b-kae7ta56cc] { margin:5px 0 0; color:var(--theme-muted); font-size:.49rem; line-height:1.6; }
.source-actions[b-kae7ta56cc] { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.source-actions a[b-kae7ta56cc],.source-actions button[b-kae7ta56cc] { display:inline-flex; min-height:34px; align-items:center; gap:5px; padding:0 9px; border:1px solid rgba(11,116,88,.16); border-radius:9px; color:var(--theme-primary); background:#fff; font-family:'Kanit',sans-serif; font-size:.42rem; font-weight:650; text-decoration:none; cursor:pointer; }

.shelter-photo-upload-grid[b-kae7ta56cc] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; }
.shelter-capacity-banner[b-kae7ta56cc] { display:grid; grid-template-columns:70px repeat(4,minmax(0,1fr)); gap:1px; margin-top:15px; overflow:hidden; border:1px solid rgba(11,116,88,.11); border-radius:16px; background:rgba(11,116,88,.10); box-shadow:0 12px 30px rgba(8,75,56,.07); }
.shelter-capacity-banner>div[b-kae7ta56cc] { display:flex; min-height:102px; align-items:center; justify-content:center; flex-direction:column; gap:3px; padding:12px; background:#fff; }
.shelter-capacity-banner .shelter-capacity-banner-icon[b-kae7ta56cc] { color:#ddf5e9; background:linear-gradient(145deg,var(--theme-primary),#16473a); }
.shelter-capacity-banner-icon .mud-icon-root[b-kae7ta56cc] { font-size:1.75rem; }
.shelter-capacity-banner small[b-kae7ta56cc] { color:var(--theme-muted); font-size:.43rem; }
.shelter-capacity-banner strong[b-kae7ta56cc] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.58rem; text-align:center; }

.source-dispatch-detail[b-kae7ta56cc] { display:grid; grid-template-columns:62px minmax(0,1fr); gap:11px; align-items:center; margin-top:14px; padding:13px; border:1px solid rgba(11,116,88,.13); border-radius:15px; background:radial-gradient(circle at 100% 0%,rgba(11,116,88,.09),transparent 18rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.source-dispatch-detail>span[b-kae7ta56cc] { display:grid; width:62px; height:62px; place-items:center; border-radius:18px; color:#fff; background:linear-gradient(145deg,var(--theme-primary),#153f34); }
.source-dispatch-detail small[b-kae7ta56cc] { color:var(--theme-primary); font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.source-dispatch-detail h3[b-kae7ta56cc] { margin:3px 0 0; color:#34483f; font-size:.71rem; }
.source-dispatch-detail p[b-kae7ta56cc] { margin:4px 0 0; color:#9c7932; font-size:.48rem; font-weight:650; }
.source-dispatch-detail em[b-kae7ta56cc] { display:block; margin-top:5px; color:var(--theme-muted); font-size:.50rem; line-height:1.6; font-style:normal; }

.shelter-location-panel[b-kae7ta56cc] { display:grid; grid-template-columns:54px minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:13px; padding:13px; border:1px solid rgba(45,120,164,.14); border-radius:14px; background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.10),transparent 18rem),#f5fafc; }
.shelter-location-panel>span[b-kae7ta56cc] { display:grid; width:54px; height:54px; place-items:center; border-radius:16px; color:#fff; background:linear-gradient(145deg,#3a86af,#245f82); }
.shelter-location-panel small[b-kae7ta56cc] { color:#2d78a4; font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.shelter-location-panel h3[b-kae7ta56cc] { margin:3px 0 0; color:#344a42; font-size:.69rem; }
.shelter-location-panel p[b-kae7ta56cc] { margin:4px 0 0; color:var(--theme-muted); font-size:.51rem; }
.shelter-location-panel b[b-kae7ta56cc] { display:block; margin-top:4px; color:#2d78a4; font-size:.43rem; }
.shelter-location-panel a[b-kae7ta56cc] { display:inline-flex; min-height:38px; align-items:center; gap:5px; padding:0 10px; border:1px solid rgba(45,120,164,.18); border-radius:10px; color:#2d78a4; background:#fff; font-size:.44rem; font-weight:650; text-decoration:none; }

.shelter-detail-grid[b-kae7ta56cc] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:13px; }
.shelter-detail-grid>div[b-kae7ta56cc] { min-height:105px; padding:13px; border:1px solid rgba(7,88,67,.08); border-radius:13px; background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.shelter-detail-grid .ready-note[b-kae7ta56cc] { border-color:rgba(11,116,88,.14); background:#f2faf6; }
.shelter-detail-grid .defect-note[b-kae7ta56cc] { border-color:rgba(189,79,67,.14); background:#fff7f5; }
.shelter-detail-grid small[b-kae7ta56cc] { color:var(--theme-primary); font-size:.45rem; font-weight:700; }
.shelter-detail-grid p[b-kae7ta56cc] { margin:7px 0 0; color:#60756d; font-size:.54rem; line-height:1.75; }

.five-columns[b-kae7ta56cc] { grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
.attachment-card.incident span[b-kae7ta56cc] { color:#ad382f; background:#fff0ee; }
.attachment-card.assignment span[b-kae7ta56cc] { color:#7658a7; background:#f0eafb; }
.attachment-card.preparation span[b-kae7ta56cc] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.attachment-card.equipment span[b-kae7ta56cc] { color:#2d78a4; background:#e8f3f9; }
.attachment-card.returned span[b-kae7ta56cc] { color:#8d641f; background:#fff1d7; }

@media (max-width:1380px) {
    .status-overview[b-kae7ta56cc] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
    .dispatch-picker[b-kae7ta56cc] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .five-columns[b-kae7ta56cc] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:1050px) {
    .locked-dispatch-panel[b-kae7ta56cc] { grid-template-columns:minmax(0,1fr); }
    .locked-grid[b-kae7ta56cc] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .shelter-capacity-banner[b-kae7ta56cc] { grid-template-columns:70px repeat(2,minmax(0,1fr)); }
    .shelter-photo-upload-grid[b-kae7ta56cc],.five-columns[b-kae7ta56cc] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:800px) {
    .status-overview[b-kae7ta56cc] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .dispatch-picker[b-kae7ta56cc],.shelter-photo-upload-grid[b-kae7ta56cc],.shelter-detail-grid[b-kae7ta56cc],.five-columns[b-kae7ta56cc] { grid-template-columns:minmax(0,1fr) !important; }
    .shelter-capacity-banner[b-kae7ta56cc] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .shelter-capacity-banner .shelter-capacity-banner-icon[b-kae7ta56cc] { grid-column:1/-1; }
    .shelter-location-panel[b-kae7ta56cc] { grid-template-columns:50px minmax(0,1fr); }
    .shelter-location-panel a[b-kae7ta56cc] { grid-column:1/-1; }
}
@media (max-width:560px) {
    .status-overview[b-kae7ta56cc],.locked-grid[b-kae7ta56cc],.shelter-capacity-banner[b-kae7ta56cc] { grid-template-columns:minmax(0,1fr) !important; }
    .locked-dispatch-heading[b-kae7ta56cc] { flex-direction:column; }
    .view-toolbar-actions[b-kae7ta56cc] { width:100%; align-items:stretch; flex-direction:column; }
    .view-map-button[b-kae7ta56cc],.emergency-history-page[b-kae7ta56cc]  .view-edit-button { width:100%; }
}


/* =========================================================
   EMERGENCY SHELTER & AID CENTER PREMIUM
   ========================================================= */

.emergency-history-page[b-kae7ta56cc] {
    --shelter-blue: #2d78a4;
    --shelter-deep: #173f56;
    --shelter-soft: #eaf5fb;
    --aid-green: var(--theme-primary);
}

.history-hero[b-kae7ta56cc] {
    background:
        radial-gradient(circle at 88% 18%, rgba(148, 210, 236, .22), transparent 24rem),
        radial-gradient(circle at 14% 82%, rgba(201, 166, 93, .14), transparent 20rem),
        linear-gradient(135deg, #235f80 0%, #153e55 56%, #0d2838 100%) !important;
}

.hero-accent-line[b-kae7ta56cc] {
    position:absolute;inset:0 0 auto;height:4px;
    background:linear-gradient(90deg,transparent,#9ddbf2 18%,#f0d49a 50%,#9ddbf2 82%,transparent);
    box-shadow:0 0 18px rgba(113,194,225,.50);
}

.emergency-history-page[b-kae7ta56cc]  .hero-add-button,
.emergency-history-page[b-kae7ta56cc]  .toolbar-add-button {
    color:#fff !important;
    background:linear-gradient(145deg,#3a8fba,#226689) !important;
    box-shadow:0 11px 24px rgba(26,79,108,.28) !important;
}

.summary-card.occupancy[b-kae7ta56cc] { --summary-accent:#2d78a4; --summary-soft:#e6f2f9; --summary-border:rgba(45,120,164,.20); }
.summary-card.available[b-kae7ta56cc] { --summary-accent:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); --summary-border:rgba(8,116,90,.20); }
.summary-card.vulnerable[b-kae7ta56cc] { --summary-accent:#7658a7; --summary-soft:#f0eafb; --summary-border:rgba(118,88,167,.20); }
.summary-card.supply[b-kae7ta56cc] { --summary-accent:#bd4f43; --summary-soft:#fff0ee; --summary-border:rgba(189,79,67,.20); }
.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root { color:var(--summary-accent) !important; }

.shelter-status-overview[b-kae7ta56cc] { grid-template-columns:repeat(7,minmax(0,1fr)) !important; }
.status-overview-card.open > span[b-kae7ta56cc] { background:var(--theme-primary); }
.status-overview-card.preparing > span[b-kae7ta56cc] { background:#2d78a4; }
.status-overview-card.full > span[b-kae7ta56cc] { background:#bd4f43; }
.status-overview-card.standby > span[b-kae7ta56cc] { background:#7658a7; }
.status-overview-card.low-supply > span[b-kae7ta56cc] { background:#c27a22; }
.status-overview-card.closed > span[b-kae7ta56cc] { background:#68766f; }

.shelter-code-photo-cell[b-kae7ta56cc] { display:grid;grid-template-columns:50px minmax(0,1fr);min-width:150px;align-items:center;gap:8px; }
.shelter-photo-mini[b-kae7ta56cc] { display:grid;width:50px;height:50px;overflow:hidden;place-items:center;border:1px solid rgba(45,120,164,.13);border-radius:12px;color:#2d78a4;background:#eaf5fb; }
.shelter-photo-mini button[b-kae7ta56cc] { width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer; }
.shelter-photo-mini img[b-kae7ta56cc] { width:100%;height:100%;object-fit:cover; }
.shelter-code-photo-cell strong[b-kae7ta56cc] { display:inline-flex;min-height:28px;align-items:center;padding:0 8px;border:1px solid rgba(45,120,164,.14);border-radius:8px;color:#2d78a4;background:#eff8fc;font-size:.50rem;font-weight:760;white-space:nowrap; }
.shelter-code-photo-cell small[b-kae7ta56cc] { display:block;margin-top:4px;color:var(--theme-muted);font-size:.43rem; }

.shelter-name-cell[b-kae7ta56cc],.capacity-cell[b-kae7ta56cc],.manager-cell[b-kae7ta56cc],.vulnerable-cell[b-kae7ta56cc],.supply-cell[b-kae7ta56cc],.latest-update-cell[b-kae7ta56cc] { display:flex;min-width:130px;flex-direction:column; }
.shelter-name-cell[b-kae7ta56cc] { min-width:190px; }
.shelter-name-cell strong[b-kae7ta56cc],.capacity-cell strong[b-kae7ta56cc],.manager-cell strong[b-kae7ta56cc],.vulnerable-cell strong[b-kae7ta56cc],.latest-update-cell strong[b-kae7ta56cc] { color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.56rem;line-height:1.48; }
.shelter-name-cell small[b-kae7ta56cc],.capacity-cell small[b-kae7ta56cc],.manager-cell small[b-kae7ta56cc],.vulnerable-cell small[b-kae7ta56cc],.supply-cell small[b-kae7ta56cc],.latest-update-cell small[b-kae7ta56cc] { margin-top:3px;color:#84928d;font-size:.44rem;line-height:1.5; }
.shelter-name-cell em[b-kae7ta56cc],.manager-cell em[b-kae7ta56cc] { display:inline-flex;width:fit-content;min-height:22px;align-items:center;margin-top:5px;padding:0 7px;border-radius:999px;color:#2d78a4;background:#e8f3f9;font-size:.40rem;font-style:normal;font-weight:650; }
.capacity-cell[b-kae7ta56cc] { gap:5px; }
.capacity-track[b-kae7ta56cc] { width:100%;height:7px;overflow:hidden;border-radius:999px;background:#e5ece9; }
.capacity-track span[b-kae7ta56cc] { display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2d78a4,#6fb4d3); }
.supply-cell[b-kae7ta56cc] { align-items:flex-start;gap:4px; }
.latest-update-cell small[b-kae7ta56cc] { display:-webkit-box;max-width:190px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2; }

.status-chip.preparing[b-kae7ta56cc] { color:#2d78a4;background:#e8f3f9; }
.status-chip.open[b-kae7ta56cc] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.full[b-kae7ta56cc] { color:#ad382f;background:#fff0ee; }
.status-chip.standby[b-kae7ta56cc] { color:#7658a7;background:#f0eafb; }
.status-chip.closed[b-kae7ta56cc] { color:#68766f;background:#edf1ef; }
.status-chip.cancelled[b-kae7ta56cc] { color:#7d4a54;background:#f8eaee; }

.supply-badge[b-kae7ta56cc] { display:inline-flex;min-height:25px;align-items:center;padding:0 8px;border-radius:999px;font-size:.41rem;font-weight:700; }
.supply-badge.enough[b-kae7ta56cc] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.supply-badge.warning[b-kae7ta56cc] { color:#94651b;background:#fff1d7; }
.supply-badge.low[b-kae7ta56cc] { color:#b15d24;background:#fff0df; }
.supply-badge.critical[b-kae7ta56cc] { color:#aa453e;background:#fff0ef; }

.type-chip.shelter[b-kae7ta56cc] { color:#2d78a4;background:#e8f3f9; }
.type-chip.aid_point[b-kae7ta56cc] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.type-chip.medical_point[b-kae7ta56cc] { color:#a93e5b;background:#fceaf0; }
.type-chip.food_point[b-kae7ta56cc] { color:#a46622;background:#fff1dc; }
.type-chip.assembly_point[b-kae7ta56cc] { color:#655496;background:#eee9fa; }
.type-chip.mobile_point[b-kae7ta56cc] { color:#367849;background:#e8f5ec; }

.priority-chip.critical[b-kae7ta56cc] { color:#fff;background:linear-gradient(145deg,#d65043,#9f2e29); }
.priority-chip.urgent[b-kae7ta56cc] { color:#a33c32;background:#ffe4df; }
.priority-chip.high[b-kae7ta56cc] { color:#a46622;background:#fff0d8; }
.priority-chip.normal[b-kae7ta56cc] { color:#39745a;background:#e7f5ee; }

.source-select[b-kae7ta56cc] { margin-bottom:12px; }
.linked-dispatch-panel[b-kae7ta56cc] { display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px;padding:13px;margin-bottom:16px;border:1px solid rgba(45,120,164,.14);border-radius:16px;background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.09),transparent 18rem),#f7fbfd; }
.linked-cover[b-kae7ta56cc] { display:grid;min-height:190px;overflow:hidden;place-items:center;border-radius:13px;color:#2d78a4;background:#e4f1f7; }
.linked-cover img[b-kae7ta56cc] { width:100%;height:100%;object-fit:cover; }
.linked-cover .mud-icon-root[b-kae7ta56cc] { font-size:2.2rem; }
.linked-heading[b-kae7ta56cc] { display:flex;justify-content:space-between;gap:12px; }
.linked-heading small[b-kae7ta56cc] { color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.06em; }
.linked-heading h3[b-kae7ta56cc] { margin:3px 0 0;color:#34483f;font-size:.78rem; }
.linked-heading p[b-kae7ta56cc] { margin:3px 0 0;color:#9c7932;font-size:.48rem;font-weight:650; }
.linked-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px; }
.linked-grid > div[b-kae7ta56cc] { min-height:58px;padding:8px;border:1px solid rgba(45,120,164,.08);border-radius:10px;background:#fff; }
.linked-grid span[b-kae7ta56cc] { display:block;color:var(--theme-muted);font-size:.40rem; }
.linked-grid strong[b-kae7ta56cc] { display:block;margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.48rem;line-height:1.42; }
.linked-actions[b-kae7ta56cc] { display:flex;flex-wrap:wrap;gap:6px;margin-top:9px; }
.linked-actions a[b-kae7ta56cc],.linked-actions button[b-kae7ta56cc] { display:inline-flex;min-height:34px;align-items:center;justify-content:center;gap:5px;padding:0 9px;border:1px solid rgba(45,120,164,.16);border-radius:9px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.42rem;font-weight:650;text-decoration:none;cursor:pointer; }

.coordinate-preview[b-kae7ta56cc] { display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;margin:5px 0 15px;padding:10px 12px;border:1px solid rgba(45,120,164,.14);border-radius:13px;background:#f5fafc; }
.coordinate-preview > span[b-kae7ta56cc] { display:grid;width:42px;height:42px;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(145deg,#3a86af,#245f82); }
.coordinate-preview > div[b-kae7ta56cc] { display:flex;flex-direction:column; }.coordinate-preview small[b-kae7ta56cc]{color:#7d8e87;font-size:.43rem}.coordinate-preview strong[b-kae7ta56cc]{margin-top:3px;color:color-mix(in srgb, var(--theme-ink) 80%, white);font-size:.54rem}.coordinate-preview a[b-kae7ta56cc]{display:inline-flex;min-height:36px;align-items:center;padding:0 10px;border:1px solid rgba(45,120,164,.18);border-radius:9px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.44rem;font-weight:650;text-decoration:none}

.capacity-preview[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:7px 0 15px; }
.capacity-preview>div[b-kae7ta56cc] { display:flex;min-height:65px;justify-content:center;flex-direction:column;padding:10px 12px;border:1px solid rgba(45,120,164,.13);border-radius:12px;background:linear-gradient(145deg,#f4fbfe,#fff); }
.capacity-preview span[b-kae7ta56cc] { color:var(--theme-muted);font-size:.43rem; }.capacity-preview strong[b-kae7ta56cc]{margin-top:4px;color:#2d78a4;font-size:.66rem}

.supply-preview-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:7px 0 15px; }
.supply-preview-grid>div[b-kae7ta56cc] { padding:10px 11px;border:1px solid rgba(7,88,67,.09);border-radius:11px;background:#fff; }
.supply-preview-grid span[b-kae7ta56cc] { color:#657871;font-size:.44rem; }.supply-preview-grid strong[b-kae7ta56cc]{display:block;margin-top:5px;color:#34483f;font-size:.55rem}
.supply-preview-grid>div>div[b-kae7ta56cc] { height:8px;margin-top:7px;overflow:hidden;border-radius:999px;background:#e8eeeb; }.supply-preview-grid i[b-kae7ta56cc]{display:block;height:100%;border-radius:999px;background:var(--theme-primary)}.supply-preview-grid .water i[b-kae7ta56cc]{background:#2d78a4}.supply-preview-grid .medicine i[b-kae7ta56cc]{background:#b24e66}

.service-switch-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:15px; }
.service-switch-grid[b-kae7ta56cc]  .mud-switch { min-height:52px;padding:7px 9px;border:1px solid rgba(45,120,164,.09);border-radius:11px;background:#f8fbfc; }

.shelter-photo-upload-grid[b-kae7ta56cc] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }

.shelter-capacity-banner[b-kae7ta56cc] { display:grid;grid-template-columns:70px repeat(4,minmax(0,1fr));gap:1px;margin-top:15px;overflow:hidden;border:1px solid rgba(45,120,164,.11);border-radius:16px;background:rgba(45,120,164,.10);box-shadow:0 12px 30px rgba(26,79,108,.07); }
.shelter-capacity-banner>div[b-kae7ta56cc] { display:flex;min-height:102px;align-items:center;justify-content:center;flex-direction:column;gap:3px;padding:12px;background:#fff; }
.shelter-capacity-banner .capacity-banner-icon[b-kae7ta56cc] { color:#d8f0f7;background:linear-gradient(145deg,#3a86af,#1d516d); }.capacity-banner-icon .mud-icon-root[b-kae7ta56cc]{font-size:1.75rem}.shelter-capacity-banner small[b-kae7ta56cc]{color:var(--theme-muted);font-size:.43rem}.shelter-capacity-banner strong[b-kae7ta56cc]{margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.59rem;text-align:center}

.occupancy-overview-panel[b-kae7ta56cc],.supply-overview-panel[b-kae7ta56cc],.service-feature-panel[b-kae7ta56cc] { margin-top:14px;padding:14px;border:1px solid rgba(45,120,164,.10);border-radius:15px;background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.08),transparent 18rem),#f8fbfc; }
.occupancy-heading[b-kae7ta56cc] { display:flex;align-items:center;justify-content:space-between;gap:12px; }.occupancy-heading small[b-kae7ta56cc]{color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.08em}.occupancy-heading h3[b-kae7ta56cc]{margin:3px 0 0;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.73rem}
.occupancy-badge[b-kae7ta56cc] { display:inline-flex;min-height:28px;align-items:center;padding:0 9px;border-radius:999px;font-size:.43rem;font-weight:700; }.occupancy-badge.available[b-kae7ta56cc]{color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white)}.occupancy-badge.medium[b-kae7ta56cc]{color:#2d78a4;background:#e8f3f9}.occupancy-badge.high[b-kae7ta56cc]{color:#a46622;background:#fff0d8}.occupancy-badge.full[b-kae7ta56cc]{color:#ad382f;background:#fff0ee}
.occupancy-progress[b-kae7ta56cc] { height:12px;margin-top:12px;overflow:hidden;border-radius:999px;background:#e4ece9; }.occupancy-progress span[b-kae7ta56cc]{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2d78a4,#6fb4d3)}
.occupancy-stat-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px; }.occupancy-stat-grid>div[b-kae7ta56cc]{min-height:60px;padding:9px;border:1px solid rgba(45,120,164,.07);border-radius:10px;background:#fff}.occupancy-stat-grid span[b-kae7ta56cc]{display:block;color:var(--theme-muted);font-size:.40rem}.occupancy-stat-grid strong[b-kae7ta56cc]{display:block;margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.51rem}

.source-dispatch-detail[b-kae7ta56cc] { display:grid;grid-template-columns:62px minmax(0,1fr);gap:11px;align-items:center;margin-top:14px;padding:13px;border:1px solid rgba(118,88,167,.13);border-radius:15px;background:#faf7fc; }.source-detail-icon[b-kae7ta56cc]{display:grid;width:62px;height:62px;place-items:center;border-radius:18px;color:#fff;background:linear-gradient(145deg,#7658a7,#3f2d54)}.source-dispatch-detail small[b-kae7ta56cc]{color:#7658a7;font-size:.45rem;font-weight:700;letter-spacing:.07em}.source-dispatch-detail h3[b-kae7ta56cc]{margin:3px 0 0;color:#34483f;font-size:.70rem}.source-dispatch-detail p[b-kae7ta56cc]{margin:5px 0 0;color:var(--theme-muted);font-size:.50rem}

.shelter-location-panel[b-kae7ta56cc] { display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:10px;align-items:center;margin-top:13px;padding:13px;border:1px solid rgba(45,120,164,.14);border-radius:14px;background:#f5fafc; }.shelter-location-panel>span[b-kae7ta56cc]{display:grid;width:54px;height:54px;place-items:center;border-radius:16px;color:#fff;background:linear-gradient(145deg,#3a86af,#245f82)}.shelter-location-panel small[b-kae7ta56cc]{color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.07em}.shelter-location-panel h3[b-kae7ta56cc]{margin:3px 0 0;color:#344a42;font-size:.69rem}.shelter-location-panel p[b-kae7ta56cc]{margin:4px 0 0;color:var(--theme-muted);font-size:.51rem;line-height:1.55}.shelter-location-panel p em[b-kae7ta56cc]{font-style:normal}.shelter-location-panel b[b-kae7ta56cc]{display:block;margin-top:4px;color:#2d78a4;font-size:.43rem}.shelter-location-panel a[b-kae7ta56cc]{display:inline-flex;min-height:38px;align-items:center;justify-content:center;gap:5px;padding:0 10px;border:1px solid rgba(45,120,164,.18);border-radius:10px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.44rem;font-weight:650;text-decoration:none}

.supply-detail-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px; }.supply-detail-grid>div[b-kae7ta56cc]{padding:10px 11px;border:1px solid rgba(7,88,67,.08);border-radius:11px;background:#fff}.supply-detail-grid>div>div:first-child[b-kae7ta56cc]{display:flex;justify-content:space-between;gap:8px}.supply-detail-grid span[b-kae7ta56cc]{color:#657871;font-size:.45rem}.supply-detail-grid strong[b-kae7ta56cc]{color:#34483f;font-size:.52rem}.supply-detail-grid>div>div:last-child[b-kae7ta56cc]{height:8px;margin-top:8px;overflow:hidden;border-radius:999px;background:#e8eeeb}.supply-detail-grid i[b-kae7ta56cc]{display:block;height:100%;border-radius:999px;background:var(--theme-primary)}.supply-detail-grid .water i[b-kae7ta56cc]{background:#2d78a4}.supply-detail-grid .medicine i[b-kae7ta56cc]{background:#b24e66}

.service-chip-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px; }.service-chip[b-kae7ta56cc]{display:inline-flex;min-height:42px;align-items:center;gap:6px;padding:0 9px;border-radius:10px;font-size:.44rem;font-weight:650}.service-chip.available[b-kae7ta56cc]{color:var(--theme-primary);border:1px solid rgba(8,112,82,.13);background:#eaf7f1}.service-chip.unavailable[b-kae7ta56cc]{color:#9aa49f;border:1px solid rgba(105,119,112,.08);background:#f1f4f2;text-decoration:line-through}

.shelter-note-grid[b-kae7ta56cc] { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:13px; }.shelter-note-grid>div[b-kae7ta56cc]{min-height:112px;padding:13px;border:1px solid rgba(7,88,67,.08);border-radius:13px;background:color-mix(in srgb, var(--theme-bg) 58%, white)}.shelter-note-grid .supply-need-note[b-kae7ta56cc]{border-color:rgba(194,122,34,.16);background:#fffaf0}.shelter-note-grid small[b-kae7ta56cc]{color:#2d78a4;font-size:.45rem;font-weight:700}.shelter-note-grid p[b-kae7ta56cc]{margin:7px 0 0;color:#60756d;font-size:.54rem;line-height:1.75}

.four-columns[b-kae7ta56cc] { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }.attachment-card.source span[b-kae7ta56cc]{color:#7658a7;background:#f0eafb}.attachment-card.exterior span[b-kae7ta56cc]{color:#2d78a4;background:#e8f3f9}.attachment-card.interior span[b-kae7ta56cc]{color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white)}.attachment-card.aid span[b-kae7ta56cc]{color:#a46622;background:#fff1dc}

@media(max-width:1380px){.shelter-status-overview[b-kae7ta56cc]{grid-template-columns:repeat(4,minmax(0,1fr)) !important}.linked-grid[b-kae7ta56cc],.service-switch-grid[b-kae7ta56cc],.service-chip-grid[b-kae7ta56cc]{grid-template-columns:repeat(2,minmax(0,1fr))}.occupancy-stat-grid[b-kae7ta56cc]{grid-template-columns:repeat(3,minmax(0,1fr))}.four-columns[b-kae7ta56cc]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media(max-width:1050px){.linked-dispatch-panel[b-kae7ta56cc]{grid-template-columns:minmax(0,1fr)}.linked-cover[b-kae7ta56cc]{max-height:300px}.shelter-capacity-banner[b-kae7ta56cc]{grid-template-columns:70px repeat(2,minmax(0,1fr))}.shelter-photo-upload-grid[b-kae7ta56cc]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}.supply-detail-grid[b-kae7ta56cc]{grid-template-columns:minmax(0,1fr)}}
@media(max-width:800px){.shelter-status-overview[b-kae7ta56cc],.capacity-preview[b-kae7ta56cc],.supply-preview-grid[b-kae7ta56cc],.shelter-photo-upload-grid[b-kae7ta56cc],.shelter-note-grid[b-kae7ta56cc]{grid-template-columns:minmax(0,1fr) !important}.shelter-capacity-banner[b-kae7ta56cc]{grid-template-columns:repeat(2,minmax(0,1fr))}.shelter-capacity-banner .capacity-banner-icon[b-kae7ta56cc]{grid-column:1/-1}.occupancy-stat-grid[b-kae7ta56cc]{grid-template-columns:repeat(2,minmax(0,1fr))}.shelter-location-panel[b-kae7ta56cc]{grid-template-columns:50px minmax(0,1fr)}.shelter-location-panel a[b-kae7ta56cc]{grid-column:1/-1}.coordinate-preview[b-kae7ta56cc]{grid-template-columns:42px minmax(0,1fr)}.coordinate-preview a[b-kae7ta56cc]{grid-column:1/-1}}
@media(max-width:560px){.shelter-status-overview[b-kae7ta56cc],.linked-grid[b-kae7ta56cc],.service-switch-grid[b-kae7ta56cc],.service-chip-grid[b-kae7ta56cc],.occupancy-stat-grid[b-kae7ta56cc],.shelter-capacity-banner[b-kae7ta56cc],.four-columns[b-kae7ta56cc]{grid-template-columns:minmax(0,1fr) !important}.linked-heading[b-kae7ta56cc]{flex-direction:column}.view-toolbar-actions[b-kae7ta56cc]{width:100%;align-items:stretch;flex-direction:column}.view-map-button[b-kae7ta56cc],.emergency-history-page[b-kae7ta56cc]  .view-edit-button{width:100%}}


/* =========================================================
   EMERGENCY EVENT HISTORY PREMIUM
   ========================================================= */

.emergency-history-page[b-kae7ta56cc] {
    --history-teal: #0d725c;
    --history-navy: #243e49;
    --history-gold: #c6a45c;
    --history-soft: #edf6f2;
}

.history-hero[b-kae7ta56cc] {
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(95, 188, 157, .20),
            transparent 24rem),
        radial-gradient(
            circle at 14% 82%,
            rgba(198, 164, 92, .15),
            transparent 20rem),
        linear-gradient(
            135deg,
            #174f45 0%,
            #123b35 54%,
            #0b2724 100%) !important;
}

.hero-accent-line[b-kae7ta56cc] {
    position: absolute;
    inset: 0 7% auto;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(126, 221, 187, .85),
            rgba(232, 204, 142, .90),
            rgba(126, 221, 187, .85),
            transparent);

    box-shadow:
        0 0 22px rgba(126, 221, 187, .35);
}

.view-switch[b-kae7ta56cc],
.toolbar-view-switch[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 6px;
    padding: 5px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 13px;

    background: rgba(255, 255, 255, .05);
}

.toolbar-view-switch[b-kae7ta56cc] {
    display: flex;
    width: fit-content;

    border-color: rgba(13, 114, 92, .11);
    background: #f1f6f3;
}

.view-mode-button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 0;
    border-radius: 9px;

    color: rgba(255, 255, 255, .62);
    background: transparent;

    font-family: 'Kanit', sans-serif;
    font-size: .48rem;
    font-weight: 650;

    cursor: pointer;
    transition: .17s ease;
}

.toolbar-view-switch .view-mode-button[b-kae7ta56cc] {
    color: #62756d;
}

.view-mode-button.active[b-kae7ta56cc] {
    color: #153f35;
    background:
        linear-gradient(
            145deg,
            #f3dda9,
            #c8a45c);

    box-shadow:
        0 7px 18px rgba(46, 34, 17, .18);
}

.toolbar-view-switch .view-mode-button.active[b-kae7ta56cc] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #168064,
            #0a5b49);
}

.summary-card.today[b-kae7ta56cc] {
    --summary-accent: #2d78a4;
    --summary-soft: #e6f2f9;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.critical[b-kae7ta56cc] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.completed[b-kae7ta56cc] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.affected[b-kae7ta56cc] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.emergency-history-page[b-kae7ta56cc]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.module-overview[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));

    gap: 10px;
    margin-top: 18px;
}

.module-overview-card[b-kae7ta56cc] {
    position: relative;

    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);

    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 15px;

    color: #3b5148;
    background: rgba(255, 255, 255, .88);

    box-shadow:
        0 10px 28px rgba(5, 62, 46, .055);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.module-overview-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);
    border-color: rgba(13, 114, 92, .24);

    box-shadow:
        0 14px 34px rgba(5, 62, 46, .10);
}

.module-overview-card.selected[b-kae7ta56cc] {
    border-color: rgba(13, 114, 92, .35);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(198, 164, 92, .12),
            transparent 11rem),
        #fff;

    box-shadow:
        0 0 0 4px rgba(13, 114, 92, .08),
        0 16px 38px rgba(5, 62, 46, .12);
}

.module-overview-card > span[b-kae7ta56cc] {
    display: grid;
    width: 48px;
    height: 48px;

    place-items: center;
    border-radius: 14px;

    color: #fff;
    background: #5c6d66;
}

.module-overview-card.incident > span[b-kae7ta56cc] {
    background:
        linear-gradient(
            145deg,
            #d15d50,
            #a23831);
}

.module-overview-card.dispatch > span[b-kae7ta56cc] {
    background:
        linear-gradient(
            145deg,
            #8060aa,
            #5d427e);
}

.module-overview-card.resource > span[b-kae7ta56cc] {
    background:
        linear-gradient(
            145deg,
            #168064,
            #0a5b49);
}

.module-overview-card.shelter > span[b-kae7ta56cc] {
    background:
        linear-gradient(
            145deg,
            #3d88b2,
            #2a6688);
}

.module-overview-card.all > span[b-kae7ta56cc] {
    background:
        linear-gradient(
            145deg,
            #4e6259,
            #35483f);
}

.module-overview-card div[b-kae7ta56cc] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.module-overview-card small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .50rem;
}

.module-overview-card strong[b-kae7ta56cc] {
    margin-top: 3px;

    color: #31463d;
    font-size: .85rem;
}

.history-list-panel[b-kae7ta56cc] {
    margin-top: 18px;
}

.history-timeline[b-kae7ta56cc] {
    padding: 8px 2px 2px;
}

.timeline-date-group + .timeline-date-group[b-kae7ta56cc] {
    margin-top: 24px;
}

.timeline-date-heading[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr) auto;

    align-items: center;
    gap: 10px;

    margin-bottom: 11px;
    padding: 0 5px;
}

.timeline-date-heading > span[b-kae7ta56cc] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 14px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #168064,
            #0b5d4b);

    box-shadow:
        0 8px 18px rgba(13, 114, 92, .18);
}

.timeline-date-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.timeline-date-heading h3[b-kae7ta56cc] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .76rem;
}

.timeline-date-heading em[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #62756d;
    background: #edf3f0;

    font-size: .43rem;
    font-style: normal;
    font-weight: 650;
}

.timeline-items[b-kae7ta56cc] {
    position: relative;

    display: flex;
    flex-direction: column;
    gap: 10px;
}

.timeline-card[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        52px
        56px
        104px
        minmax(0, 1fr)
        34px;

    min-height: 122px;
    align-items: center;
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(13, 114, 92, .05),
            transparent 18rem),
        #fff;

    box-shadow:
        0 10px 27px rgba(5, 62, 46, .055);

    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.timeline-card:hover[b-kae7ta56cc] {
    transform: translateY(-2px);
    border-color: rgba(13, 114, 92, .23);

    box-shadow:
        0 16px 34px rgba(5, 62, 46, .11);
}

.timeline-card.incident[b-kae7ta56cc] {
    border-left: 4px solid #bd4f43;
}

.timeline-card.dispatch[b-kae7ta56cc] {
    border-left: 4px solid #7658a7;
}

.timeline-card.resource[b-kae7ta56cc] {
    border-left: 4px solid var(--theme-primary);
}

.timeline-card.shelter[b-kae7ta56cc] {
    border-left: 4px solid #2d78a4;
}

.timeline-rail[b-kae7ta56cc] {
    display: flex;
    height: 100%;

    align-items: center;
    flex-direction: column;
    gap: 4px;
}

.timeline-rail > span[b-kae7ta56cc] {
    display: grid;
    width: 42px;
    height: 42px;

    flex: 0 0 auto;
    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #566861;
}

.timeline-card.incident .timeline-rail > span[b-kae7ta56cc] {
    background: #bd4f43;
}

.timeline-card.dispatch .timeline-rail > span[b-kae7ta56cc] {
    background: #7658a7;
}

.timeline-card.resource .timeline-rail > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.timeline-card.shelter .timeline-rail > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.timeline-rail > i[b-kae7ta56cc] {
    width: 2px;
    min-height: 34px;
    flex: 1;

    border-radius: 999px;

    background:
        linear-gradient(
            #d9e5e0,
            transparent);
}

.timeline-time[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.timeline-time strong[b-kae7ta56cc] {
    color: var(--theme-ink);
    font-size: .75rem;
}

.timeline-time small[b-kae7ta56cc] {
    color: #889891;
    font-size: .42rem;
}

.timeline-photo[b-kae7ta56cc] {
    display: grid;
    width: 104px;
    height: 88px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    color: #0d725c;
    background: #edf6f2;
}

.timeline-photo img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.timeline-photo > span .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.8rem;
}

.timeline-content[b-kae7ta56cc] {
    min-width: 0;
}

.timeline-tags[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.timeline-content h4[b-kae7ta56cc] {
    margin: 7px 0 0;

    color: var(--theme-ink);
    font-size: .69rem;
}

.timeline-content > p[b-kae7ta56cc] {
    display: -webkit-box;
    margin: 5px 0 0;
    overflow: hidden;

    color: #65776f;
    font-size: .52rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.timeline-meta[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.timeline-meta > span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    gap: 4px;

    padding: 0 7px;
    border-radius: 999px;

    color: #64766e;
    background: #eff4f1;

    font-size: .39rem;
}

.timeline-open[b-kae7ta56cc] {
    display: grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border-radius: 10px;

    color: #0d725c;
    background: #e6f3ee;
}

.module-chip[b-kae7ta56cc],
.severity-chip[b-kae7ta56cc],
.event-status-chip[b-kae7ta56cc],
.type-chip[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .41rem;
    font-weight: 700;
}

.module-chip.incident[b-kae7ta56cc] {
    color: #aa4038;
    background: #fff0ee;
}

.module-chip.dispatch[b-kae7ta56cc] {
    color: #6d4e97;
    background: #f0eafb;
}

.module-chip.resource[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: #e6f5ed;
}

.module-chip.shelter[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.severity-chip.critical[b-kae7ta56cc] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d35a4c,
            #a1352f);
}

.severity-chip.urgent[b-kae7ta56cc] {
    color: #a34436;
    background: #ffe6e0;
}

.severity-chip.high[b-kae7ta56cc] {
    color: #9d671c;
    background: #fff0d8;
}

.severity-chip.normal[b-kae7ta56cc] {
    color: #377156;
    background: #e7f5ed;
}

.event-status-chip.open[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.event-status-chip.waiting[b-kae7ta56cc] {
    color: #9b6c22;
    background: #fff2db;
}

.event-status-chip.in-progress[b-kae7ta56cc] {
    color: #6c4e96;
    background: #f0eafb;
}

.event-status-chip.completed[b-kae7ta56cc] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.event-status-chip.closed[b-kae7ta56cc] {
    color: #5f6f68;
    background: #edf1ef;
}

.type-chip.fire[b-kae7ta56cc] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-kae7ta56cc] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-kae7ta56cc] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-kae7ta56cc] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-kae7ta56cc] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-kae7ta56cc] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-kae7ta56cc] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-kae7ta56cc] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-kae7ta56cc] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-kae7ta56cc] {
    color: #815f43;
    background: #f2e9df;
}

.history-time-photo-cell[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);

    min-width: 125px;
    align-items: center;
    gap: 8px;
}

.history-photo-mini[b-kae7ta56cc] {
    display: grid;
    width: 48px;
    height: 48px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(13, 114, 92, .11);
    border-radius: 12px;

    color: #0d725c;
    background: #edf6f2;
}

.history-photo-mini button[b-kae7ta56cc] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.history-photo-mini img[b-kae7ta56cc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.history-time-photo-cell strong[b-kae7ta56cc],
.module-record-cell strong[b-kae7ta56cc],
.event-title-cell strong[b-kae7ta56cc],
.agency-team-cell strong[b-kae7ta56cc],
.location-cell strong[b-kae7ta56cc],
.incident-no-cell strong[b-kae7ta56cc] {
    display: block;

    color: #3b5047;
    font-size: .54rem;
    line-height: 1.45;
}

.history-time-photo-cell small[b-kae7ta56cc],
.module-record-cell small[b-kae7ta56cc],
.event-title-cell small[b-kae7ta56cc],
.agency-team-cell small[b-kae7ta56cc],
.location-cell small[b-kae7ta56cc],
.incident-no-cell small[b-kae7ta56cc] {
    display: block;
    margin-top: 3px;

    color: var(--theme-muted);
    font-size: .43rem;
    line-height: 1.5;
}

.module-record-cell[b-kae7ta56cc],
.event-title-cell[b-kae7ta56cc],
.severity-status-cell[b-kae7ta56cc],
.agency-team-cell[b-kae7ta56cc],
.location-cell[b-kae7ta56cc],
.incident-no-cell[b-kae7ta56cc] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.module-record-cell[b-kae7ta56cc],
.severity-status-cell[b-kae7ta56cc] {
    align-items: flex-start;
    gap: 5px;
}

.event-title-cell[b-kae7ta56cc] {
    min-width: 190px;
}

.event-title-cell strong[b-kae7ta56cc] {
    margin-top: 5px;
}

.event-title-cell small[b-kae7ta56cc] {
    display: -webkit-box;
    max-width: 230px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.history-view-modal[b-kae7ta56cc] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar-actions[b-kae7ta56cc] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-kae7ta56cc],
.view-photo-button[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.view-photo-button[b-kae7ta56cc] {
    border-color: rgba(13, 114, 92, .18);

    color: #0d725c;
    background: #edf6f2;
}

.history-identity-banner[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(13, 114, 92, .11);
    border-radius: 16px;

    background: rgba(13, 114, 92, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.history-identity-banner > div[b-kae7ta56cc] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(198, 164, 92, .08),
            transparent 12rem),
        #fff;
}

.history-identity-banner .history-banner-icon[b-kae7ta56cc] {
    color: #e9d49d;
    background:
        linear-gradient(
            145deg,
            #168064,
            #0b4f41);
}

.history-banner-icon .mud-icon-root[b-kae7ta56cc] {
    font-size: 1.7rem;
}

.history-identity-banner small[b-kae7ta56cc] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.history-identity-banner strong[b-kae7ta56cc] {
    margin-top: 4px;

    color: #355047;
    font-size: .55rem;
    line-height: 1.45;
    text-align: center;
}

.event-summary-panel[b-kae7ta56cc] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(13, 114, 92, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(198, 164, 92, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.event-summary-heading[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.event-summary-heading small[b-kae7ta56cc] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.event-summary-heading h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .73rem;
}

.event-summary-heading > span[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 29px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0d725c;
    background: #e6f3ee;

    font-size: .43rem;
    font-weight: 650;
}

.event-summary-grid[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 12px;
}

.event-summary-grid > div[b-kae7ta56cc] {
    min-height: 118px;
    padding: 13px;

    border: 1px solid rgba(13, 114, 92, .08);
    border-radius: 12px;

    background: #fff;
}

.event-summary-grid small[b-kae7ta56cc] {
    color: #0d725c;
    font-size: .44rem;
    font-weight: 700;
}

.event-summary-grid p[b-kae7ta56cc] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .54rem;
    line-height: 1.75;
}

.event-result-block[b-kae7ta56cc] {
    border-color: rgba(198, 164, 92, .15) !important;
    background: #fffbf2 !important;
}

.history-location-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.history-location-panel > span[b-kae7ta56cc] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.history-location-panel small[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.history-location-panel h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.history-location-panel p[b-kae7ta56cc] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.history-location-panel p em[b-kae7ta56cc] {
    font-style: normal;
}

.history-location-panel b[b-kae7ta56cc] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.history-location-panel a[b-kae7ta56cc] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.occupancy-panel[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(260px, 1.2fr);

    align-items: center;
    gap: 14px;

    margin-top: 13px;
    padding: 14px;

    border: 1px solid rgba(45, 120, 164, .13);
    border-radius: 14px;

    background: #f6fafc;
}

.occupancy-panel small[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
}

.occupancy-panel h3[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.occupancy-progress > div[b-kae7ta56cc] {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 7px;
}

.occupancy-progress span[b-kae7ta56cc] {
    color: #65776f;
    font-size: .47rem;
}

.occupancy-progress strong[b-kae7ta56cc] {
    color: #2d78a4;
    font-size: .60rem;
}

.related-history-panel[b-kae7ta56cc] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(13, 114, 92, .10);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.related-history-list[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.related-history-item[b-kae7ta56cc] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 22px;

    min-height: 82px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(13, 114, 92, .08);
    border-radius: 11px;

    background: #fff;

    text-align: left;
    cursor: pointer;
}

.related-history-item:hover[b-kae7ta56cc] {
    border-color: rgba(13, 114, 92, .22);
    box-shadow: 0 8px 20px rgba(5, 62, 46, .08);
}

.related-history-item > span[b-kae7ta56cc] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #5c6d66;
}

.related-history-item.incident > span[b-kae7ta56cc] {
    background: #bd4f43;
}

.related-history-item.dispatch > span[b-kae7ta56cc] {
    background: #7658a7;
}

.related-history-item.resource > span[b-kae7ta56cc] {
    background: var(--theme-primary);
}

.related-history-item.shelter > span[b-kae7ta56cc] {
    background: #2d78a4;
}

.related-history-item small[b-kae7ta56cc] {
    color: #86958f;
    font-size: .40rem;
}

.related-history-item strong[b-kae7ta56cc] {
    display: block;
    margin-top: 3px;

    color: #3b5047;
    font-size: .50rem;
    line-height: 1.45;
}

.related-history-item p[b-kae7ta56cc] {
    margin: 3px 0 0;

    color: #9c7932;
    font-size: .40rem;
}

.three-columns[b-kae7ta56cc] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.primary span[b-kae7ta56cc] {
    color: #0d725c;
    background: #e7f5ef;
}

.attachment-card.secondary span[b-kae7ta56cc] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-kae7ta56cc] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1240px) {
    .module-overview[b-kae7ta56cc] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .timeline-card[b-kae7ta56cc] {
        grid-template-columns:
            48px
            50px
            90px
            minmax(0, 1fr)
            30px;
    }

    .history-identity-banner[b-kae7ta56cc] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .related-history-list[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 860px) {
    .module-overview[b-kae7ta56cc] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .timeline-card[b-kae7ta56cc] {
        grid-template-columns:
            46px
            48px
            minmax(0, 1fr)
            28px;
    }

    .timeline-photo[b-kae7ta56cc] {
        display: none;
    }

    .event-summary-grid[b-kae7ta56cc],
    .related-history-list[b-kae7ta56cc],
    .three-columns[b-kae7ta56cc],
    .occupancy-panel[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .history-location-panel[b-kae7ta56cc] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .history-location-panel a[b-kae7ta56cc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .module-overview[b-kae7ta56cc],
    .history-identity-banner[b-kae7ta56cc] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .history-identity-banner .history-banner-icon[b-kae7ta56cc] {
        min-height: 72px;
    }

    .timeline-card[b-kae7ta56cc] {
        grid-template-columns:
            42px minmax(0, 1fr) 26px;
    }

    .timeline-time[b-kae7ta56cc] {
        display: none;
    }

    .timeline-content h4[b-kae7ta56cc] {
        font-size: .62rem;
    }

    .timeline-meta[b-kae7ta56cc] {
        display: none;
    }

    .timeline-date-heading[b-kae7ta56cc] {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .timeline-date-heading em[b-kae7ta56cc] {
        grid-column: 1 / -1;
        width: fit-content;
    }

    .view-toolbar-actions[b-kae7ta56cc] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-kae7ta56cc],
    .view-photo-button[b-kae7ta56cc] {
        width: 100%;
    }
}
/* /Components/Pages/01Ziticen/06Emergency/EmergencyPersonnelEquipment.razor.rz.scp.css */
.emergency-resource-page[b-ub6tp7rfkh] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.emergency-resource-page[b-ub6tp7rfkh]  .emergency-resource-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.resource-hero[b-ub6tp7rfkh] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-ub6tp7rfkh] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-ub6tp7rfkh] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-ub6tp7rfkh] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-ub6tp7rfkh] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-ub6tp7rfkh] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-ub6tp7rfkh] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-ub6tp7rfkh] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-ub6tp7rfkh] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-ub6tp7rfkh] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-ub6tp7rfkh] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.emergency-resource-page[b-ub6tp7rfkh]  .hero-add-button,
.emergency-resource-page[b-ub6tp7rfkh]  .search-button,
.emergency-resource-page[b-ub6tp7rfkh]  .toolbar-add-button,
.emergency-resource-page[b-ub6tp7rfkh]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.emergency-resource-page[b-ub6tp7rfkh]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-ub6tp7rfkh] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-ub6tp7rfkh] {
    opacity: .55;
    cursor: not-allowed;
}

.emergency-resource-page[b-ub6tp7rfkh]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-ub6tp7rfkh] {
    margin-top: 7px;
}

.summary-card[b-ub6tp7rfkh] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-ub6tp7rfkh] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-ub6tp7rfkh] {
    color: #2c7da8;
}

.summary-card.pending[b-ub6tp7rfkh] {
    color: #7658a7;
}

.summary-card.urgent[b-ub6tp7rfkh] {
    color: #c05b4e;
}

.summary-line[b-ub6tp7rfkh] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-ub6tp7rfkh] {
    min-width: 0;
}

.summary-card small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-ub6tp7rfkh] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-ub6tp7rfkh] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-ub6tp7rfkh] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-ub6tp7rfkh],
.resource-list-panel[b-ub6tp7rfkh] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-ub6tp7rfkh],
.list-toolbar[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-ub6tp7rfkh],
.panel-kicker[b-ub6tp7rfkh] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-ub6tp7rfkh],
.list-toolbar h2[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-ub6tp7rfkh],
.list-toolbar p[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-ub6tp7rfkh] {
    align-items: center;
}

.emergency-resource-page[b-ub6tp7rfkh]  .premium-field,
.emergency-resource-page[b-ub6tp7rfkh]  .form-field {
    width: 100%;
}

.emergency-resource-page[b-ub6tp7rfkh]  .premium-field .mud-input-outlined-border,
.emergency-resource-page[b-ub6tp7rfkh]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.emergency-resource-page[b-ub6tp7rfkh]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .sort-select {
    width: 170px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .toolbar-add-button {
    min-height: 42px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .resource-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .resource-table .mud-table-head {
    background: #eef6f2;
}

.emergency-resource-page[b-ub6tp7rfkh]  .resource-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-ub6tp7rfkh] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-ub6tp7rfkh],
.mini-photo-empty[b-ub6tp7rfkh] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-ub6tp7rfkh] {
    cursor: zoom-in;
}

.mini-photo-button img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-ub6tp7rfkh] {
    object-fit: cover;
}

.mini-photo-button small[b-ub6tp7rfkh] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-ub6tp7rfkh] {
    color: #9c7b38;
}

.applicant-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-ub6tp7rfkh],
.applicant-cell small[b-ub6tp7rfkh] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-ub6tp7rfkh] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-ub6tp7rfkh],
.channel-chip[b-ub6tp7rfkh],
.priority-chip[b-ub6tp7rfkh],
.status-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-ub6tp7rfkh],
.type-chip.construction[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-ub6tp7rfkh],
.type-chip.food_license[b-ub6tp7rfkh],
.type-chip.tax[b-ub6tp7rfkh] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-ub6tp7rfkh],
.type-chip.environment[b-ub6tp7rfkh] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-ub6tp7rfkh],
.date-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-ub6tp7rfkh],
.date-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-ub6tp7rfkh],
.date-cell small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-ub6tp7rfkh] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-ub6tp7rfkh] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-ub6tp7rfkh] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-ub6tp7rfkh] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-ub6tp7rfkh] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .row-action.view {
    color: #2d79a2;
}

.emergency-resource-page[b-ub6tp7rfkh]  .row-action.edit {
    color: var(--theme-primary);
}

.emergency-resource-page[b-ub6tp7rfkh]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.emergency-resource-page[b-ub6tp7rfkh]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-ub6tp7rfkh] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-ub6tp7rfkh] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-ub6tp7rfkh] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-ub6tp7rfkh] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-ub6tp7rfkh] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.resource-form-modal[b-ub6tp7rfkh],
.resource-view-modal[b-ub6tp7rfkh],
.delete-modal[b-ub6tp7rfkh] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-ub6tp7rfkh .22s ease-out;
}

@keyframes modalAppear-b-ub6tp7rfkh {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.resource-form-modal[b-ub6tp7rfkh] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-ub6tp7rfkh] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-ub6tp7rfkh] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-ub6tp7rfkh] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-ub6tp7rfkh] {
    margin-top: 24px;
}

.form-section-title > span[b-ub6tp7rfkh] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-ub6tp7rfkh] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-ub6tp7rfkh] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-ub6tp7rfkh] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-ub6tp7rfkh] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-ub6tp7rfkh] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-ub6tp7rfkh] {
    min-height: 310px;
}

.photo-preview img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-ub6tp7rfkh] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-ub6tp7rfkh] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-ub6tp7rfkh] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-ub6tp7rfkh],
.remove-photo-button[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-ub6tp7rfkh] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-ub6tp7rfkh] {
    display: none;
}

.remove-photo-button[b-ub6tp7rfkh] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.emergency-resource-page[b-ub6tp7rfkh]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.emergency-resource-page[b-ub6tp7rfkh]  .cancel-button,
.emergency-resource-page[b-ub6tp7rfkh]  .save-button,
.emergency-resource-page[b-ub6tp7rfkh]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.emergency-resource-page[b-ub6tp7rfkh]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.emergency-resource-page[b-ub6tp7rfkh]  .save-button {
    min-width: 170px;
}

.resource-view-modal[b-ub6tp7rfkh] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-ub6tp7rfkh] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-ub6tp7rfkh] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-ub6tp7rfkh] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 5rem;
}

.view-cover-overlay[b-ub6tp7rfkh] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-ub6tp7rfkh] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-ub6tp7rfkh] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-ub6tp7rfkh] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-ub6tp7rfkh] {
    padding: 22px;
}

.view-toolbar[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-ub6tp7rfkh] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-ub6tp7rfkh],
.view-info-grid span[b-ub6tp7rfkh],
.view-description small[b-ub6tp7rfkh],
.attachment-heading small[b-ub6tp7rfkh],
.view-note small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-ub6tp7rfkh] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-ub6tp7rfkh] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-ub6tp7rfkh] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-ub6tp7rfkh] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-ub6tp7rfkh] {
    background: #f3efe5;
}

.attachment-card img[b-ub6tp7rfkh] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-ub6tp7rfkh] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-ub6tp7rfkh] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2.3rem;
}

.view-note[b-ub6tp7rfkh] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-ub6tp7rfkh] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-ub6tp7rfkh] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-ub6tp7rfkh] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-ub6tp7rfkh] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-ub6tp7rfkh] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-ub6tp7rfkh] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-ub6tp7rfkh] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-ub6tp7rfkh] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-ub6tp7rfkh] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-ub6tp7rfkh] {
    color: #963b36;
}

.delete-warning[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.emergency-resource-page[b-ub6tp7rfkh]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .resource-hero[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-ub6tp7rfkh] {
        max-width: 570px;
    }

    .list-toolbar[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-ub6tp7rfkh] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .emergency-resource-page[b-ub6tp7rfkh] {
        padding: 15px 12px 30px;
    }

    .resource-hero[b-ub6tp7rfkh] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-ub6tp7rfkh] {
        font-size: 2.3rem;
    }

    .hero-meta[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-ub6tp7rfkh] {
        width: 100%;
    }

    .filter-heading[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }

    .emergency-resource-page[b-ub6tp7rfkh]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-ub6tp7rfkh] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-ub6tp7rfkh],
    .attachment-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-ub6tp7rfkh],
    .view-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-ub6tp7rfkh] {
        align-items: end;
        padding: 0;
    }

    .resource-form-modal[b-ub6tp7rfkh],
    .resource-view-modal[b-ub6tp7rfkh] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-ub6tp7rfkh] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-ub6tp7rfkh],
    .resource-list-panel[b-ub6tp7rfkh] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-ub6tp7rfkh] {
        align-items: flex-start;
    }

    .modal-icon[b-ub6tp7rfkh] {
        display: none;
    }

    .modal-footer[b-ub6tp7rfkh] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .emergency-resource-page[b-ub6tp7rfkh]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-ub6tp7rfkh] {
        padding: 0;
    }

    .image-preview-modal[b-ub6tp7rfkh] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-ub6tp7rfkh],
    .resource-form-modal[b-ub6tp7rfkh],
    .resource-view-modal[b-ub6tp7rfkh],
    .delete-modal[b-ub6tp7rfkh] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-ub6tp7rfkh] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-ub6tp7rfkh],
.status-overview-card.selected[b-ub6tp7rfkh] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-ub6tp7rfkh] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-ub6tp7rfkh] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-ub6tp7rfkh] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-ub6tp7rfkh] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-ub6tp7rfkh] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-ub6tp7rfkh],
.complainant-cell small[b-ub6tp7rfkh] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-ub6tp7rfkh] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-ub6tp7rfkh] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-ub6tp7rfkh] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-ub6tp7rfkh] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-ub6tp7rfkh] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-ub6tp7rfkh] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-ub6tp7rfkh] {
    min-width: 116px;
}

.privacy-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-ub6tp7rfkh] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-ub6tp7rfkh] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-ub6tp7rfkh],
.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-ub6tp7rfkh] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-ub6tp7rfkh] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-ub6tp7rfkh] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-ub6tp7rfkh] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-ub6tp7rfkh] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-ub6tp7rfkh],
.evidence-preview[b-ub6tp7rfkh] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.resource-view-modal[b-ub6tp7rfkh] {
    width: min(100%, 920px);
}

.desired-resolution[b-ub6tp7rfkh],
.screening-panel[b-ub6tp7rfkh],
.attachment-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
}

.desired-resolution[b-ub6tp7rfkh] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-ub6tp7rfkh],
.screening-panel small[b-ub6tp7rfkh],
.section-heading small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-ub6tp7rfkh],
.screening-panel p[b-ub6tp7rfkh] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-ub6tp7rfkh] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-ub6tp7rfkh] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-ub6tp7rfkh] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-ub6tp7rfkh] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-ub6tp7rfkh] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-ub6tp7rfkh] {
    background: #f3efe5;
}

.attachment-card img[b-ub6tp7rfkh] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-ub6tp7rfkh] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-ub6tp7rfkh] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-ub6tp7rfkh] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-ub6tp7rfkh],
    .screening-panel[b-ub6tp7rfkh],
    .attachment-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-ub6tp7rfkh] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-ub6tp7rfkh] {
    background: #aa453e;
}

.summary-card.overdue[b-ub6tp7rfkh],
.summary-card.urgent[b-ub6tp7rfkh] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-ub6tp7rfkh] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-ub6tp7rfkh] {
    min-width: 150px;
}

.progress-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-ub6tp7rfkh],
.latest-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-ub6tp7rfkh],
.latest-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-ub6tp7rfkh],
.latest-cell small[b-ub6tp7rfkh] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-ub6tp7rfkh],
.due-cell.overdue small[b-ub6tp7rfkh] {
    color: #b54842;
}

.overdue-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-ub6tp7rfkh] {
    margin-top: 8px;
}

.form-progress-preview[b-ub6tp7rfkh] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-ub6tp7rfkh] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-ub6tp7rfkh],
.history-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-ub6tp7rfkh],
.section-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-ub6tp7rfkh],
.section-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-ub6tp7rfkh],
.section-heading h3[b-ub6tp7rfkh] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-ub6tp7rfkh]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-ub6tp7rfkh] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-ub6tp7rfkh] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-ub6tp7rfkh]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-ub6tp7rfkh] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-ub6tp7rfkh] {
    padding-bottom: 0;
}

.timeline-marker[b-ub6tp7rfkh] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-ub6tp7rfkh] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-ub6tp7rfkh] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-ub6tp7rfkh] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-ub6tp7rfkh],
.timeline-item.cancelled .timeline-marker[b-ub6tp7rfkh] {
    background: #aa453e;
}

.timeline-content[b-ub6tp7rfkh] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-ub6tp7rfkh] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-ub6tp7rfkh] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-ub6tp7rfkh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-ub6tp7rfkh] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-ub6tp7rfkh] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-ub6tp7rfkh] {
    color: #2d78a4;
}

.summary-card.progress[b-ub6tp7rfkh] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-ub6tp7rfkh] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-ub6tp7rfkh] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-ub6tp7rfkh] {
    background: #aa453e;
}

.tracking-number-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-ub6tp7rfkh],
.assigned-by-cell[b-ub6tp7rfkh],
.latest-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-ub6tp7rfkh],
.assigned-by-cell strong[b-ub6tp7rfkh],
.latest-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-ub6tp7rfkh],
.assigned-by-cell small[b-ub6tp7rfkh],
.latest-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-ub6tp7rfkh] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-ub6tp7rfkh],
.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-ub6tp7rfkh] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-ub6tp7rfkh] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.resource-view-modal[b-ub6tp7rfkh] {
    width: min(100%, 940px);
}

.tracking-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-ub6tp7rfkh],
.banner-officer[b-ub6tp7rfkh],
.banner-due[b-ub6tp7rfkh],
.banner-progress[b-ub6tp7rfkh] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-ub6tp7rfkh],
.detail-note-grid[b-ub6tp7rfkh],
.history-panel[b-ub6tp7rfkh],
.attachment-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
}

.assignment-instruction[b-ub6tp7rfkh] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-ub6tp7rfkh],
.detail-note-grid small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-ub6tp7rfkh],
.detail-note-grid p[b-ub6tp7rfkh] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-ub6tp7rfkh] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-ub6tp7rfkh] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-ub6tp7rfkh] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-ub6tp7rfkh]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-ub6tp7rfkh],
.timeline-item.cancelled .timeline-marker[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-ub6tp7rfkh],
.evidence-preview[b-ub6tp7rfkh] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-ub6tp7rfkh],
    .detail-note-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-ub6tp7rfkh] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-ub6tp7rfkh] {
    width: 100%;
}

.available-count-card[b-ub6tp7rfkh] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-ub6tp7rfkh] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-ub6tp7rfkh] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-ub6tp7rfkh] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-ub6tp7rfkh]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-ub6tp7rfkh]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-ub6tp7rfkh] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-ub6tp7rfkh] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-ub6tp7rfkh] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-ub6tp7rfkh] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-ub6tp7rfkh] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 1.55rem;
}

.picker-photo[b-ub6tp7rfkh] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-ub6tp7rfkh] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2rem;
}

.picker-content[b-ub6tp7rfkh] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-ub6tp7rfkh] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-ub6tp7rfkh] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-ub6tp7rfkh] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-ub6tp7rfkh] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-ub6tp7rfkh] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-ub6tp7rfkh] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-ub6tp7rfkh] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-ub6tp7rfkh] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-ub6tp7rfkh] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-ub6tp7rfkh] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-ub6tp7rfkh] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-ub6tp7rfkh] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-ub6tp7rfkh] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-ub6tp7rfkh] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-ub6tp7rfkh],
    .selected-complaint-panel[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-ub6tp7rfkh] {
        min-height: 220px;
    }

    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-ub6tp7rfkh] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-ub6tp7rfkh] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-ub6tp7rfkh] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-ub6tp7rfkh] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-ub6tp7rfkh] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-ub6tp7rfkh] {
    color: #b47b22;
}

.summary-card.overdue[b-ub6tp7rfkh] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-ub6tp7rfkh] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-ub6tp7rfkh] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-ub6tp7rfkh] {
    background: #75837d;
}

.status-overview-card.completed > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-ub6tp7rfkh] {
    background: #bc4d45;
}

.tracking-number-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-ub6tp7rfkh] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-ub6tp7rfkh],
.progress-cell[b-ub6tp7rfkh],
.followup-cell[b-ub6tp7rfkh],
.latest-cell[b-ub6tp7rfkh],
.department-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-ub6tp7rfkh],
.followup-cell strong[b-ub6tp7rfkh],
.latest-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-ub6tp7rfkh],
.followup-cell small[b-ub6tp7rfkh],
.latest-cell small[b-ub6tp7rfkh] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-ub6tp7rfkh] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-ub6tp7rfkh] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-ub6tp7rfkh] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-ub6tp7rfkh] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-ub6tp7rfkh] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-ub6tp7rfkh] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-ub6tp7rfkh] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-ub6tp7rfkh] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-ub6tp7rfkh] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-ub6tp7rfkh] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-ub6tp7rfkh] {
    width: 100%;
}

.source-picker-list[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-ub6tp7rfkh] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-ub6tp7rfkh] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-ub6tp7rfkh] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-ub6tp7rfkh] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-ub6tp7rfkh] {
    display: block;
}

.picker-photo[b-ub6tp7rfkh] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-ub6tp7rfkh] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-ub6tp7rfkh] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-ub6tp7rfkh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-ub6tp7rfkh] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-ub6tp7rfkh],
.picker-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-ub6tp7rfkh] {
    gap: 8px 12px;
}

.picker-meta span[b-ub6tp7rfkh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-ub6tp7rfkh] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-ub6tp7rfkh] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-ub6tp7rfkh] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-ub6tp7rfkh] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-ub6tp7rfkh] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-ub6tp7rfkh] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-ub6tp7rfkh] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-ub6tp7rfkh] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-ub6tp7rfkh] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-ub6tp7rfkh] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-ub6tp7rfkh],
.attachment-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-ub6tp7rfkh] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-ub6tp7rfkh]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-ub6tp7rfkh] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-ub6tp7rfkh] {
    background: #e7f2f9;
}

.attachment-card.after[b-ub6tp7rfkh] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-ub6tp7rfkh],
.after-preview[b-ub6tp7rfkh] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-ub6tp7rfkh],
    .selected-source-panel[b-ub6tp7rfkh],
    .tracking-banner[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-ub6tp7rfkh] {
        min-height: 220px;
    }

    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-ub6tp7rfkh] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-ub6tp7rfkh] {
    color: var(--theme-primary);
}

.summary-card.sla[b-ub6tp7rfkh] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-ub6tp7rfkh] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-ub6tp7rfkh] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-ub6tp7rfkh] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.asset-number-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-ub6tp7rfkh] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-ub6tp7rfkh] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-ub6tp7rfkh] {
    font-size: .36rem;
}

.resolution-chip[b-ub6tp7rfkh],
.publication-chip[b-ub6tp7rfkh],
.sla-chip[b-ub6tp7rfkh],
.source-sla-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-ub6tp7rfkh] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-ub6tp7rfkh],
.source-sla-chip.within[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-ub6tp7rfkh],
.source-sla-chip.over[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-ub6tp7rfkh],
.closed-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-ub6tp7rfkh],
.closed-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-ub6tp7rfkh],
.closed-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-ub6tp7rfkh] {
    color: #aa453e;
}

.score-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-ub6tp7rfkh] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-ub6tp7rfkh] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-ub6tp7rfkh] {
    color: #d0a43f;
}

.score-cell small[b-ub6tp7rfkh] {
    color: #8c9893;
    font-size: .47rem;
}

.resource-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.resource-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.resource-banner .banner-department[b-ub6tp7rfkh] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.resource-banner small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .48rem;
}

.resource-banner strong[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-ub6tp7rfkh] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-ub6tp7rfkh] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-ub6tp7rfkh] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-ub6tp7rfkh] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-ub6tp7rfkh] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-ub6tp7rfkh] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-ub6tp7rfkh] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-ub6tp7rfkh] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-ub6tp7rfkh] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-ub6tp7rfkh] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-ub6tp7rfkh] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-ub6tp7rfkh] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-ub6tp7rfkh] {
    display: block;
}

@media (max-width: 1200px) {
    .resource-banner[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .resource-banner[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-ub6tp7rfkh] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-ub6tp7rfkh] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-ub6tp7rfkh] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-ub6tp7rfkh] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-ub6tp7rfkh] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-ub6tp7rfkh] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.emergency-resource-page[b-ub6tp7rfkh]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-ub6tp7rfkh] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-ub6tp7rfkh] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-ub6tp7rfkh] { background: #6e7d77; }
.status-overview-card.assigned > span[b-ub6tp7rfkh] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-ub6tp7rfkh] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-ub6tp7rfkh] { background: #ad721a; }
.status-overview-card.completed > span[b-ub6tp7rfkh] { background: var(--theme-primary); }

.asset-number-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-ub6tp7rfkh] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-ub6tp7rfkh] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-ub6tp7rfkh] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-ub6tp7rfkh] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-ub6tp7rfkh] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-ub6tp7rfkh] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-ub6tp7rfkh],
.schedule-cell[b-ub6tp7rfkh],
.budget-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-ub6tp7rfkh],
.schedule-cell strong[b-ub6tp7rfkh],
.budget-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-ub6tp7rfkh],
.schedule-cell small[b-ub6tp7rfkh],
.budget-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-ub6tp7rfkh],
.schedule-cell.overdue small[b-ub6tp7rfkh] {
    color: #b3463d;
}

.budget-cell strong[b-ub6tp7rfkh] {
    color: #9c7932;
}

.progress-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-ub6tp7rfkh] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-ub6tp7rfkh] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-ub6tp7rfkh] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-ub6tp7rfkh] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-ub6tp7rfkh] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-ub6tp7rfkh] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-ub6tp7rfkh] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-ub6tp7rfkh] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-ub6tp7rfkh] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-ub6tp7rfkh] {
    display: block;
}

.picker-photo[b-ub6tp7rfkh] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-ub6tp7rfkh] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-ub6tp7rfkh] {
    min-width: 0;
}

.picker-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-ub6tp7rfkh] {
    min-width: 0;
}

.picker-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-ub6tp7rfkh] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-ub6tp7rfkh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-ub6tp7rfkh] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-ub6tp7rfkh] {
    font-size: .47rem;
}

.selected-source-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-ub6tp7rfkh] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-ub6tp7rfkh] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-ub6tp7rfkh] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-ub6tp7rfkh] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-ub6tp7rfkh] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-ub6tp7rfkh] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-ub6tp7rfkh] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.resource-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.resource-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.resource-banner .banner-technician[b-ub6tp7rfkh] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-ub6tp7rfkh] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.resource-banner small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .48rem;
}

.resource-banner strong[b-ub6tp7rfkh] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-ub6tp7rfkh] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-ub6tp7rfkh] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-ub6tp7rfkh] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-ub6tp7rfkh] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-ub6tp7rfkh] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-ub6tp7rfkh] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-ub6tp7rfkh] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-ub6tp7rfkh] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-ub6tp7rfkh] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-ub6tp7rfkh] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-ub6tp7rfkh],
.history-meta b[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-ub6tp7rfkh] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-ub6tp7rfkh] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-ub6tp7rfkh] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .resource-banner[b-ub6tp7rfkh],
    .four-columns[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .resource-banner[b-ub6tp7rfkh],
    .detail-note-grid[b-ub6tp7rfkh],
    .four-columns[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-ub6tp7rfkh] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-ub6tp7rfkh],
    .source-picker-card[b-ub6tp7rfkh],
    .selected-info-grid[b-ub6tp7rfkh] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-ub6tp7rfkh] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-ub6tp7rfkh] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-ub6tp7rfkh] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-ub6tp7rfkh] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-ub6tp7rfkh] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.emergency-resource-page[b-ub6tp7rfkh]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-ub6tp7rfkh] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-ub6tp7rfkh] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-ub6tp7rfkh] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-ub6tp7rfkh] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-ub6tp7rfkh] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-ub6tp7rfkh],
.asset-location-cell[b-ub6tp7rfkh],
.department-cell[b-ub6tp7rfkh],
.status-condition-cell[b-ub6tp7rfkh],
.value-cell[b-ub6tp7rfkh],
.inspection-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-ub6tp7rfkh],
.asset-location-cell strong[b-ub6tp7rfkh],
.department-cell strong[b-ub6tp7rfkh],
.value-cell strong[b-ub6tp7rfkh],
.inspection-cell strong[b-ub6tp7rfkh] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-ub6tp7rfkh],
.asset-location-cell small[b-ub6tp7rfkh],
.department-cell small[b-ub6tp7rfkh],
.value-cell small[b-ub6tp7rfkh],
.inspection-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-ub6tp7rfkh] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-ub6tp7rfkh] {
    width: fit-content;
}

.status-condition-cell[b-ub6tp7rfkh] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-ub6tp7rfkh],
.inspection-cell.overdue small[b-ub6tp7rfkh] {
    color: #b3463d;
}

.condition-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-ub6tp7rfkh] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-ub6tp7rfkh] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-ub6tp7rfkh] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-ub6tp7rfkh] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-ub6tp7rfkh] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-ub6tp7rfkh] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-ub6tp7rfkh] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-ub6tp7rfkh] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.resource-photo-upload-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.resource-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.resource-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.resource-banner .asset-banner-icon[b-ub6tp7rfkh] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 1.7rem;
}

.resource-banner small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.resource-banner strong[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-ub6tp7rfkh] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-ub6tp7rfkh] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-ub6tp7rfkh] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-ub6tp7rfkh] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-ub6tp7rfkh] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-ub6tp7rfkh] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.emergency-resource-page[b-ub6tp7rfkh]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-ub6tp7rfkh] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-ub6tp7rfkh] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-ub6tp7rfkh] {
    font-style: normal;
}

.asset-location-panel a[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-ub6tp7rfkh] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-ub6tp7rfkh] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-ub6tp7rfkh] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-ub6tp7rfkh] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .resource-photo-upload-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner > div:nth-child(4)[b-ub6tp7rfkh],
    .resource-banner > div:nth-child(5)[b-ub6tp7rfkh] {
        grid-column: auto;
    }

    .inspection-date-grid[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .resource-photo-upload-grid[b-ub6tp7rfkh],
    .asset-value-preview[b-ub6tp7rfkh],
    .asset-detail-note-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner .asset-banner-icon[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-ub6tp7rfkh] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-ub6tp7rfkh] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-ub6tp7rfkh] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-ub6tp7rfkh],
    .emergency-resource-page[b-ub6tp7rfkh]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY CENTER PREMIUM
   ========================================================= */

.emergency-resource-page[b-ub6tp7rfkh] {
    --emergency-red: #b83f35;
    --emergency-deep: #651e1a;
    --emergency-soft: #fff1ef;
    --command-navy: #263b4a;
}

.resource-hero[b-ub6tp7rfkh] {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255, 177, 144, .18),
            transparent 23rem),
        radial-gradient(
            circle at 16% 80%,
            rgba(201, 166, 93, .13),
            transparent 19rem),
        linear-gradient(
            135deg,
            #6f211c 0%,
            #421411 54%,
            #24100f 100%) !important;
}

.hero-alert-line[b-ub6tp7rfkh] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffb28e 18%,
            #f6db9f 50%,
            #ffb28e 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(255, 153, 112, .55);
}

.emergency-online .status-dot[b-ub6tp7rfkh] {
    background: #ffb28e !important;

    box-shadow:
        0 0 0 5px rgba(255, 178, 142, .15),
        0 0 14px rgba(255, 178, 142, .78) !important;
}

.emergency-resource-page[b-ub6tp7rfkh]  .hero-add-button,
.emergency-resource-page[b-ub6tp7rfkh]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #d95e46,
            #a72f29) !important;

    box-shadow:
        0 11px 24px rgba(119, 31, 25, .28) !important;
}

.summary-card.critical[b-ub6tp7rfkh] {
    --summary-accent: #bd3e35;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 62, 53, .20);
}

.summary-card.active[b-ub6tp7rfkh] {
    --summary-accent: #8b529f;
    --summary-soft: #f3eafb;
    --summary-border: rgba(139, 82, 159, .20);
}

.summary-card.sla[b-ub6tp7rfkh] {
    --summary-accent: #c27a22;
    --summary-soft: #fff3df;
    --summary-border: rgba(194, 122, 34, .20);
}

.summary-card.resolved[b-ub6tp7rfkh] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.emergency-resource-page[b-ub6tp7rfkh]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.new > span[b-ub6tp7rfkh] {
    background: #bd3e35;
}

.status-overview-card.dispatched > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.active > span[b-ub6tp7rfkh] {
    background: #8b529f;
}

.status-overview-card.over-sla > span[b-ub6tp7rfkh] {
    background: #c27a22;
}

.status-overview-card.resolved > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.incident-code-photo-cell[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 152px;
    align-items: center;
    gap: 8px;
}

.incident-photo-mini[b-ub6tp7rfkh] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(184, 63, 53, .12);
    border-radius: 12px;

    color: #b83f35;
    background: #fff2f0;
}

.incident-photo-mini button[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.incident-photo-mini img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.incident-code-photo-cell > div:last-child[b-ub6tp7rfkh] {
    min-width: 0;
}

.incident-code-photo-cell strong[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(184, 63, 53, .14);
    border-radius: 8px;

    color: #a3362f;
    background: #fff3f1;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.incident-code-photo-cell small[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-subject-cell[b-ub6tp7rfkh],
.priority-status-cell[b-ub6tp7rfkh],
.response-unit-cell[b-ub6tp7rfkh],
.sla-cell[b-ub6tp7rfkh],
.responder-cell[b-ub6tp7rfkh],
.latest-update-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.incident-subject-cell[b-ub6tp7rfkh] {
    gap: 4px;
}

.incident-subject-cell strong[b-ub6tp7rfkh],
.response-unit-cell strong[b-ub6tp7rfkh],
.sla-cell strong[b-ub6tp7rfkh],
.responder-cell strong[b-ub6tp7rfkh],
.latest-update-cell strong[b-ub6tp7rfkh] {
    color: #3f4e49;
    font-size: .56rem;
    line-height: 1.48;
}

.incident-subject-cell small[b-ub6tp7rfkh],
.response-unit-cell small[b-ub6tp7rfkh],
.sla-cell small[b-ub6tp7rfkh],
.responder-cell small[b-ub6tp7rfkh],
.latest-update-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.response-unit-cell em[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e8f3f9;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.priority-status-cell[b-ub6tp7rfkh] {
    align-items: flex-start;
    gap: 5px;
}

.sla-cell.overdue strong[b-ub6tp7rfkh],
.sla-cell.overdue small[b-ub6tp7rfkh] {
    color: #b13e36;
}

.latest-update-cell small[b-ub6tp7rfkh] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.type-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5b625e;
    background: #edf1ef;

    font-size: .41rem;
    font-weight: 700;
}

.type-chip.fire[b-ub6tp7rfkh] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-ub6tp7rfkh] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-ub6tp7rfkh] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-ub6tp7rfkh] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-ub6tp7rfkh] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-ub6tp7rfkh] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-ub6tp7rfkh] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-ub6tp7rfkh] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-ub6tp7rfkh] {
    color: #815f43;
    background: #f2e9df;
}

.priority-chip.critical[b-ub6tp7rfkh] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d65043,
            #9f2e29);

    box-shadow:
        0 5px 13px rgba(159, 46, 41, .18);
}

.priority-chip.urgent[b-ub6tp7rfkh] {
    color: #a33c32;
    background: #ffe4df;
}

.priority-chip.high[b-ub6tp7rfkh] {
    color: #a46622;
    background: #fff0d8;
}

.priority-chip.normal[b-ub6tp7rfkh] {
    color: #39745a;
    background: #e7f5ee;
}

.status-chip.new[b-ub6tp7rfkh] {
    color: #ad382f;
    background: #fff0ee;
}

.status-chip.dispatched[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.on-scene[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in-progress[b-ub6tp7rfkh] {
    color: #7d4c96;
    background: #f3e9fa;
}

.status-chip.resolved[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.closed[b-ub6tp7rfkh] {
    color: #3d6657;
    background: #e9f1ed;
}

.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #697770;
    background: #edf1ef;
}

.anonymous-switch-card[b-ub6tp7rfkh] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 12px;

    background: #fff8f7;
}

.resource-photo-upload-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.privacy-note[b-ub6tp7rfkh] {
    margin-top: 12px;
}

.resource-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        70px
        minmax(160px, 1fr)
        minmax(150px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 16px;

    background: rgba(184, 63, 53, .10);

    box-shadow:
        0 12px 30px rgba(88, 31, 26, .07);
}

.resource-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 182, 148, .08),
            transparent 12rem),
        #fff;
}

.resource-banner .command-icon[b-ub6tp7rfkh] {
    color: #ffd5c3;
    background:
        linear-gradient(
            145deg,
            #8c2b25,
            #4c1714);
}

.command-icon .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 1.7rem;
}

.resource-banner small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.resource-banner strong[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: #3f4e49;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.response-timeline-overview[b-ub6tp7rfkh] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 177, 144, .09),
            transparent 18rem),
        #fbf9f8;
}

.response-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.response-heading small[b-ub6tp7rfkh] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.response-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #3f4e49;
    font-size: .74rem;
}

.response-badge[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.response-badge.normal[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.response-badge.overdue[b-ub6tp7rfkh] {
    color: #ad382f;
    background: #fff0ee;
}

.response-time-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.response-time-grid > div[b-ub6tp7rfkh] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(184, 63, 53, .07);
    border-radius: 10px;

    background: #fff;
}

.response-time-grid span[b-ub6tp7rfkh] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.response-time-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: #3f4e49;
    font-size: .51rem;
}

.resource-location-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.resource-location-panel > span[b-ub6tp7rfkh] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.resource-location-panel small[b-ub6tp7rfkh] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.resource-location-panel h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.resource-location-panel p[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.resource-location-panel p em[b-ub6tp7rfkh] {
    font-style: normal;
}

.resource-location-panel b[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.resource-location-panel a[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.resource-detail-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.resource-detail-grid > div[b-ub6tp7rfkh] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.resource-detail-grid .danger-note[b-ub6tp7rfkh] {
    border-color: rgba(184, 63, 53, .13);
    background: #fff7f5;
}

.resource-detail-grid .risk-note[b-ub6tp7rfkh] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.resource-detail-grid small[b-ub6tp7rfkh] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
}

.resource-detail-grid p[b-ub6tp7rfkh] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6b5148;
    background: #f4ece8;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-ub6tp7rfkh] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-ub6tp7rfkh] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .resource-photo-upload-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .response-time-grid[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .resource-photo-upload-grid[b-ub6tp7rfkh],
    .resource-detail-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner .command-icon[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }

    .response-time-grid[b-ub6tp7rfkh],
    .three-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .resource-location-panel[b-ub6tp7rfkh] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .resource-location-panel a[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-ub6tp7rfkh] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-ub6tp7rfkh],
    .emergency-resource-page[b-ub6tp7rfkh]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY DISPATCH & TEAM ASSIGNMENT PREMIUM
   ========================================================= */

.emergency-resource-page[b-ub6tp7rfkh] {
    --dispatch-purple: #6e4d91;
    --dispatch-deep: #352441;
    --dispatch-soft: #f4effa;
    --dispatch-gold: #c99f52;
}

.resource-hero[b-ub6tp7rfkh] {
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(200, 166, 238, .20),
            transparent 24rem),
        radial-gradient(
            circle at 14% 80%,
            rgba(201, 166, 93, .14),
            transparent 19rem),
        linear-gradient(
            135deg,
            #49325e 0%,
            #30213e 54%,
            #1e1527 100%) !important;
}

.hero-command-line[b-ub6tp7rfkh] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c9a6ee 18%,
            #f2d69e 50%,
            #c9a6ee 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(184, 139, 226, .50);
}

.dispatch-online .status-dot[b-ub6tp7rfkh] {
    background: #cba8ec !important;

    box-shadow:
        0 0 0 5px rgba(203, 168, 236, .15),
        0 0 14px rgba(203, 168, 236, .78) !important;
}

.emergency-resource-page[b-ub6tp7rfkh]  .hero-add-button,
.emergency-resource-page[b-ub6tp7rfkh]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #845baa,
            #594075) !important;

    box-shadow:
        0 11px 24px rgba(64, 42, 84, .28) !important;
}

.summary-card.pending[b-ub6tp7rfkh] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.moving[b-ub6tp7rfkh] {
    --summary-accent: #2d78a4;
    --summary-soft: #e6f2f9;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.scene[b-ub6tp7rfkh] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.eta[b-ub6tp7rfkh] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.emergency-resource-page[b-ub6tp7rfkh]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-ub6tp7rfkh] {
    grid-template-columns:
        repeat(7, minmax(0, 1fr)) !important;
}

.status-overview-card.draft > span[b-ub6tp7rfkh] {
    background: #7658a7;
}

.status-overview-card.dispatched > span[b-ub6tp7rfkh] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-ub6tp7rfkh] {
    background: var(--theme-primary);
}

.status-overview-card.en-route > span[b-ub6tp7rfkh] {
    background: #557d9c;
}

.status-overview-card.on-scene > span[b-ub6tp7rfkh] {
    background: #8b529f;
}

.status-overview-card.completed > span[b-ub6tp7rfkh] {
    background: #3f8650;
}

.dispatch-code-photo-cell[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.dispatch-photo-mini[b-ub6tp7rfkh] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 12px;

    color: #6e4d91;
    background: #f4effa;
}

.dispatch-photo-mini button[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.dispatch-photo-mini img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-code-photo-cell > div:last-child[b-ub6tp7rfkh] {
    min-width: 0;
}

.dispatch-code-photo-cell strong[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(110, 77, 145, .14);
    border-radius: 8px;

    color: #68498a;
    background: #f7f2fb;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.dispatch-code-photo-cell small[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: #9c7932;
    font-size: .43rem;
    font-weight: 650;
}

.source-incident-cell[b-ub6tp7rfkh],
.team-cell[b-ub6tp7rfkh],
.assignment-status-cell[b-ub6tp7rfkh],
.vehicle-cell[b-ub6tp7rfkh],
.responder-cell[b-ub6tp7rfkh],
.latest-update-cell[b-ub6tp7rfkh] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.source-incident-cell[b-ub6tp7rfkh] {
    min-width: 190px;
}

.source-incident-cell > div[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.source-incident-cell strong[b-ub6tp7rfkh],
.team-cell strong[b-ub6tp7rfkh],
.vehicle-cell strong[b-ub6tp7rfkh],
.responder-cell strong[b-ub6tp7rfkh],
.latest-update-cell strong[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.48;
}

.source-incident-cell small[b-ub6tp7rfkh],
.team-cell small[b-ub6tp7rfkh],
.vehicle-cell small[b-ub6tp7rfkh],
.responder-cell small[b-ub6tp7rfkh],
.latest-update-cell small[b-ub6tp7rfkh] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.team-cell em[b-ub6tp7rfkh] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6e4d91;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.assignment-status-cell[b-ub6tp7rfkh] {
    align-items: flex-start;
    gap: 5px;
}

.assignment-status-cell small[b-ub6tp7rfkh] {
    color: #687a73;
    font-size: .43rem;
    font-weight: 650;
}

.assignment-status-cell small.eta-overdue[b-ub6tp7rfkh] {
    color: #b13e36;
}

.latest-update-cell small[b-ub6tp7rfkh] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.status-chip.draft[b-ub6tp7rfkh] {
    color: #6e4d91;
    background: #f0eafb;
}

.status-chip.dispatched[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.accepted[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.en-route[b-ub6tp7rfkh] {
    color: #476f8e;
    background: #eaf2f7;
}

.status-chip.on-scene[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-ub6tp7rfkh] {
    color: #347849;
    background: #e7f5ec;
}

.status-chip.cancelled[b-ub6tp7rfkh] {
    color: #697770;
    background: #edf1ef;
}

.incident-status-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #4b655c;
    background: #edf3f0;

    font-size: .42rem;
    font-weight: 700;
}

.incident-status-chip.new[b-ub6tp7rfkh] {
    color: #ad382f;
    background: #fff0ee;
}

.incident-status-chip.dispatched[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.incident-status-chip.on-scene[b-ub6tp7rfkh],
.incident-status-chip.in-progress[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.dispatch-picker[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.dispatch-source-card[b-ub6tp7rfkh] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(110, 77, 145, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(63, 42, 82, .06);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.dispatch-source-card:hover[b-ub6tp7rfkh] {
    transform: translateY(-2px);

    border-color: rgba(110, 77, 145, .30);

    box-shadow:
        0 15px 31px rgba(63, 42, 82, .12);
}

.dispatch-source-card.selected[b-ub6tp7rfkh] {
    border: 2px solid #7658a7;

    box-shadow:
        0 0 0 4px rgba(118, 88, 167, .09),
        0 16px 34px rgba(63, 42, 82, .14);
}

.dispatch-picker-cover[b-ub6tp7rfkh] {
    position: relative;

    display: grid;
    height: 125px;
    overflow: hidden;

    place-items: center;

    color: #7658a7;
    background:
        radial-gradient(
            circle,
            rgba(118, 88, 167, .13),
            transparent 58%),
        #f2eef7;
}

.dispatch-picker-cover img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-picker-cover > span .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2rem;
}

.priority-badge[b-ub6tp7rfkh] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(75, 84, 79, .84);

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.priority-badge.critical[b-ub6tp7rfkh] {
    background: rgba(183, 57, 48, .92);
}

.priority-badge.urgent[b-ub6tp7rfkh] {
    background: rgba(190, 101, 31, .92);
}

.priority-badge.high[b-ub6tp7rfkh] {
    background: rgba(166, 111, 35, .92);
}

.priority-badge.normal[b-ub6tp7rfkh] {
    background: rgba(48, 112, 81, .90);
}

.dispatch-picker-content[b-ub6tp7rfkh] {
    padding: 10px;
}

.dispatch-picker-content > small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
}

.dispatch-picker-content > strong[b-ub6tp7rfkh] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > p[b-ub6tp7rfkh] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > div[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.received-chip[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #476f8e;
    background: #eaf2f7;

    font-family: 'Kanit', sans-serif;
    font-size: .39rem;
    font-weight: 650;
}

.source-empty-alert[b-ub6tp7rfkh] {
    margin-bottom: 16px;
}

.locked-dispatch-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .11),
            transparent 20rem),
        #faf8fc;
}

.locked-dispatch-cover[b-ub6tp7rfkh] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #7658a7;
    background: #eee8f4;
}

.locked-dispatch-cover img[b-ub6tp7rfkh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-dispatch-cover .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 2.4rem;
}

.locked-dispatch-content[b-ub6tp7rfkh] {
    min-width: 0;
}

.locked-dispatch-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-dispatch-heading small[b-ub6tp7rfkh] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-dispatch-heading h3[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .83rem;
}

.locked-dispatch-heading p[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #7658a7;
    font-size: .50rem;
    font-weight: 700;
}

.locked-incident-badges[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-ub6tp7rfkh] {
    margin: 10px 0 0;

    color: var(--theme-muted);
    font-size: .55rem;
    line-height: 1.72;
}

.locked-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-grid > div[b-ub6tp7rfkh] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(110, 77, 145, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-grid span[b-ub6tp7rfkh] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-risk-note[b-ub6tp7rfkh] {
    display: flex;
    min-height: 38px;

    align-items: center;
    gap: 7px;

    margin-top: 9px;
    padding: 8px 10px;

    border: 1px solid rgba(194, 122, 34, .16);
    border-radius: 10px;

    color: #8f621d;
    background: #fff9ed;

    font-size: .46rem;
}

.source-panel-actions[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-ub6tp7rfkh],
.source-panel-actions button[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(110, 77, 145, .16);
    border-radius: 9px;

    color: #68498a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.source-link-note[b-ub6tp7rfkh] {
    margin-top: 12px;
}

.resource-photo-upload-grid[b-ub6tp7rfkh] {
    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;
}

.resource-banner[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        70px
        minmax(150px, 1fr)
        minmax(140px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .75fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 16px;

    background: rgba(110, 77, 145, .10);

    box-shadow:
        0 12px 30px rgba(63, 42, 82, .07);
}

.resource-banner > div[b-ub6tp7rfkh] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.resource-banner .command-banner-icon[b-ub6tp7rfkh] {
    color: #e5d5ff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3d2c51);
}

.command-banner-icon .mud-icon-root[b-ub6tp7rfkh] {
    font-size: 1.75rem;
}

.resource-banner small[b-ub6tp7rfkh] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.resource-banner strong[b-ub6tp7rfkh] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .57rem;
    line-height: 1.45;
    text-align: center;
}

.source-incident-detail[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .11),
            transparent 18rem),
        #f9f6fc;
}

.source-detail-icon[b-ub6tp7rfkh] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3f2d54);

    box-shadow:
        0 10px 22px rgba(63, 42, 82, .20);
}

.source-incident-detail small[b-ub6tp7rfkh] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-incident-detail h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-incident-detail p[b-ub6tp7rfkh] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-ub6tp7rfkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.resource-location-panel[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.resource-location-panel > span[b-ub6tp7rfkh] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.resource-location-panel small[b-ub6tp7rfkh] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.resource-location-panel h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.resource-location-panel p[b-ub6tp7rfkh] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.resource-location-panel p em[b-ub6tp7rfkh] {
    font-style: normal;
}

.resource-location-panel b[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.resource-location-panel a[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.resource-time-panel[b-ub6tp7rfkh] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .09),
            transparent 18rem),
        #faf8fc;
}

.dispatch-time-heading[b-ub6tp7rfkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dispatch-time-heading small[b-ub6tp7rfkh] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.dispatch-time-heading h3[b-ub6tp7rfkh] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .73rem;
}

.eta-badge[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.eta-badge.normal[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.eta-badge.overdue[b-ub6tp7rfkh] {
    color: #ad382f;
    background: #fff0ee;
}

.eta-badge.arrived[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resource-time-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.resource-time-grid > div[b-ub6tp7rfkh] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(110, 77, 145, .07);
    border-radius: 10px;

    background: #fff;
}

.resource-time-grid span[b-ub6tp7rfkh] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.resource-time-grid strong[b-ub6tp7rfkh] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.resource-detail-grid[b-ub6tp7rfkh] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.resource-detail-grid > div[b-ub6tp7rfkh] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.resource-detail-grid .command-note[b-ub6tp7rfkh] {
    border-color: rgba(110, 77, 145, .14);
    background: #faf7fc;
}

.resource-detail-grid .safety-note[b-ub6tp7rfkh] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.resource-detail-grid small[b-ub6tp7rfkh] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
}

.resource-detail-grid p[b-ub6tp7rfkh] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-ub6tp7rfkh] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #604d70;
    background: #f0eaf5;

    font-size: .41rem;
    font-style: normal;
}

.four-columns[b-ub6tp7rfkh] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-ub6tp7rfkh] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-ub6tp7rfkh] {
    color: #2d78a4;
    background: #e8f3f9;
}

.attachment-card.assignment span[b-ub6tp7rfkh] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-ub6tp7rfkh] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1380px) {
    .status-overview[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-ub6tp7rfkh],
    .four-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-dispatch-panel[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-dispatch-cover[b-ub6tp7rfkh] {
        max-height: 310px;
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .locked-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-ub6tp7rfkh],
    .four-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .status-overview[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-ub6tp7rfkh],
    .resource-photo-upload-grid[b-ub6tp7rfkh],
    .resource-detail-grid[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-banner .command-banner-icon[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }

    .resource-time-grid[b-ub6tp7rfkh],
    .four-columns[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .resource-location-panel[b-ub6tp7rfkh] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .resource-location-panel a[b-ub6tp7rfkh] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-ub6tp7rfkh],
    .locked-grid[b-ub6tp7rfkh],
    .resource-banner[b-ub6tp7rfkh] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-dispatch-heading[b-ub6tp7rfkh] {
        flex-direction: column;
    }

    .locked-incident-badges[b-ub6tp7rfkh] {
        justify-content: flex-start;
    }

    .view-toolbar-actions[b-ub6tp7rfkh] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-ub6tp7rfkh],
    .emergency-resource-page[b-ub6tp7rfkh]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY PERSONNEL & EQUIPMENT PREMIUM
   ========================================================= */

.emergency-resource-page[b-ub6tp7rfkh] {
    --resource-green: var(--theme-primary);
    --resource-deep: #163f35;
    --resource-soft: #edf7f3;
    --resource-gold: #c49a4c;
}

.resource-hero[b-ub6tp7rfkh] {
    background:
        radial-gradient(circle at 88% 18%, rgba(130, 218, 183, .18), transparent 24rem),
        radial-gradient(circle at 14% 80%, rgba(201, 166, 93, .14), transparent 19rem),
        linear-gradient(135deg, #145b49 0%, #0a3e32 54%, #08271f 100%) !important;
}

.hero-accent-line[b-ub6tp7rfkh] {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, transparent, #8fd9b8 18%, #f2d69e 50%, #8fd9b8 82%, transparent);
    box-shadow: 0 0 18px rgba(99, 205, 159, .46);
}

.emergency-resource-page[b-ub6tp7rfkh]  .hero-add-button,
.emergency-resource-page[b-ub6tp7rfkh]  .toolbar-add-button {
    color: #fff !important;
    background: linear-gradient(145deg, #15936e, #0a684f) !important;
    box-shadow: 0 11px 24px rgba(8, 91, 68, .28) !important;
}

.summary-card.personnel[b-ub6tp7rfkh] { --summary-accent:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); --summary-border:rgba(11,116,88,.20); }
.summary-card.equipment[b-ub6tp7rfkh] { --summary-accent:#2d78a4; --summary-soft:#e6f2f9; --summary-border:rgba(45,120,164,.20); }
.summary-card.readiness[b-ub6tp7rfkh] { --summary-accent:#805fa8; --summary-soft:#f0eafb; --summary-border:rgba(128,95,168,.20); }
.summary-card.warning[b-ub6tp7rfkh] { --summary-accent:#bd4f43; --summary-soft:#fff0ee; --summary-border:rgba(189,79,67,.20); }
.emergency-resource-page[b-ub6tp7rfkh]  .summary-card .summary-icon .mud-icon-root { color:var(--summary-accent) !important; }

.status-overview[b-ub6tp7rfkh] { grid-template-columns:repeat(6,minmax(0,1fr)) !important; }
.status-overview-card.checking > span[b-ub6tp7rfkh] { background:#2d78a4; }
.status-overview-card.ready > span[b-ub6tp7rfkh] { background:var(--theme-primary); }
.status-overview-card.mission > span[b-ub6tp7rfkh] { background:#7658a7; }
.status-overview-card.returned > span[b-ub6tp7rfkh] { background:#4e725f; }
.status-overview-card.not-ready > span[b-ub6tp7rfkh] { background:#bd4f43; }

.resource-code-photo-cell[b-ub6tp7rfkh] { display:grid; grid-template-columns:50px minmax(0,1fr); min-width:155px; align-items:center; gap:8px; }
.resource-photo-mini[b-ub6tp7rfkh] { display:grid; width:50px; height:50px; overflow:hidden; place-items:center; border:1px solid rgba(11,116,88,.13); border-radius:12px; color:var(--theme-primary); background:#edf7f3; }
.resource-photo-mini button[b-ub6tp7rfkh] { width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.resource-photo-mini img[b-ub6tp7rfkh] { width:100%; height:100%; object-fit:cover; }
.resource-code-photo-cell strong[b-ub6tp7rfkh] { display:inline-flex; min-height:28px; align-items:center; padding:0 8px; border:1px solid rgba(11,116,88,.14); border-radius:8px; color:#0a684f; background:#eff8f4; font-size:.50rem; font-weight:760; white-space:nowrap; }
.resource-code-photo-cell small[b-ub6tp7rfkh] { display:block; margin-top:4px; color:#9c7932; font-size:.43rem; font-weight:650; }

.source-cell[b-ub6tp7rfkh],.team-cell[b-ub6tp7rfkh],.equipment-cell[b-ub6tp7rfkh],.readiness-cell[b-ub6tp7rfkh],.fuel-return-cell[b-ub6tp7rfkh],.latest-cell[b-ub6tp7rfkh] { display:flex; min-width:132px; flex-direction:column; }
.source-cell[b-ub6tp7rfkh] { min-width:190px; }
.source-cell>div[b-ub6tp7rfkh] { display:flex; flex-wrap:wrap; gap:4px; }
.source-cell strong[b-ub6tp7rfkh],.team-cell strong[b-ub6tp7rfkh],.equipment-cell strong[b-ub6tp7rfkh],.fuel-return-cell strong[b-ub6tp7rfkh],.latest-cell strong[b-ub6tp7rfkh] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.55rem; line-height:1.48; }
.source-cell small[b-ub6tp7rfkh],.team-cell small[b-ub6tp7rfkh],.equipment-cell small[b-ub6tp7rfkh],.latest-cell small[b-ub6tp7rfkh],.fuel-return-cell small[b-ub6tp7rfkh] { margin-top:3px; color:#84928d; font-size:.44rem; line-height:1.5; }
.team-cell em[b-ub6tp7rfkh],.equipment-cell em[b-ub6tp7rfkh] { display:-webkit-box; margin-top:5px; overflow:hidden; color:var(--theme-primary); font-size:.40rem; font-style:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.readiness-cell[b-ub6tp7rfkh] { align-items:flex-start; gap:5px; }
.latest-cell small[b-ub6tp7rfkh] { display:-webkit-box; max-width:190px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }

.readiness-chip[b-ub6tp7rfkh] { display:inline-flex; min-height:24px; align-items:center; padding:0 8px; border-radius:999px; font-size:.42rem; font-weight:700; }
.readiness-chip.ready[b-ub6tp7rfkh] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.readiness-chip.partial[b-ub6tp7rfkh] { color:#94651b; background:#fff1d7; }
.readiness-chip.not-ready[b-ub6tp7rfkh] { color:#aa453e; background:#fff0ef; }
.status-chip.planned[b-ub6tp7rfkh] { color:#6e4d91; background:#f0eafb; }
.status-chip.checking[b-ub6tp7rfkh] { color:#2d78a4; background:#e8f3f9; }
.status-chip.ready[b-ub6tp7rfkh] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.issued[b-ub6tp7rfkh] { color:#8d641f; background:#fff1d7; }
.status-chip.on-mission[b-ub6tp7rfkh] { color:#7658a7; background:#f0eafb; }
.status-chip.returned[b-ub6tp7rfkh] { color:#3d6657; background:#e9f1ed; }
.status-chip.cancelled[b-ub6tp7rfkh] { color:#697770; background:#edf1ef; }

.fuel-track[b-ub6tp7rfkh] { width:95px; height:6px; margin-top:5px; overflow:hidden; border-radius:999px; background:#e6ece9; }
.fuel-track span[b-ub6tp7rfkh] { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#d49a37,var(--theme-primary)); }
.fuel-return-cell small.overdue[b-ub6tp7rfkh] { color:#b13e36; font-weight:700; }

.dispatch-picker[b-ub6tp7rfkh] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.dispatch-source-card[b-ub6tp7rfkh] { overflow:hidden; padding:0; border:1px solid rgba(11,116,88,.12); border-radius:15px; background:#fff; box-shadow:0 10px 25px rgba(8,75,56,.06); cursor:pointer; text-align:left; transition:.17s ease; }
.dispatch-source-card:hover[b-ub6tp7rfkh] { transform:translateY(-2px); border-color:rgba(11,116,88,.30); box-shadow:0 15px 31px rgba(8,75,56,.12); }
.dispatch-source-card.selected[b-ub6tp7rfkh] { border:2px solid var(--theme-primary); box-shadow:0 0 0 4px rgba(11,116,88,.09),0 16px 34px rgba(8,75,56,.14); }
.dispatch-picker-cover[b-ub6tp7rfkh] { position:relative; display:grid; height:125px; overflow:hidden; place-items:center; color:var(--theme-primary); background:radial-gradient(circle,rgba(11,116,88,.13),transparent 58%),#edf7f3; }
.dispatch-picker-cover img[b-ub6tp7rfkh] { width:100%; height:100%; object-fit:cover; }
.dispatch-picker-cover .mud-icon-root[b-ub6tp7rfkh] { font-size:2rem; }
.dispatch-picker-content[b-ub6tp7rfkh] { padding:10px; }
.dispatch-picker-content>small[b-ub6tp7rfkh] { color:#9c7932; font-size:.42rem; font-weight:700; }
.dispatch-picker-content>strong[b-ub6tp7rfkh] { display:-webkit-box; min-height:38px; margin-top:4px; overflow:hidden; color:#354740; font-size:.57rem; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>p[b-ub6tp7rfkh] { display:-webkit-box; min-height:30px; margin:5px 0 0; overflow:hidden; color:var(--theme-muted); font-size:.43rem; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>div[b-ub6tp7rfkh] { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
.source-status-chip[b-ub6tp7rfkh] { display:inline-flex; min-height:23px; align-items:center; padding:0 7px; border-radius:999px; color:#476f8e; background:#eaf2f7; font-size:.39rem; font-weight:650; }

.locked-dispatch-panel[b-ub6tp7rfkh] { display:grid; grid-template-columns:240px minmax(0,1fr); gap:15px; margin-bottom:16px; overflow:hidden; padding:14px; border:1px solid rgba(11,116,88,.13); border-radius:16px; background:radial-gradient(circle at 100% 0%,rgba(201,166,93,.11),transparent 20rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.locked-dispatch-cover[b-ub6tp7rfkh] { display:grid; min-height:220px; overflow:hidden; place-items:center; border-radius:13px; color:var(--theme-primary); background:#e8f3ee; }
.locked-dispatch-cover img[b-ub6tp7rfkh] { width:100%; height:100%; object-fit:cover; }
.locked-dispatch-cover .mud-icon-root[b-ub6tp7rfkh] { font-size:2.4rem; }
.locked-dispatch-heading[b-ub6tp7rfkh] { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.locked-dispatch-heading small[b-ub6tp7rfkh] { color:#9c7932; font-size:.46rem; font-weight:700; }
.locked-dispatch-heading h3[b-ub6tp7rfkh] { margin:4px 0 0; color:#34483f; font-size:.83rem; }
.locked-dispatch-heading p[b-ub6tp7rfkh] { margin:3px 0 0; color:var(--theme-primary); font-size:.50rem; font-weight:700; }
.locked-grid[b-ub6tp7rfkh] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-top:12px; }
.locked-grid>div[b-ub6tp7rfkh] { min-height:58px; padding:8px; border:1px solid rgba(11,116,88,.08); border-radius:10px; background:#fff; }
.locked-grid span[b-ub6tp7rfkh] { display:block; color:var(--theme-muted); font-size:.40rem; }
.locked-grid strong[b-ub6tp7rfkh] { display:block; margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.49rem; line-height:1.42; }
.command-readonly[b-ub6tp7rfkh] { margin-top:9px; padding:10px; border-left:3px solid var(--theme-primary); border-radius:8px; background:#fff; }
.command-readonly small[b-ub6tp7rfkh] { color:var(--theme-primary); font-size:.42rem; font-weight:700; }
.command-readonly p[b-ub6tp7rfkh] { margin:5px 0 0; color:var(--theme-muted); font-size:.49rem; line-height:1.6; }
.source-actions[b-ub6tp7rfkh] { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.source-actions a[b-ub6tp7rfkh],.source-actions button[b-ub6tp7rfkh] { display:inline-flex; min-height:34px; align-items:center; gap:5px; padding:0 9px; border:1px solid rgba(11,116,88,.16); border-radius:9px; color:var(--theme-primary); background:#fff; font-family:'Kanit',sans-serif; font-size:.42rem; font-weight:650; text-decoration:none; cursor:pointer; }

.resource-photo-upload-grid[b-ub6tp7rfkh] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; }
.resource-banner[b-ub6tp7rfkh] { display:grid; grid-template-columns:70px repeat(4,minmax(0,1fr)); gap:1px; margin-top:15px; overflow:hidden; border:1px solid rgba(11,116,88,.11); border-radius:16px; background:rgba(11,116,88,.10); box-shadow:0 12px 30px rgba(8,75,56,.07); }
.resource-banner>div[b-ub6tp7rfkh] { display:flex; min-height:102px; align-items:center; justify-content:center; flex-direction:column; gap:3px; padding:12px; background:#fff; }
.resource-banner .resource-banner-icon[b-ub6tp7rfkh] { color:#ddf5e9; background:linear-gradient(145deg,var(--theme-primary),#16473a); }
.resource-banner-icon .mud-icon-root[b-ub6tp7rfkh] { font-size:1.75rem; }
.resource-banner small[b-ub6tp7rfkh] { color:var(--theme-muted); font-size:.43rem; }
.resource-banner strong[b-ub6tp7rfkh] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.58rem; text-align:center; }

.source-dispatch-detail[b-ub6tp7rfkh] { display:grid; grid-template-columns:62px minmax(0,1fr); gap:11px; align-items:center; margin-top:14px; padding:13px; border:1px solid rgba(11,116,88,.13); border-radius:15px; background:radial-gradient(circle at 100% 0%,rgba(11,116,88,.09),transparent 18rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.source-dispatch-detail>span[b-ub6tp7rfkh] { display:grid; width:62px; height:62px; place-items:center; border-radius:18px; color:#fff; background:linear-gradient(145deg,var(--theme-primary),#153f34); }
.source-dispatch-detail small[b-ub6tp7rfkh] { color:var(--theme-primary); font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.source-dispatch-detail h3[b-ub6tp7rfkh] { margin:3px 0 0; color:#34483f; font-size:.71rem; }
.source-dispatch-detail p[b-ub6tp7rfkh] { margin:4px 0 0; color:#9c7932; font-size:.48rem; font-weight:650; }
.source-dispatch-detail em[b-ub6tp7rfkh] { display:block; margin-top:5px; color:var(--theme-muted); font-size:.50rem; line-height:1.6; font-style:normal; }

.resource-location-panel[b-ub6tp7rfkh] { display:grid; grid-template-columns:54px minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:13px; padding:13px; border:1px solid rgba(45,120,164,.14); border-radius:14px; background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.10),transparent 18rem),#f5fafc; }
.resource-location-panel>span[b-ub6tp7rfkh] { display:grid; width:54px; height:54px; place-items:center; border-radius:16px; color:#fff; background:linear-gradient(145deg,#3a86af,#245f82); }
.resource-location-panel small[b-ub6tp7rfkh] { color:#2d78a4; font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.resource-location-panel h3[b-ub6tp7rfkh] { margin:3px 0 0; color:#344a42; font-size:.69rem; }
.resource-location-panel p[b-ub6tp7rfkh] { margin:4px 0 0; color:var(--theme-muted); font-size:.51rem; }
.resource-location-panel b[b-ub6tp7rfkh] { display:block; margin-top:4px; color:#2d78a4; font-size:.43rem; }
.resource-location-panel a[b-ub6tp7rfkh] { display:inline-flex; min-height:38px; align-items:center; gap:5px; padding:0 10px; border:1px solid rgba(45,120,164,.18); border-radius:10px; color:#2d78a4; background:#fff; font-size:.44rem; font-weight:650; text-decoration:none; }

.resource-detail-grid[b-ub6tp7rfkh] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:13px; }
.resource-detail-grid>div[b-ub6tp7rfkh] { min-height:105px; padding:13px; border:1px solid rgba(7,88,67,.08); border-radius:13px; background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.resource-detail-grid .ready-note[b-ub6tp7rfkh] { border-color:rgba(11,116,88,.14); background:#f2faf6; }
.resource-detail-grid .defect-note[b-ub6tp7rfkh] { border-color:rgba(189,79,67,.14); background:#fff7f5; }
.resource-detail-grid small[b-ub6tp7rfkh] { color:var(--theme-primary); font-size:.45rem; font-weight:700; }
.resource-detail-grid p[b-ub6tp7rfkh] { margin:7px 0 0; color:#60756d; font-size:.54rem; line-height:1.75; }

.five-columns[b-ub6tp7rfkh] { grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
.attachment-card.incident span[b-ub6tp7rfkh] { color:#ad382f; background:#fff0ee; }
.attachment-card.assignment span[b-ub6tp7rfkh] { color:#7658a7; background:#f0eafb; }
.attachment-card.preparation span[b-ub6tp7rfkh] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.attachment-card.equipment span[b-ub6tp7rfkh] { color:#2d78a4; background:#e8f3f9; }
.attachment-card.returned span[b-ub6tp7rfkh] { color:#8d641f; background:#fff1d7; }

@media (max-width:1380px) {
    .status-overview[b-ub6tp7rfkh] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
    .dispatch-picker[b-ub6tp7rfkh] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .five-columns[b-ub6tp7rfkh] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:1050px) {
    .locked-dispatch-panel[b-ub6tp7rfkh] { grid-template-columns:minmax(0,1fr); }
    .locked-grid[b-ub6tp7rfkh] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .resource-banner[b-ub6tp7rfkh] { grid-template-columns:70px repeat(2,minmax(0,1fr)); }
    .resource-photo-upload-grid[b-ub6tp7rfkh],.five-columns[b-ub6tp7rfkh] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:800px) {
    .status-overview[b-ub6tp7rfkh] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .dispatch-picker[b-ub6tp7rfkh],.resource-photo-upload-grid[b-ub6tp7rfkh],.resource-detail-grid[b-ub6tp7rfkh],.five-columns[b-ub6tp7rfkh] { grid-template-columns:minmax(0,1fr) !important; }
    .resource-banner[b-ub6tp7rfkh] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .resource-banner .resource-banner-icon[b-ub6tp7rfkh] { grid-column:1/-1; }
    .resource-location-panel[b-ub6tp7rfkh] { grid-template-columns:50px minmax(0,1fr); }
    .resource-location-panel a[b-ub6tp7rfkh] { grid-column:1/-1; }
}
@media (max-width:560px) {
    .status-overview[b-ub6tp7rfkh],.locked-grid[b-ub6tp7rfkh],.resource-banner[b-ub6tp7rfkh] { grid-template-columns:minmax(0,1fr) !important; }
    .locked-dispatch-heading[b-ub6tp7rfkh] { flex-direction:column; }
    .view-toolbar-actions[b-ub6tp7rfkh] { width:100%; align-items:stretch; flex-direction:column; }
    .view-map-button[b-ub6tp7rfkh],.emergency-resource-page[b-ub6tp7rfkh]  .view-edit-button { width:100%; }
}
/* /Components/Pages/01Ziticen/06Emergency/EmergencyShelters.razor.rz.scp.css */
.emergency-shelter-page[b-n9712e0trl] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.emergency-shelter-page[b-n9712e0trl]  .emergency-shelter-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.shelter-hero[b-n9712e0trl] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);
    min-height: 294px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-n9712e0trl] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-n9712e0trl] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-n9712e0trl] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-n9712e0trl] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-n9712e0trl] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-n9712e0trl] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-n9712e0trl] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-n9712e0trl] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-n9712e0trl] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));
    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-n9712e0trl] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-n9712e0trl] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-n9712e0trl] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .56rem;
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button,
.emergency-shelter-page[b-n9712e0trl]  .search-button,
.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button,
.emergency-shelter-page[b-n9712e0trl]  .save-button {
    border-radius: 13px !important;

    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;

    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-n9712e0trl] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-n9712e0trl] {
    opacity: .55;
    cursor: not-allowed;
}

.emergency-shelter-page[b-n9712e0trl]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.emergency-shelter-page[b-n9712e0trl]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-n9712e0trl] {
    margin-top: 7px;
}

.summary-card[b-n9712e0trl] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-n9712e0trl] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.today[b-n9712e0trl] {
    color: #2c7da8;
}

.summary-card.pending[b-n9712e0trl] {
    color: #7658a7;
}

.summary-card.urgent[b-n9712e0trl] {
    color: #c05b4e;
}

.summary-line[b-n9712e0trl] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-n9712e0trl] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-n9712e0trl] {
    min-width: 0;
}

.summary-card small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-n9712e0trl] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-n9712e0trl] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-n9712e0trl] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-n9712e0trl],
.shelter-list-panel[b-n9712e0trl] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-n9712e0trl],
.list-toolbar[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-n9712e0trl],
.panel-kicker[b-n9712e0trl] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-n9712e0trl],
.list-toolbar h2[b-n9712e0trl] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-n9712e0trl],
.list-toolbar p[b-n9712e0trl] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-n9712e0trl] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-n9712e0trl] {
    align-items: center;
}

.emergency-shelter-page[b-n9712e0trl]  .premium-field,
.emergency-shelter-page[b-n9712e0trl]  .form-field {
    width: 100%;
}

.emergency-shelter-page[b-n9712e0trl]  .premium-field .mud-input-outlined-border,
.emergency-shelter-page[b-n9712e0trl]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.emergency-shelter-page[b-n9712e0trl]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.emergency-shelter-page[b-n9712e0trl]  .sort-select {
    width: 170px;
}

.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button {
    min-height: 42px;
}

.emergency-shelter-page[b-n9712e0trl]  .shelter-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.emergency-shelter-page[b-n9712e0trl]  .shelter-table .mud-table-head {
    background: #eef6f2;
}

.emergency-shelter-page[b-n9712e0trl]  .shelter-table .mud-table-cell {
    padding: 13px 10px;

    border-bottom-color: var(--theme-border);

    font-size: .64rem;
}

.complaint-no[b-n9712e0trl] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .55rem;
    font-weight: 700;
    white-space: nowrap;
}

.photo-pair-mini[b-n9712e0trl] {
    display: flex;
    min-width: 126px;
    align-items: center;
    gap: 6px;
}

.mini-photo-button[b-n9712e0trl],
.mini-photo-empty[b-n9712e0trl] {
    position: relative;

    display: grid;
    width: 58px;
    height: 52px;
    place-items: center;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 10px;

    color: var(--theme-muted);
    background: #edf5f1;
}

.mini-photo-button[b-n9712e0trl] {
    cursor: zoom-in;
}

.mini-photo-button img[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.mini-photo-button.document img[b-n9712e0trl] {
    object-fit: cover;
}

.mini-photo-button small[b-n9712e0trl] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    left: 3px;

    padding: 2px 3px;

    border-radius: 5px;

    color: #fff;
    background: rgba(3, 45, 36, .78);

    font-size: .39rem;
    line-height: 1;
    text-align: center;
}

.mini-photo-empty.document[b-n9712e0trl] {
    color: #9c7b38;
}

.applicant-cell[b-n9712e0trl] {
    display: flex;
    min-width: 190px;
    align-items: center;
    gap: 9px;
}

.applicant-avatar[b-n9712e0trl] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.applicant-cell > span:last-child[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.applicant-cell strong[b-n9712e0trl],
.applicant-cell small[b-n9712e0trl] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.applicant-cell strong[b-n9712e0trl] {
    color: var(--theme-ink);
    font-size: .67rem;
}

.applicant-cell small[b-n9712e0trl] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .51rem;
}

.subject-cell[b-n9712e0trl] {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    gap: 5px;
}

.subject-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
}

.type-chip[b-n9712e0trl],
.channel-chip[b-n9712e0trl],
.priority-chip[b-n9712e0trl],
.status-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .49rem;
    font-weight: 620;
    white-space: nowrap;
}

.type-chip[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.type-chip.public_repair[b-n9712e0trl],
.type-chip.construction[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.type-chip.license[b-n9712e0trl],
.type-chip.food_license[b-n9712e0trl],
.type-chip.tax[b-n9712e0trl] {
    color: #95671d;
    background: #fff1d7;
}

.type-chip.welfare[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.type-chip.public_health[b-n9712e0trl],
.type-chip.environment[b-n9712e0trl] {
    color: #397849;
    background: #ebf7ec;
}

.type-chip.disaster[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.location-cell[b-n9712e0trl],
.date-cell[b-n9712e0trl] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.location-cell strong[b-n9712e0trl],
.date-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.location-cell small[b-n9712e0trl],
.date-cell small[b-n9712e0trl] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.45;
}

.channel-chip.counter[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.channel-chip.field[b-n9712e0trl] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.low[b-n9712e0trl] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-n9712e0trl] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-n9712e0trl] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-n9712e0trl] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);
    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

.status-chip[b-n9712e0trl] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-n9712e0trl] {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.new[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.review[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.emergency-shelter-page[b-n9712e0trl]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.emergency-shelter-page[b-n9712e0trl]  .row-action.view {
    color: #2d79a2;
}

.emergency-shelter-page[b-n9712e0trl]  .row-action.edit {
    color: var(--theme-primary);
}

.emergency-shelter-page[b-n9712e0trl]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.emergency-shelter-page[b-n9712e0trl]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-n9712e0trl] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    text-align: center;
}

.empty-state > span[b-n9712e0trl] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-n9712e0trl] {
    margin: 14px 0 0;

    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-n9712e0trl] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-n9712e0trl] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.shelter-form-modal[b-n9712e0trl],
.shelter-view-modal[b-n9712e0trl],
.delete-modal[b-n9712e0trl] {
    width: min(100%, 1160px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-n9712e0trl .22s ease-out;
}

@keyframes modalAppear-b-n9712e0trl {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.shelter-form-modal[b-n9712e0trl] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-n9712e0trl] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-n9712e0trl] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-n9712e0trl] {
    margin: 2px 0 0;

    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-n9712e0trl] {
    overflow-y: auto;

    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-n9712e0trl] {
    margin-top: 24px;
}

.form-section-title > span[b-n9712e0trl] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-n9712e0trl] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-n9712e0trl] {
    margin-top: 1px;

    color: var(--theme-muted);
    font-size: .52rem;
}

.photo-upload-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 15px;
}

.photo-upload-card[b-n9712e0trl] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 17px;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.photo-upload-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.photo-upload-heading > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 13px;

    color: #f0d493;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.photo-upload-heading > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-n9712e0trl] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.photo-upload-heading small[b-n9712e0trl] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .52rem;
}

.photo-preview[b-n9712e0trl] {
    display: grid;
    min-height: 260px;
    place-items: center;

    margin-top: 13px;
    overflow: hidden;

    border: 1px dashed rgba(7, 88, 67, .19);
    border-radius: 15px;

    background: linear-gradient(145deg, #edf5f1, #f9fbfa);
}

.document-preview[b-n9712e0trl] {
    min-height: 310px;
}

.photo-preview img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    max-height: 370px;

    object-fit: contain;
}

.photo-empty[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;

    color: #82938d;
    text-align: center;
}

.photo-empty .mud-icon-root[b-n9712e0trl] {
    margin-bottom: 9px;
    font-size: 2.5rem;
}

.photo-empty strong[b-n9712e0trl] {
    color: #557068;
    font-size: .66rem;
}

.photo-empty small[b-n9712e0trl] {
    margin-top: 4px;

    font-size: .50rem;
}

.photo-upload-actions[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-top: 11px;
}

.file-picker-button[b-n9712e0trl],
.remove-photo-button[b-n9712e0trl] {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;

    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    cursor: pointer;
}

.file-picker-button[b-n9712e0trl] {
    flex: 1;

    color: #f4d997;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.file-picker-button input[type="file"][b-n9712e0trl] {
    display: none;
}

.remove-photo-button[b-n9712e0trl] {
    border: 1px solid rgba(179, 68, 61, .16);

    color: #a64640;
    background: #fff4f2;
}

.emergency-shelter-page[b-n9712e0trl]  .photo-note {
    margin-top: 13px;
    border-radius: 12px !important;
}

.modal-footer[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.emergency-shelter-page[b-n9712e0trl]  .cancel-button,
.emergency-shelter-page[b-n9712e0trl]  .save-button,
.emergency-shelter-page[b-n9712e0trl]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.emergency-shelter-page[b-n9712e0trl]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.emergency-shelter-page[b-n9712e0trl]  .save-button {
    min-width: 170px;
}

.shelter-view-modal[b-n9712e0trl] {
    width: min(100%, 860px);
    overflow-y: auto;
}

.view-cover[b-n9712e0trl] {
    position: relative;

    min-height: 270px;
    overflow: hidden;

    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-cover > img[b-n9712e0trl] {
    width: 100%;
    height: 270px;

    object-fit: cover;
}

.view-cover-empty[b-n9712e0trl] {
    display: grid;
    height: 270px;
    place-items: center;

    color: rgba(255, 255, 255, .35);
}

.view-cover-empty .mud-icon-root[b-n9712e0trl] {
    font-size: 5rem;
}

.view-cover-overlay[b-n9712e0trl] {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(2, 35, 28, .87));
}

.view-close[b-n9712e0trl] {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 3;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 12px;

    color: #fff;
    background: rgba(3, 45, 36, .55);

    cursor: pointer;
}

.view-cover-title[b-n9712e0trl] {
    position: absolute;
    right: 22px;
    bottom: 20px;
    left: 22px;
    z-index: 2;
}

.view-cover-title small[b-n9712e0trl] {
    color: #f0d692;
    font-size: .55rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-cover-title h2[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #fff;
    font-size: 1.35rem;
    line-height: 1.35;
}

.view-cover-title p[b-n9712e0trl] {
    margin: 3px 0 0;

    color: rgba(255, 255, 255, .65);
    font-size: .59rem;
}

.view-content[b-n9712e0trl] {
    padding: 22px;
}

.view-toolbar[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.view-status-row[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.view-summary-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-top: 16px;
}

.view-summary-grid article[b-n9712e0trl] {
    display: flex;
    min-height: 78px;
    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-summary-grid article > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.view-summary-grid article > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.view-summary-grid small[b-n9712e0trl],
.view-info-grid span[b-n9712e0trl],
.view-description small[b-n9712e0trl],
.attachment-heading small[b-n9712e0trl],
.view-note small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .51rem;
}

.view-summary-grid strong[b-n9712e0trl] {
    margin-top: 2px;

    overflow: hidden;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.view-description[b-n9712e0trl] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-description p[b-n9712e0trl] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.view-info-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.view-info-grid > div[b-n9712e0trl] {
    display: flex;
    min-height: 75px;
    justify-content: center;
    flex-direction: column;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid strong[b-n9712e0trl] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.6;
}

.attachment-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.attachment-heading h3[b-n9712e0trl] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.attachment-heading > span[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-n9712e0trl] {
    position: relative;

    min-height: 220px;
    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.document[b-n9712e0trl] {
    background: #f3efe5;
}

.attachment-card img[b-n9712e0trl] {
    width: 100%;
    height: 240px;

    object-fit: contain;
}

.attachment-card > span[b-n9712e0trl] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-n9712e0trl] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-n9712e0trl] {
    font-size: 2.3rem;
}

.view-note[b-n9712e0trl] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-n9712e0trl] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.image-preview-backdrop[b-n9712e0trl] {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(2, 24, 19, .86);
    backdrop-filter: blur(10px);
}

.image-preview-modal[b-n9712e0trl] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);

    width: min(1100px, 96vw);
    max-height: 94dvh;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .30);
    border-radius: 22px;

    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .45);
}

.image-preview-header[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 14px 17px;

    border-bottom: 1px solid rgba(7, 88, 67, .10);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 58%, white), #eef5f1);
}

.image-preview-header small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.image-preview-header h3[b-n9712e0trl] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .84rem;
}

.image-preview-body[b-n9712e0trl] {
    display: grid;
    min-height: 0;
    place-items: center;

    padding: 15px;
    overflow: auto;

    background:
        linear-gradient(45deg, #edf2ef 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #edf2ef 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #edf2ef 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #edf2ef 75%) -10px 0 / 20px 20px,
        #f8faf9;
}

.image-preview-body img[b-n9712e0trl] {
    max-width: 100%;
    max-height: calc(94dvh - 95px);

    object-fit: contain;

    border-radius: 12px;
    box-shadow: 0 15px 42px rgba(3, 45, 36, .20);
}

.delete-modal[b-n9712e0trl] {
    width: min(100%, 440px);
    padding: 27px;

    text-align: center;
}

.delete-icon[b-n9712e0trl] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-n9712e0trl] {
    margin: 17px 0 0;

    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-n9712e0trl] {
    margin: 8px 0 0;

    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-n9712e0trl] {
    color: #963b36;
}

.delete-warning[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.emergency-shelter-page[b-n9712e0trl]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .shelter-hero[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-n9712e0trl] {
        max-width: 570px;
    }

    .list-toolbar[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-n9712e0trl] {
        justify-content: flex-end;
    }
}

@media (max-width: 800px) {
    .emergency-shelter-page[b-n9712e0trl] {
        padding: 15px 12px 30px;
    }

    .shelter-hero[b-n9712e0trl] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-n9712e0trl] {
        font-size: 2.3rem;
    }

    .hero-meta[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-n9712e0trl] {
        width: 100%;
    }

    .filter-heading[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }

    .emergency-shelter-page[b-n9712e0trl]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-n9712e0trl] {
        align-items: flex-start;
        flex-direction: column;
    }

    .photo-upload-grid[b-n9712e0trl],
    .attachment-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .view-summary-grid[b-n9712e0trl],
    .view-info-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal-backdrop[b-n9712e0trl] {
        align-items: end;
        padding: 0;
    }

    .shelter-form-modal[b-n9712e0trl],
    .shelter-view-modal[b-n9712e0trl] {
        width: 100%;
        max-height: 94dvh;

        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-n9712e0trl] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .photo-upload-actions[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .filter-panel[b-n9712e0trl],
    .shelter-list-panel[b-n9712e0trl] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-n9712e0trl] {
        align-items: flex-start;
    }

    .modal-icon[b-n9712e0trl] {
        display: none;
    }

    .modal-footer[b-n9712e0trl] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .emergency-shelter-page[b-n9712e0trl]  .save-button {
        min-width: 0;
    }

    .view-toolbar[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }

    .image-preview-backdrop[b-n9712e0trl] {
        padding: 0;
    }

    .image-preview-modal[b-n9712e0trl] {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;

        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-n9712e0trl],
    .shelter-form-modal[b-n9712e0trl],
    .shelter-view-modal[b-n9712e0trl],
    .delete-modal[b-n9712e0trl] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   COMPLAINT STATUS OVERVIEW
   ========================================================= */
.status-overview[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 10px;
    margin-top: 24px;
}

.status-overview-card[b-n9712e0trl] {
    display: flex;
    min-height: 88px;

    align-items: center;
    gap: 10px;

    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: #536c63;
    background: linear-gradient(145deg, #fff, #f5f9f7);

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.status-overview-card:hover[b-n9712e0trl],
.status-overview-card.selected[b-n9712e0trl] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .27);

    box-shadow: 0 15px 32px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    place-items: center;

    border-radius: 12px;

    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .52rem;
}

.status-overview-card strong[b-n9712e0trl] {
    margin-top: 2px;

    color: var(--theme-ink);
    font-size: 1rem;
}

.status-overview-card.new > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.screening > span[b-n9712e0trl] {
    background: #b17b25;
}

.status-overview-card.assigned > span[b-n9712e0trl] {
    background: #7658a7;
}

.status-overview-card.progress > span[b-n9712e0trl] {
    background: #346fa2;
}

.status-overview-card.completed > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.selected[b-n9712e0trl] {
    background: linear-gradient(145deg, #eff8f4, #fff);
}

/* =========================================================
   COMPLAINT TABLE
   ========================================================= */
.complainant-cell[b-n9712e0trl] {
    display: flex;
    min-width: 195px;

    align-items: center;
    gap: 9px;
}

.complainant-avatar[b-n9712e0trl] {
    display: grid;
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);

    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .66rem;
    font-weight: 700;
}

.complainant-avatar.anonymous[b-n9712e0trl] {
    color: #f1d798;
    background: linear-gradient(145deg, #51427a, #30254f);
}

.complainant-cell > span:last-child[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.complainant-cell strong[b-n9712e0trl],
.complainant-cell small[b-n9712e0trl] {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.complainant-cell strong[b-n9712e0trl] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.complainant-cell small[b-n9712e0trl] {
    margin-top: 2px;

    color: var(--theme-muted);
    font-size: .50rem;
}

.category-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 26px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);

    font-size: .48rem;
    font-weight: 620;
    white-space: nowrap;
}

.category-chip.corruption[b-n9712e0trl] {
    color: #fff;
    background: linear-gradient(145deg, #d35c55, #9e3430);
}

.category-chip.infrastructure[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.category-chip.environment[b-n9712e0trl] {
    color: #397849;
    background: #ebf7ec;
}

.category-chip.nuisance[b-n9712e0trl] {
    color: #95671d;
    background: #fff1d7;
}

.category-chip.safety[b-n9712e0trl] {
    color: #b14f42;
    background: #fff0ef;
}

.category-chip.officer_conduct[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.category-chip.consumer[b-n9712e0trl] {
    color: #2c6d75;
    background: #e6f4f5;
}

.privacy-cell[b-n9712e0trl] {
    min-width: 116px;
}

.privacy-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .48rem;
    font-weight: 650;
    white-space: nowrap;
}

.privacy-chip.anonymous[b-n9712e0trl] {
    color: #fff;
    background: linear-gradient(145deg, #65528e, #3e315f);
}

.privacy-chip.confidential[b-n9712e0trl] {
    color: #9a671c;
    background: #fff1d7;
}

.privacy-chip.public[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.screening[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.assigned[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in_progress[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.rejected[b-n9712e0trl],
.status-chip.cancelled[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.priority-chip.low[b-n9712e0trl] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.priority-chip.normal[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.priority-chip.high[b-n9712e0trl] {
    color: #95671d;
    background: #fff1d7;
}

.priority-chip.urgent[b-n9712e0trl] {
    color: #b14f42;
    background: #fff0ef;
}

.priority-chip.critical[b-n9712e0trl] {
    color: #fff;
    background: linear-gradient(145deg, #dc625b, #a53732);

    box-shadow: 0 6px 15px rgba(165, 55, 50, .18);
}

/* =========================================================
   PRIVACY FORM
   ========================================================= */
.privacy-switch-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 20px;
}

.privacy-switch-panel > div[b-n9712e0trl] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    min-height: 82px;

    align-items: center;
    gap: 10px;

    padding: 12px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.privacy-switch-panel > div.active[b-n9712e0trl] {
    border-color: rgba(156, 121, 50, .30);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 12rem),
        #fffaf1;
}

.privacy-switch-panel > div > span[b-n9712e0trl] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;

    border-radius: 13px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.privacy-switch-panel > div > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.privacy-switch-panel strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.privacy-switch-panel small[b-n9712e0trl] {
    margin-top: 2px;

    color: #8b9993;
    font-size: .49rem;
    line-height: 1.45;
}

.complaint-preview[b-n9712e0trl],
.evidence-preview[b-n9712e0trl] {
    min-height: 310px;
}

/* =========================================================
   COMPLAINT DETAIL
   ========================================================= */
.shelter-view-modal[b-n9712e0trl] {
    width: min(100%, 920px);
}

.desired-resolution[b-n9712e0trl],
.screening-panel[b-n9712e0trl],
.attachment-panel[b-n9712e0trl] {
    margin-top: 15px;
}

.desired-resolution[b-n9712e0trl] {
    padding: 14px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 15rem),
        #fffaf2;
}

.desired-resolution small[b-n9712e0trl],
.screening-panel small[b-n9712e0trl],
.section-heading small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .51rem;
}

.desired-resolution p[b-n9712e0trl],
.screening-panel p[b-n9712e0trl] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .61rem;
    line-height: 1.75;
}

.screening-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.screening-panel > div[b-n9712e0trl] {
    min-height: 94px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.attachment-panel[b-n9712e0trl] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.section-heading[b-n9712e0trl] {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.section-heading h3[b-n9712e0trl] {
    margin: 2px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .76rem;
}

.section-heading > span[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;

    padding: 0 9px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .50rem;
    font-weight: 650;
}

.attachment-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.attachment-card[b-n9712e0trl] {
    position: relative;

    min-height: 230px;

    padding: 0;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;

    background: var(--theme-border);
    cursor: zoom-in;
}

.attachment-card.evidence[b-n9712e0trl] {
    background: #f3efe5;
}

.attachment-card img[b-n9712e0trl] {
    width: 100%;
    height: 250px;

    object-fit: contain;
}

.attachment-card > span[b-n9712e0trl] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    left: 8px;

    display: flex;
    min-height: 32px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    border-radius: 9px;

    color: #fff;
    background: rgba(3, 45, 36, .80);

    font-size: .51rem;
}

.attachment-empty[b-n9712e0trl] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 150px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 13px;

    color: #84958e;
    background: #eef4f1;

    font-size: .55rem;
}

.attachment-empty .mud-icon-root[b-n9712e0trl] {
    font-size: 2.3rem;
}

/* =========================================================
   RESPONSIVE COMPLAINT
   ========================================================= */
@media (max-width: 1200px) {
    .status-overview[b-n9712e0trl] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .privacy-switch-panel[b-n9712e0trl],
    .screening-panel[b-n9712e0trl],
    .attachment-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .status-overview[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* All complaints: additional status shortcuts */
.status-overview-card.rejected > span[b-n9712e0trl] {
    background: #8b5b36;
}

.status-overview-card.cancelled > span[b-n9712e0trl] {
    background: #aa453e;
}

.summary-card.overdue[b-n9712e0trl],
.summary-card.urgent[b-n9712e0trl] {
    color: #b14f42;
}

@media (min-width: 1201px) {
    .status-overview[b-n9712e0trl] {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }
}

/* =========================================================
   ALL COMPLAINTS โ€” PROGRESS & SLA
   ========================================================= */
.progress-cell[b-n9712e0trl] {
    min-width: 150px;
}

.progress-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0;
}

.progress-heading span[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .61rem;
    font-weight: 750;
}

.progress-heading small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .46rem;
}

.due-cell[b-n9712e0trl],
.latest-cell[b-n9712e0trl] {
    display: flex;
    min-width: 135px;
    flex-direction: column;
}

.due-cell strong[b-n9712e0trl],
.latest-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
}

.due-cell small[b-n9712e0trl],
.latest-cell small[b-n9712e0trl] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.due-cell.overdue strong[b-n9712e0trl],
.due-cell.overdue small[b-n9712e0trl] {
    color: #b54842;
}

.overdue-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(145deg, #d95f59, #a93c37);
    font-size: .47rem;
    font-weight: 700;
}

.sla-form-grid[b-n9712e0trl] {
    margin-top: 8px;
}

.form-progress-preview[b-n9712e0trl] {
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-progress-preview > div[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.form-progress-preview span[b-n9712e0trl] {
    color: #758780;
    font-size: .55rem;
}

.form-progress-preview strong[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: .72rem;
}

/* =========================================================
   ALL COMPLAINTS โ€” DETAIL TIMELINE
   ========================================================= */
.view-progress-panel[b-n9712e0trl],
.history-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 15px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-n9712e0trl],
.section-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.view-progress-heading small[b-n9712e0trl],
.section-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 750;
    letter-spacing: .10em;
}

.view-progress-heading h3[b-n9712e0trl],
.section-heading h3[b-n9712e0trl] {
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .80rem;
}

.view-progress-heading > strong[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: 1.35rem;
}

.view-progress-panel[b-n9712e0trl]  .mud-progress-linear {
    margin-top: 10px;
}

.view-progress-footer[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-n9712e0trl] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837b;
    font-size: .52rem;
}

.history-list[b-n9712e0trl] {
    position: relative;
    margin-top: 15px;
}

.history-list[b-n9712e0trl]::before {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 19px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--theme-primary), rgba(10, 112, 84, .12));
}

.timeline-item[b-n9712e0trl] {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 14px;
}

.timeline-item:last-child[b-n9712e0trl] {
    padding-bottom: 0;
}

.timeline-marker[b-n9712e0trl] {
    position: relative;
    z-index: 2;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 4px solid color-mix(in srgb, var(--theme-bg) 58%, white);
    border-radius: 50%;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 5px 15px rgba(5, 62, 46, .14);
}

.timeline-item.new .timeline-marker[b-n9712e0trl] {
    background: #2d78a4;
}

.timeline-item.screening .timeline-marker[b-n9712e0trl] {
    background: #b17b25;
}

.timeline-item.assigned .timeline-marker[b-n9712e0trl] {
    background: #7658a7;
}

.timeline-item.in_progress .timeline-marker[b-n9712e0trl] {
    background: #346fa2;
}

.timeline-item.completed .timeline-marker[b-n9712e0trl] {
    background: var(--theme-primary);
}

.timeline-item.rejected .timeline-marker[b-n9712e0trl],
.timeline-item.cancelled .timeline-marker[b-n9712e0trl] {
    background: #aa453e;
}

.timeline-content[b-n9712e0trl] {
    padding: 12px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;
    background: #fff;
}

.timeline-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.timeline-heading > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.timeline-heading strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .63rem;
}

.timeline-heading small[b-n9712e0trl] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .47rem;
}

.timeline-content p[b-n9712e0trl] {
    margin: 8px 0 0;
    color: #657870;
    font-size: .57rem;
    line-height: 1.65;
}

.timeline-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.timeline-meta span[b-n9712e0trl] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7c8c85;
    font-size: .48rem;
}

@media (max-width: 800px) {
    .view-progress-footer[b-n9712e0trl] {
        align-items: flex-start;
        flex-direction: column;
    }

    .timeline-heading[b-n9712e0trl] {
        align-items: stretch;
        flex-direction: column;
    }
}


/* =========================================================
   ASSIGNMENT PAGE EXTENSIONS
   ========================================================= */
.summary-card.active[b-n9712e0trl] {
    color: #2d78a4;
}

.summary-card.progress[b-n9712e0trl] {
    color: #7658a7;
}

.status-overview-card.pending > span[b-n9712e0trl] {
    background: #b17b25;
}

.status-overview-card.accepted > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.progress > span[b-n9712e0trl] {
    background: #7658a7;
}

.status-overview-card.completed > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.returned > span[b-n9712e0trl] {
    background: #aa453e;
}

.tracking-number-cell[b-n9712e0trl] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;

    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-n9712e0trl] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.subject-chip-row[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.department-cell[b-n9712e0trl],
.assigned-by-cell[b-n9712e0trl],
.latest-cell[b-n9712e0trl] {
    display: flex;
    min-width: 155px;
    flex-direction: column;
}

.department-cell strong[b-n9712e0trl],
.assigned-by-cell strong[b-n9712e0trl],
.latest-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-n9712e0trl],
.assigned-by-cell small[b-n9712e0trl],
.latest-cell small[b-n9712e0trl] {
    margin-top: 3px;

    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-n9712e0trl] {
    width: fit-content;
    margin-top: 5px;
    padding: 3px 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .44rem;
    font-style: normal;
}

.status-progress-cell[b-n9712e0trl] {
    display: flex;
    min-width: 160px;
    flex-direction: column;
    gap: 6px;
}

.status-chip.pending_accept[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.accepted[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.in_progress[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.returned[b-n9712e0trl],
.status-chip.cancelled[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.switch-card[b-n9712e0trl] {
    display: flex;
    min-height: 72px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 11px 12px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    background: #f9fcfa;
}

.switch-card > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.switch-card strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .60rem;
}

.switch-card small[b-n9712e0trl] {
    margin-top: 2px;

    color: #8c9a94;
    font-size: .48rem;
    line-height: 1.45;
}

.shelter-view-modal[b-n9712e0trl] {
    width: min(100%, 940px);
}

.tracking-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);

    gap: 1px;

    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);

    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.tracking-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 105px;

    align-items: center;
    gap: 11px;

    padding: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.banner-department > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    place-items: center;

    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));

    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.banner-department > div[b-n9712e0trl],
.banner-officer[b-n9712e0trl],
.banner-due[b-n9712e0trl],
.banner-progress[b-n9712e0trl] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.tracking-banner small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-n9712e0trl] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
}

.banner-progress strong[b-n9712e0trl] {
    color: #9c7932;
    font-size: 1.30rem;
}

.assignment-instruction[b-n9712e0trl],
.detail-note-grid[b-n9712e0trl],
.history-panel[b-n9712e0trl],
.attachment-panel[b-n9712e0trl] {
    margin-top: 15px;
}

.assignment-instruction[b-n9712e0trl] {
    padding: 15px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 14px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .11), transparent 15rem),
        #fffaf2;
}

.assignment-instruction small[b-n9712e0trl],
.detail-note-grid small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .51rem;
}

.assignment-instruction p[b-n9712e0trl],
.detail-note-grid p[b-n9712e0trl] {
    margin: 5px 0 0;

    color: #5f746c;
    font-size: .62rem;
    line-height: 1.75;
}

.detail-note-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.detail-note-grid > div[b-n9712e0trl] {
    min-height: 96px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* Ensure assignment timeline uses the same premium structure. */
.history-panel[b-n9712e0trl] {
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-n9712e0trl] {
    position: relative;

    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-n9712e0trl]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;

    width: 2px;

    content: "";

    background: linear-gradient(
        180deg,
        rgba(7, 88, 67, .28),
        rgba(201, 166, 93, .18));
}

.timeline-item.pending_accept .timeline-marker[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.accepted .timeline-marker[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.timeline-item.in_progress .timeline-marker[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.completed .timeline-marker[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.timeline-item.returned .timeline-marker[b-n9712e0trl],
.timeline-item.cancelled .timeline-marker[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.complaint-preview[b-n9712e0trl],
.evidence-preview[b-n9712e0trl] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .tracking-banner[b-n9712e0trl],
    .detail-note-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   V2 โ€” COMPLAINT SOURCE PICKER
   ========================================================= */
.complaint-picker-panel[b-n9712e0trl] {
    margin-bottom: 18px;
    padding: 16px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);

    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.complaint-picker-toolbar[b-n9712e0trl] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;

    align-items: stretch;
    gap: 12px;
}

.complaint-picker-search[b-n9712e0trl] {
    width: 100%;
}

.available-count-card[b-n9712e0trl] {
    display: flex;
    min-height: 58px;

    align-items: center;
    gap: 10px;

    padding: 9px 12px;

    border: 1px solid rgba(156, 121, 50, .19);
    border-radius: 13px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .15), transparent 9rem),
        #fffaf1;
}

.available-count-card > span[b-n9712e0trl] {
    display: grid;
    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 11px;

    color: #f1d798;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-n9712e0trl] {
    color: #8d8878;
    font-size: .48rem;
}

.available-count-card strong[b-n9712e0trl] {
    color: #8b6523;
    font-size: 1rem;
    line-height: 1.1;
}

.complaint-picker-list[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
    max-height: 590px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.complaint-picker-list[b-n9712e0trl]::-webkit-scrollbar {
    width: 8px;
}

.complaint-picker-list[b-n9712e0trl]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(7, 88, 67, .18);
}

.complaint-picker-card[b-n9712e0trl] {
    position: relative;

    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);

    min-height: 190px;
    overflow: hidden;

    padding: 0;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;

    color: inherit;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;

    cursor: pointer;

    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.complaint-picker-card:hover[b-n9712e0trl] {
    transform: translateY(-2px);

    border-color: rgba(7, 88, 67, .28);

    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.complaint-picker-card.selected[b-n9712e0trl] {
    border: 2px solid var(--theme-primary);

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;

    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-n9712e0trl] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;

    display: none;

    color: var(--theme-primary);
    filter: drop-shadow(0 3px 7px rgba(255,255,255,.9));
}

.complaint-picker-card.selected .picker-selected-mark[b-n9712e0trl] {
    display: block;
}

.picker-selected-mark .mud-icon-root[b-n9712e0trl] {
    font-size: 1.55rem;
}

.picker-photo[b-n9712e0trl] {
    display: grid;
    min-height: 190px;

    place-items: center;
    overflow: hidden;

    background:
        linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)),
        #eaf2ee;
}

.picker-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.picker-photo > span[b-n9712e0trl] {
    display: grid;
    width: 64px;
    height: 64px;

    place-items: center;

    border-radius: 18px;

    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-photo > span .mud-icon-root[b-n9712e0trl] {
    font-size: 2rem;
}

.picker-content[b-n9712e0trl] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-n9712e0trl] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-n9712e0trl] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;

    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.source-status-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;

    padding: 0 8px;

    border-radius: 999px;

    font-size: .46rem;
    font-weight: 650;
}

.source-status-chip.new[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.source-status-chip.screening[b-n9712e0trl] {
    color: #96661c;
    background: #fff1d7;
}

.picker-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 11px;
}

.picker-meta span[b-n9712e0trl] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    color: #86958f;
    font-size: .47rem;
}

.picker-meta span .mud-icon-root[b-n9712e0trl] {
    color: var(--theme-primary);
}

.complaint-picker-empty[b-n9712e0trl] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;

    color: #83948d;
    background: #eef5f1;

    text-align: center;
}

.complaint-picker-empty .mud-icon-root[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.complaint-picker-empty strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.complaint-picker-empty small[b-n9712e0trl] {
    max-width: 540px;

    font-size: .52rem;
    line-height: 1.55;
}

.locked-complaint-alert[b-n9712e0trl] {
    margin-bottom: 14px;
}

.selected-complaint-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);

    margin-bottom: 20px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;

    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-complaint-photo[b-n9712e0trl] {
    display: grid;
    min-height: 270px;

    place-items: center;
    overflow: hidden;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-complaint-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.selected-complaint-photo .mud-icon-root[b-n9712e0trl] {
    font-size: 3.2rem;
}

.selected-complaint-content[b-n9712e0trl] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-n9712e0trl] {
    margin: 4px 0 0;

    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-n9712e0trl] {
    margin: 14px 0 0;

    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-n9712e0trl] {
    min-height: 66px;
    padding: 10px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-n9712e0trl] {
    display: block;

    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-complaint-hint[b-n9712e0trl] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;

    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 15px;

    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;

    color: #9c7932;
    background: #fffaf2;
}

.select-complaint-hint > .mud-icon-root[b-n9712e0trl] {
    font-size: 2rem;
}

.select-complaint-hint > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.select-complaint-hint strong[b-n9712e0trl] {
    color: #6c5729;
    font-size: .66rem;
}

.select-complaint-hint small[b-n9712e0trl] {
    margin-top: 3px;

    color: #928468;
    font-size: .51rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .complaint-picker-list[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .complaint-picker-toolbar[b-n9712e0trl],
    .selected-complaint-panel[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-complaint-photo[b-n9712e0trl] {
        min-height: 220px;
    }

    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .complaint-picker-card[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-n9712e0trl] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   FIXED VERSION โ€” SOURCE NOTICE
   ========================================================= */
.assignment-source-notice[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 16px;
    padding: 12px 14px;

    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;

    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.assignment-source-notice > .mud-icon-root[b-n9712e0trl] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.assignment-source-notice > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.assignment-source-notice strong[b-n9712e0trl] {
    color: #0a6048;
    font-size: .66rem;
}

.assignment-source-notice small[b-n9712e0trl] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}


/* =========================================================
   OPERATION TRACKING EXTENSIONS
   ========================================================= */
.summary-card.ontrack[b-n9712e0trl] {
    color: var(--theme-primary);
}

.summary-card.atrisk[b-n9712e0trl] {
    color: #b47b22;
}

.summary-card.overdue[b-n9712e0trl] {
    color: #b84b43;
}

.status-overview-card.progress > span[b-n9712e0trl] {
    background: #7658a7;
}

.status-overview-card.waiting > span[b-n9712e0trl] {
    background: #b17b25;
}

.status-overview-card.paused > span[b-n9712e0trl] {
    background: #75837d;
}

.status-overview-card.completed > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.risk > span[b-n9712e0trl] {
    background: #bc4d45;
}

.tracking-number-cell[b-n9712e0trl] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.tracking-number-cell > span[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.tracking-number-cell small[b-n9712e0trl] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.status-health-cell[b-n9712e0trl],
.progress-cell[b-n9712e0trl],
.followup-cell[b-n9712e0trl],
.latest-cell[b-n9712e0trl],
.department-cell[b-n9712e0trl] {
    display: flex;
    min-width: 150px;
    flex-direction: column;
    gap: 6px;
}

.department-cell strong[b-n9712e0trl],
.followup-cell strong[b-n9712e0trl],
.latest-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.department-cell small[b-n9712e0trl],
.followup-cell small[b-n9712e0trl],
.latest-cell small[b-n9712e0trl] {
    color: #8f9c96;
    font-size: .48rem;
    line-height: 1.45;
}

.department-cell em[b-n9712e0trl] {
    width: fit-content;
    padding: 3px 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .44rem;
    font-style: normal;
}

.progress-cell > div[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-n9712e0trl] {
    color: var(--theme-ink);
    font-size: .66rem;
}

.progress-cell small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .46rem;
}

.status-chip.not_started[b-n9712e0trl] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip.in_progress[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.paused[b-n9712e0trl] {
    color: #67746f;
    background: #eef1ef;
}

.status-chip.completed[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .47rem;
    font-weight: 650;
    white-space: nowrap;
}

.health-chip.on_track[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.health-chip.at_risk[b-n9712e0trl] {
    color: #96661c;
    background: #fff1d7;
}

.health-chip.blocked[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.mini-photo-button.before small[b-n9712e0trl] {
    background: rgba(45, 120, 164, .82);
}

.mini-photo-button.after small[b-n9712e0trl] {
    background: rgba(8, 112, 82, .84);
}

.workorder-source-notice[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(7, 112, 83, .20);
    border-radius: 14px;
    color: #31584a;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 12rem),
        linear-gradient(145deg, #ecf8f2, #ffffff);
}

.workorder-source-notice > .mud-icon-root[b-n9712e0trl] {
    flex: 0 0 auto;
    color: var(--theme-primary);
    font-size: 1.55rem;
}

.workorder-source-notice > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.workorder-source-notice strong[b-n9712e0trl] {
    color: #0a6048;
    font-size: .66rem;
}

.workorder-source-notice small[b-n9712e0trl] {
    margin-top: 2px;
    color: #71847b;
    font-size: .51rem;
    line-height: 1.5;
}

.source-picker-panel[b-n9712e0trl] {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .10), transparent 20rem),
        linear-gradient(145deg, #f8fcfa, #ffffff);
    box-shadow: 0 13px 32px rgba(5, 62, 46, .065);
}

.source-picker-toolbar[b-n9712e0trl] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 155px;
    align-items: stretch;
    gap: 12px;
}

.source-picker-search[b-n9712e0trl] {
    width: 100%;
}

.source-picker-list[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    max-height: 570px;
    margin-top: 13px;
    padding: 2px 5px 5px 2px;
    overflow-y: auto;
}

.source-picker-card[b-n9712e0trl] {
    position: relative;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 190px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 16px;
    color: inherit;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(5, 62, 46, .055);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.source-picker-card:hover[b-n9712e0trl] {
    transform: translateY(-2px);
    border-color: rgba(7, 88, 67, .28);
    box-shadow: 0 17px 34px rgba(5, 62, 46, .11);
}

.source-picker-card.selected[b-n9712e0trl] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.picker-selected-mark[b-n9712e0trl] {
    position: absolute;
    z-index: 3;
    top: 9px;
    right: 9px;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-n9712e0trl] {
    display: block;
}

.picker-photo[b-n9712e0trl] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(145deg, rgba(7, 88, 67, .08), rgba(201, 166, 93, .10)), #eaf2ee;
}

.picker-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-n9712e0trl] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border-radius: 18px;
    color: #e9cf96;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.picker-content[b-n9712e0trl] {
    min-width: 0;
    padding: 13px 14px;
}

.picker-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-n9712e0trl] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.picker-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.picker-heading strong[b-n9712e0trl] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .68rem;
    line-height: 1.45;
}

.picker-content > p[b-n9712e0trl] {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: #71827b;
    font-size: .54rem;
    line-height: 1.62;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-n9712e0trl],
.picker-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 10px;
}

.picker-meta[b-n9712e0trl] {
    gap: 8px 12px;
}

.picker-meta span[b-n9712e0trl] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #86958f;
    font-size: .47rem;
}

.source-status-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2d78a4;
    background: #e7f2f9;
    font-size: .46rem;
    font-weight: 650;
}

.picker-empty[b-n9712e0trl] {
    display: flex;
    min-height: 190px;
    margin-top: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(7, 88, 67, .18);
    border-radius: 15px;
    color: #83948d;
    background: #eef5f1;
    text-align: center;
}

.picker-empty .mud-icon-root[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: 2.5rem;
}

.picker-empty strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .70rem;
}

.picker-empty small[b-n9712e0trl] {
    max-width: 540px;
    font-size: .52rem;
    line-height: 1.55;
}

.selected-source-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .12), transparent 22rem),
        #fff;
    box-shadow: 0 15px 36px rgba(5, 62, 46, .085);
}

.selected-source-photo[b-n9712e0trl] {
    display: grid;
    min-height: 270px;
    place-items: center;
    overflow: hidden;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, #0b7355, var(--theme-dark));
}

.selected-source-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-source-content[b-n9712e0trl] {
    min-width: 0;
    padding: 17px;
}

.selected-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 13px;
}

.selected-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .50rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.selected-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .92rem;
    line-height: 1.42;
}

.selected-heading p[b-n9712e0trl] {
    margin: 4px 0 0;
    color: var(--theme-primary);
    font-size: .57rem;
    font-weight: 700;
}

.selected-badges[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-description[b-n9712e0trl] {
    margin: 14px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.72;
}

.selected-info-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 15px;
}

.selected-info-grid > div[b-n9712e0trl] {
    min-height: 66px;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-info-grid span[b-n9712e0trl] {
    display: block;
    color: var(--theme-muted);
    font-size: .47rem;
}

.selected-info-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .57rem;
    line-height: 1.45;
}

.select-source-hint[b-n9712e0trl] {
    display: flex;
    min-height: 100px;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px;
    border: 1px dashed rgba(156, 121, 50, .26);
    border-radius: 15px;
    color: #9c7932;
    background: #fffaf2;
}

.select-source-hint > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-n9712e0trl] {
    color: #6c5729;
    font-size: .66rem;
}

.select-source-hint small[b-n9712e0trl] {
    margin-top: 3px;
    color: #928468;
    font-size: .51rem;
}

.tracking-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(115px, .65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;
    background: rgba(7, 88, 67, .09);
}

.tracking-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 105px;
    align-items: center;
    gap: 11px;
    padding: 14px;
    background: #fff;
}

.banner-department > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.tracking-banner small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .48rem;
}

.tracking-banner strong[b-n9712e0trl] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
}

.banner-progress strong[b-n9712e0trl] {
    color: #9c7932;
    font-size: 1.30rem;
}

.history-panel[b-n9712e0trl],
.attachment-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-n9712e0trl] {
    position: relative;
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 10px;
}

.history-list[b-n9712e0trl]::before {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 20px;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, rgba(7, 88, 67, .28), rgba(201, 166, 93, .18));
}

.timeline-progress-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .48rem;
    font-weight: 700;
}

.timeline-item.in_progress .timeline-marker[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.timeline-item.waiting .timeline-marker[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.timeline-item.paused .timeline-marker[b-n9712e0trl] {
    color: #67746f;
    background: #eef1ef;
}

.timeline-item.completed .timeline-marker[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.before[b-n9712e0trl] {
    background: #e7f2f9;
}

.attachment-card.after[b-n9712e0trl] {
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.before-preview[b-n9712e0trl],
.after-preview[b-n9712e0trl] {
    min-height: 320px;
}

@media (max-width: 1200px) {
    .tracking-banner[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .source-picker-list[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {
    .source-picker-toolbar[b-n9712e0trl],
    .selected-source-panel[b-n9712e0trl],
    .tracking-banner[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .selected-source-photo[b-n9712e0trl] {
        min-height: 220px;
    }

    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }

    .picker-photo[b-n9712e0trl] {
        min-height: 170px;
        max-height: 220px;
    }

    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   COMPLAINT RESULT SUMMARY EXTENSIONS
   ========================================================= */
.summary-card.resolved[b-n9712e0trl] {
    color: var(--theme-primary);
}

.summary-card.sla[b-n9712e0trl] {
    color: #2d78a4;
}

.summary-card.satisfaction[b-n9712e0trl] {
    color: #b17b25;
}

.status-overview-card.resolved > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.partial > span[b-n9712e0trl] {
    background: #b17b25;
}

.status-overview-card.unfounded > span[b-n9712e0trl] {
    background: #7658a7;
}

.status-overview-card.referred > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.published > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.asset-number-cell[b-n9712e0trl] {
    display: flex;
    min-width: 145px;
    flex-direction: column;
}

.asset-number-cell > span[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-n9712e0trl] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
}

.photo-trio-mini[b-n9712e0trl] {
    display: flex;
    min-width: 95px;
    align-items: center;
    gap: 5px;
}

.photo-trio-mini .mini-photo-button[b-n9712e0trl] {
    width: 38px;
    height: 46px;
}

.photo-trio-mini .mini-photo-button small[b-n9712e0trl] {
    font-size: .36rem;
}

.resolution-chip[b-n9712e0trl],
.publication-chip[b-n9712e0trl],
.sla-chip[b-n9712e0trl],
.source-sla-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 999px;

    font-size: .47rem;
    font-weight: 700;
    white-space: nowrap;
}

.resolution-chip.resolved[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resolution-chip.partial[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.resolution-chip.unfounded[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.resolution-chip.referred[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.resolution-chip.withdrawn[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.publication-chip.internal[b-n9712e0trl] {
    color: #6c7c75;
    background: #edf1ef;
}

.publication-chip.anonymized[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.publication-chip.public[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.within[b-n9712e0trl],
.source-sla-chip.within[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.sla-chip.over[b-n9712e0trl],
.source-sla-chip.over[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.sla-cell[b-n9712e0trl],
.closed-cell[b-n9712e0trl] {
    display: flex;
    min-width: 120px;
    flex-direction: column;
}

.sla-cell strong[b-n9712e0trl],
.closed-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.sla-cell small[b-n9712e0trl],
.closed-cell small[b-n9712e0trl] {
    margin-top: 3px;
    color: #8f9c96;
    font-size: .48rem;
}

.sla-cell.within strong[b-n9712e0trl] {
    color: var(--theme-primary);
}

.sla-cell.over strong[b-n9712e0trl] {
    color: #aa453e;
}

.score-cell[b-n9712e0trl] {
    display: flex;
    min-width: 108px;
    flex-direction: column;
    gap: 3px;
}

.score-stars[b-n9712e0trl] {
    display: flex;
    gap: 1px;
}

.score-stars .mud-icon-root[b-n9712e0trl] {
    color: #d8dedb;
    font-size: .82rem;
}

.score-stars .mud-icon-root.filled[b-n9712e0trl] {
    color: #d0a43f;
}

.score-cell small[b-n9712e0trl] {
    color: #8c9893;
    font-size: .47rem;
}

.shelter-capacity-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.25fr)
        minmax(180px, 1fr)
        minmax(135px, .75fr)
        minmax(120px, .65fr);

    gap: 1px;
    margin-top: 16px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 17px;

    background: rgba(7, 88, 67, .09);
    box-shadow: 0 12px 30px rgba(5, 62, 46, .07);
}

.shelter-capacity-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 105px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 12rem),
        #fff;
}

.shelter-capacity-banner .banner-department[b-n9712e0trl] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-department > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4, 61, 47, .18);
}

.shelter-capacity-banner small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .48rem;
}

.shelter-capacity-banner strong[b-n9712e0trl] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

.banner-score strong[b-n9712e0trl] {
    color: #9c7932;
    font-size: 1.15rem;
}

.instruction-highlight[b-n9712e0trl] {
    margin-top: 15px;
    padding: 17px;

    border: 1px solid rgba(156, 121, 50, .18);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .14), transparent 18rem),
        linear-gradient(145deg, #fffaf1, #fff);
}

.instruction-highlight small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-n9712e0trl] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-n9712e0trl] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.history-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-n9712e0trl] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-n9712e0trl] {
    display: grid;
    width: 40px;
    height: 40px;

    place-items: center;
    border-radius: 12px;

    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.history-list article > div > div[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-n9712e0trl] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-list em[b-n9712e0trl] {
    display: inline-block;
    margin-top: 4px;
    color: #9c7932;
    font-size: .46rem;
    font-style: normal;
}

.three-columns[b-n9712e0trl] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.source-picker-list[b-n9712e0trl] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-picker-card[b-n9712e0trl] {
    grid-template-columns: 128px minmax(0, 1fr);
}

.source-picker-card .picker-content > p[b-n9712e0trl] {
    -webkit-line-clamp: 3;
}

.source-picker-card .source-sla-chip[b-n9712e0trl] {
    min-height: 24px;
    font-size: .43rem;
}

.source-picker-card.selected[b-n9712e0trl] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .13), transparent 17rem),
        #f8fcfa;
    box-shadow:
        0 0 0 4px rgba(7, 112, 83, .08),
        0 18px 36px rgba(5, 62, 46, .13);
}

.source-picker-card.selected .picker-selected-mark[b-n9712e0trl] {
    display: block;
}

@media (max-width: 1200px) {
    .shelter-capacity-banner[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-capacity-banner[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-picker-list[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .source-picker-card[b-n9712e0trl] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   TECHNICIAN WORK ORDER PREMIUM
   ========================================================= */
.summary-card[b-n9712e0trl] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
    border-color: var(--summary-border);
}

.summary-card.total[b-n9712e0trl] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
}

.summary-card.available[b-n9712e0trl] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.progress[b-n9712e0trl] {
    --summary-accent: #7658a7;
    --summary-soft: #eee8fa;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.overdue[b-n9712e0trl] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card .summary-icon[b-n9712e0trl] {
    color: var(--summary-accent);
    background: var(--summary-soft);
    border: 1px solid var(--summary-border);
}

.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
    font-size: 1.75rem;
}

.summary-card .summary-line[b-n9712e0trl] {
    background: linear-gradient(90deg, transparent, var(--summary-accent), transparent);
}

.summary-card p strong[b-n9712e0trl] {
    color: var(--summary-accent);
}

.status-overview-card.draft > span[b-n9712e0trl] { background: #6e7d77; }
.status-overview-card.assigned > span[b-n9712e0trl] { background: #2d78a4; }
.status-overview-card.in-progress > span[b-n9712e0trl] { background: #7658a7; }
.status-overview-card.waiting-part > span[b-n9712e0trl] { background: #ad721a; }
.status-overview-card.completed > span[b-n9712e0trl] { background: var(--theme-primary); }

.asset-number-cell[b-n9712e0trl] {
    display: flex;
    min-width: 148px;
    flex-direction: column;
}

.asset-number-cell > span[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f0f8f4;
    font-size: .54rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-number-cell small[b-n9712e0trl] {
    margin-top: 4px;
    color: #9c7932;
    font-size: .48rem;
    font-weight: 700;
}

.photo-quartet-mini[b-n9712e0trl] {
    display: flex;
    min-width: 158px;
    align-items: center;
    gap: 4px;
}

.photo-quartet-mini .mini-photo-button[b-n9712e0trl] {
    width: 35px;
    height: 48px;
}

.photo-quartet-mini .mini-photo-button.result[b-n9712e0trl] {
    border-color: rgba(8, 112, 84, .25);
}

.photo-quartet-mini .mini-photo-button.result small[b-n9712e0trl] {
    background: rgba(8, 112, 84, .88);
}

.photo-quartet-mini .mini-photo-button.work small[b-n9712e0trl] {
    background: rgba(118, 88, 167, .86);
}

.technician-cell[b-n9712e0trl],
.schedule-cell[b-n9712e0trl],
.budget-cell[b-n9712e0trl] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.technician-cell strong[b-n9712e0trl],
.schedule-cell strong[b-n9712e0trl],
.budget-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .58rem;
    line-height: 1.45;
}

.technician-cell small[b-n9712e0trl],
.schedule-cell small[b-n9712e0trl],
.budget-cell small[b-n9712e0trl] {
    margin-top: 3px;
    color: var(--theme-muted);
    font-size: .47rem;
    line-height: 1.45;
}

.technician-cell em[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #7658a7;
    background: #f0eafb;
    font-size: .42rem;
    font-style: normal;
    font-weight: 650;
}

.schedule-cell.overdue strong[b-n9712e0trl],
.schedule-cell.overdue small[b-n9712e0trl] {
    color: #b3463d;
}

.budget-cell strong[b-n9712e0trl] {
    color: #9c7932;
}

.progress-cell[b-n9712e0trl] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    gap: 6px;
}

.progress-cell > div[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.progress-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.progress-cell small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .45rem;
}

.status-chip.draft[b-n9712e0trl] {
    color: #63736d;
    background: #edf1ef;
}

.status-chip.assigned[b-n9712e0trl] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.accepted[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-progress[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.waiting-part[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.status-chip.completed[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.cancelled[b-n9712e0trl] {
    color: #6c7c75;
    background: #edf1ef;
}

.overdue-inline-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #aa453e;
    background: #fff0ef;
    font-size: .42rem;
    font-weight: 700;
}

.asset-code-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    color: #6f5a28;
    background: #f7edda;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-panel[b-n9712e0trl] {
    margin-bottom: 15px;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-picker-toolbar[b-n9712e0trl] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 10px;
    align-items: center;
}

.available-count-card[b-n9712e0trl] {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;
    background: #fff;
}

.available-count-card > span[b-n9712e0trl] {
    display: grid;
    width: 37px;
    height: 37px;
    place-items: center;
    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
}

.available-count-card > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.available-count-card small[b-n9712e0trl] {
    color: #87948e;
    font-size: .43rem;
}

.available-count-card strong[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: .9rem;
}

.source-picker-list[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    margin-top: 12px;
    overflow: auto;
    padding: 2px;
}

.source-picker-card[b-n9712e0trl] {
    position: relative;
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 11px;
    min-height: 155px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: .18s ease;
}

.source-picker-card:hover[b-n9712e0trl] {
    transform: translateY(-2px);
    border-color: rgba(7, 112, 83, .25);
    box-shadow: 0 15px 30px rgba(5, 62, 46, .10);
}

.source-picker-card.selected[b-n9712e0trl] {
    border: 2px solid var(--theme-primary);
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.13), transparent 17rem),
        #f8fcfa;
    box-shadow: 0 0 0 4px rgba(7,112,83,.08), 0 18px 36px rgba(5,62,46,.13);
}

.picker-selected-mark[b-n9712e0trl] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: none;
    color: var(--theme-primary);
}

.source-picker-card.selected .picker-selected-mark[b-n9712e0trl] {
    display: block;
}

.picker-photo[b-n9712e0trl] {
    height: 132px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef4f1;
}

.picker-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.picker-photo > span[b-n9712e0trl] {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #8ba098;
}

.picker-content[b-n9712e0trl] {
    min-width: 0;
}

.picker-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.picker-heading > div[b-n9712e0trl] {
    min-width: 0;
}

.picker-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.picker-heading strong[b-n9712e0trl] {
    display: block;
    margin-top: 3px;
    color: #315044;
    font-size: .62rem;
    line-height: 1.45;
}

.picker-content > p[b-n9712e0trl] {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #6a7d75;
    font-size: .49rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.picker-chip-row[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.picker-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 8px;
}

.picker-meta span[b-n9712e0trl] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7a8983;
    font-size: .42rem;
}

.picker-empty[b-n9712e0trl] {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    color: var(--theme-muted);
}

.picker-empty strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .65rem;
}

.picker-empty small[b-n9712e0trl] {
    font-size: .47rem;
}

.selected-source-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 13px;
    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(201,166,93,.12), transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.selected-source-photo[b-n9712e0trl] {
    display: grid;
    min-height: 180px;
    overflow: hidden;
    place-items: center;
    border-radius: 13px;
    color: #8fa199;
    background: #e9f0ed;
}

.selected-source-photo img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.selected-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.selected-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.selected-heading h3[b-n9712e0trl] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.selected-heading p[b-n9712e0trl] {
    margin: 3px 0 0;
    color: var(--theme-primary);
    font-size: .52rem;
    font-weight: 700;
}

.selected-badges[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.selected-description[b-n9712e0trl] {
    margin: 9px 0 0;
    color: #61756d;
    font-size: .57rem;
    line-height: 1.7;
}

.selected-info-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.selected-info-grid > div[b-n9712e0trl] {
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(7,88,67,.07);
    border-radius: 10px;
    background: #fff;
}

.selected-info-grid span[b-n9712e0trl] {
    display: block;
    color: var(--theme-muted);
    font-size: .42rem;
}

.selected-info-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 4px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
    line-height: 1.4;
}

.select-source-hint[b-n9712e0trl] {
    display: flex;
    min-height: 90px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    border: 1px dashed rgba(7,88,67,.20);
    border-radius: 14px;
    color: var(--theme-primary);
    background: #f4faf7;
}

.select-source-hint > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.select-source-hint strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .6rem;
}

.select-source-hint small[b-n9712e0trl] {
    margin-top: 3px;
    color: #7f8f88;
    font-size: .46rem;
}

.shelter-capacity-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns: minmax(220px,1.2fr) minmax(160px,.8fr) minmax(145px,.75fr) minmax(120px,.65fr);
    gap: 1px;
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid rgba(7,88,67,.11);
    border-radius: 17px;
    background: rgba(7,88,67,.09);
    box-shadow: 0 12px 30px rgba(5,62,46,.07);
}

.shelter-capacity-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 105px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 14px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 12rem), #fff;
}

.shelter-capacity-banner .banner-technician[b-n9712e0trl] {
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 11px;
}

.banner-technician > span[b-n9712e0trl] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 16px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 9px 21px rgba(4,61,47,.18);
}

.shelter-capacity-banner small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .48rem;
}

.shelter-capacity-banner strong[b-n9712e0trl] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
    line-height: 1.45;
    text-align: center;
}

.banner-progress strong[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.view-progress-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-progress-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.view-progress-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-progress-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.view-progress-heading > strong[b-n9712e0trl] {
    color: var(--theme-primary);
    font-size: 1.25rem;
}

.view-progress-footer[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.view-progress-footer span[b-n9712e0trl] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #697b74;
    font-size: .51rem;
}

.instruction-highlight[b-n9712e0trl] {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid rgba(156,121,50,.18);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.14), transparent 18rem), linear-gradient(145deg,#fffaf1,#fff);
}

.instruction-highlight small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .49rem;
    font-weight: 700;
    letter-spacing: .09em;
}

.instruction-highlight h3[b-n9712e0trl] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .82rem;
}

.instruction-highlight p[b-n9712e0trl] {
    margin: 9px 0 0;
    color: #5f746c;
    font-size: .64rem;
    line-height: 1.8;
}

.detail-note-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 13px;
}

.detail-note-grid > div[b-n9712e0trl] {
    min-height: 100px;
    padding: 13px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-note-grid small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .47rem;
    font-weight: 700;
}

.detail-note-grid p[b-n9712e0trl] {
    margin: 7px 0 0;
    color: #60756d;
    font-size: .56rem;
    line-height: 1.7;
}

.history-panel[b-n9712e0trl] {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid rgba(7,88,67,.10);
    border-radius: 15px;
    background: radial-gradient(circle at 100% 0%, rgba(201,166,93,.08), transparent 18rem), color-mix(in srgb, var(--theme-bg) 58%, white);
}

.history-list[b-n9712e0trl] {
    display: flex;
    margin-top: 13px;
    flex-direction: column;
    gap: 9px;
}

.history-list article[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    border: 1px solid rgba(7,88,67,.08);
    border-radius: 13px;
    background: #fff;
}

.history-list article > span[b-n9712e0trl] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: color-mix(in srgb, var(--theme-accent) 52%, white);
    background: linear-gradient(145deg,var(--theme-primary),var(--theme-dark));
}

.history-list article > div > div:first-child[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.history-list strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
}

.history-list small[b-n9712e0trl] {
    color: #8b9993;
    font-size: .46rem;
}

.history-list p[b-n9712e0trl] {
    margin: 5px 0 0;
    color: #657870;
    font-size: .54rem;
    line-height: 1.6;
}

.history-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
}

.history-meta em[b-n9712e0trl],
.history-meta b[b-n9712e0trl] {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .42rem;
    font-style: normal;
}

.history-meta em[b-n9712e0trl] {
    color: #587269;
    background: #edf3f0;
}

.history-meta b[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.four-columns[b-n9712e0trl] {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}

.attachment-card.result[b-n9712e0trl] {
    border-color: rgba(8,112,84,.22);
}

.attachment-card.result span[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.attachment-card.work span[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

@media (max-width: 1200px) {
    .shelter-capacity-banner[b-n9712e0trl],
    .four-columns[b-n9712e0trl] {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .source-picker-list[b-n9712e0trl] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 800px) {
    .shelter-capacity-banner[b-n9712e0trl],
    .detail-note-grid[b-n9712e0trl],
    .four-columns[b-n9712e0trl] {
        grid-template-columns: minmax(0,1fr) !important;
    }

    .view-progress-footer[b-n9712e0trl] {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-source-panel[b-n9712e0trl] {
        grid-template-columns: minmax(0,1fr);
    }

    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 620px) {
    .source-picker-toolbar[b-n9712e0trl],
    .source-picker-card[b-n9712e0trl],
    .selected-info-grid[b-n9712e0trl] {
        grid-template-columns: minmax(0,1fr);
    }

    .picker-photo[b-n9712e0trl] {
        height: 180px;
    }
}


/* =========================================================
   PUBLIC ASSET REGISTRY PREMIUM
   ========================================================= */

.summary-card.total[b-n9712e0trl] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.value[b-n9712e0trl] {
    --summary-accent: #9c7932;
    --summary-soft: #f8efdc;
    --summary-border: rgba(156, 121, 50, .20);
}

.summary-card.maintenance[b-n9712e0trl] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.summary-card.inspection[b-n9712e0trl] {
    --summary-accent: #2d78a4;
    --summary-soft: #e3f1fa;
    --summary-border: rgba(45, 120, 164, .20);
}

.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.maintenance > span[b-n9712e0trl] {
    background: #bd4f43;
}

.status-overview-card.inspection > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.poor > span[b-n9712e0trl] {
    background: #ad721a;
}

.status-overview-card.disposed > span[b-n9712e0trl] {
    background: #6d7b75;
}

.asset-code-photo-cell[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 145px;
    align-items: center;
    gap: 8px;
}

.asset-photo-mini[b-n9712e0trl] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eef5f1;
}

.asset-photo-mini button[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.asset-photo-mini img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-code-photo-cell > div:last-child[b-n9712e0trl] {
    min-width: 0;
}

.asset-code-photo-cell strong[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .51rem;
    font-weight: 750;
    white-space: nowrap;
}

.asset-code-photo-cell small[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .44rem;
}

.asset-name-cell[b-n9712e0trl],
.asset-location-cell[b-n9712e0trl],
.department-cell[b-n9712e0trl],
.status-condition-cell[b-n9712e0trl],
.value-cell[b-n9712e0trl],
.inspection-cell[b-n9712e0trl] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.asset-name-cell strong[b-n9712e0trl],
.asset-location-cell strong[b-n9712e0trl],
.department-cell strong[b-n9712e0trl],
.value-cell strong[b-n9712e0trl],
.inspection-cell strong[b-n9712e0trl] {
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .56rem;
    line-height: 1.48;
}

.asset-name-cell small[b-n9712e0trl],
.asset-location-cell small[b-n9712e0trl],
.department-cell small[b-n9712e0trl],
.value-cell small[b-n9712e0trl],
.inspection-cell small[b-n9712e0trl] {
    margin-top: 3px;

    color: #85948e;
    font-size: .45rem;
    line-height: 1.5;
}

.asset-name-cell em[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #7658a7;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.asset-location-cell[b-n9712e0trl] {
    gap: 4px;
}

.asset-location-cell .category-chip[b-n9712e0trl] {
    width: fit-content;
}

.status-condition-cell[b-n9712e0trl] {
    align-items: flex-start;
    gap: 5px;
}

.value-cell strong[b-n9712e0trl] {
    color: #9c7932;
    font-size: .62rem;
}

.inspection-cell.overdue strong[b-n9712e0trl],
.inspection-cell.overdue small[b-n9712e0trl] {
    color: #b3463d;
}

.condition-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .42rem;
    font-weight: 700;
}

.condition-chip.excellent[b-n9712e0trl] {
    color: var(--theme-primary);
    background: #e2f5ec;
}

.condition-chip.good[b-n9712e0trl] {
    color: #2d78a4;
    background: #e6f2f9;
}

.condition-chip.fair[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.condition-chip.repair[b-n9712e0trl] {
    color: #b15d24;
    background: #fff0df;
}

.condition-chip.damaged[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.active[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.in-maintenance[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.status-chip.reserved[b-n9712e0trl] {
    color: #8c681d;
    background: #fff2d8;
}

.status-chip.disposed[b-n9712e0trl] {
    color: #66756f;
    background: #edf1ef;
}

.status-chip.lost[b-n9712e0trl] {
    color: #823f6a;
    background: #f6eaf2;
}

.coordinate-preview[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    gap: 10px;
    align-items: center;

    margin: 5px 0 15px;
    padding: 10px 12px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .09),
            transparent 16rem),
        #f5fafc;
}

.coordinate-preview > span[b-n9712e0trl] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-preview > div[b-n9712e0trl] {
    display: flex;
    flex-direction: column;
}

.coordinate-preview small[b-n9712e0trl] {
    color: #7d8e87;
    font-size: .43rem;
}

.coordinate-preview strong[b-n9712e0trl] {
    margin-top: 3px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .54rem;
}

.coordinate-preview a[b-n9712e0trl] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 9px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-value-preview[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin: 6px 0 15px;
}

.asset-value-preview > div[b-n9712e0trl] {
    display: flex;
    min-height: 66px;

    justify-content: center;
    flex-direction: column;

    padding: 10px 12px;

    border: 1px solid rgba(156, 121, 50, .15);
    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            #fffaf1,
            #fff);
}

.asset-value-preview span[b-n9712e0trl] {
    color: #8c988f;
    font-size: .44rem;
}

.asset-value-preview strong[b-n9712e0trl] {
    margin-top: 4px;

    color: #9c7932;
    font-size: .68rem;
}

.shelter-photo-upload-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.shelter-capacity-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        70px
        minmax(130px, .8fr)
        minmax(100px, .6fr)
        minmax(160px, 1fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 16px;

    background: rgba(7, 88, 67, .09);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.shelter-capacity-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .asset-banner-icon[b-n9712e0trl] {
    color: #f1d898;
    background:
        linear-gradient(
            145deg,
            var(--theme-primary),
            var(--theme-dark));
}

.asset-banner-icon .mud-icon-root[b-n9712e0trl] {
    font-size: 1.7rem;
}

.shelter-capacity-banner small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .44rem;
}

.shelter-capacity-banner strong[b-n9712e0trl] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .59rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-overview-panel[b-n9712e0trl] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-overview-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inspection-overview-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.inspection-overview-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .74rem;
}

.inspection-badge[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.inspection-badge.normal[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.inspection-badge.due[b-n9712e0trl] {
    color: #94651b;
    background: #fff1d7;
}

.inspection-badge.overdue[b-n9712e0trl] {
    color: #aa453e;
    background: #fff0ef;
}

.inspection-badge.no-date[b-n9712e0trl] {
    color: #66756f;
    background: #edf1ef;
}

.inspection-date-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.inspection-date-grid > div[b-n9712e0trl] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(7, 88, 67, .07);
    border-radius: 10px;

    background: #fff;
}

.inspection-date-grid span[b-n9712e0trl] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.inspection-date-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .52rem;
}

.view-toolbar-actions[b-n9712e0trl] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.view-map-button[b-n9712e0trl] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .20);
    border-radius: 10px;

    color: #2d78a4;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 650;
    text-decoration: none;
}

.emergency-shelter-page[b-n9712e0trl]  .view-edit-button {
    border-radius: 10px !important;

    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #0d7658,
            #04503d) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .47rem !important;
    font-weight: 650 !important;
}

.asset-location-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.asset-location-panel > span[b-n9712e0trl] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.asset-location-panel small[b-n9712e0trl] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.asset-location-panel h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.asset-location-panel p[b-n9712e0trl] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .52rem;
    line-height: 1.55;
}

.asset-location-panel p em[b-n9712e0trl] {
    font-style: normal;
}

.asset-location-panel a[b-n9712e0trl] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.asset-detail-note-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.asset-detail-note-grid > div[b-n9712e0trl] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.asset-detail-note-grid small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
}

.asset-detail-note-grid p[b-n9712e0trl] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .55rem;
    line-height: 1.75;
}

.history-list article > div > em[b-n9712e0trl] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #587269;
    background: #edf3f0;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-n9712e0trl] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.secondary span[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document span[b-n9712e0trl] {
    color: #9c7932;
    background: #f8efdc;
}

@media (max-width: 1200px) {
    .shelter-photo-upload-grid[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner > div:nth-child(4)[b-n9712e0trl],
    .shelter-capacity-banner > div:nth-child(5)[b-n9712e0trl] {
        grid-column: auto;
    }

    .inspection-date-grid[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-photo-upload-grid[b-n9712e0trl],
    .asset-value-preview[b-n9712e0trl],
    .asset-detail-note-grid[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .asset-banner-icon[b-n9712e0trl] {
        grid-column: 1 / -1;
    }

    .inspection-date-grid[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .asset-location-panel[b-n9712e0trl] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .asset-location-panel a[b-n9712e0trl] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-n9712e0trl] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-n9712e0trl] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-n9712e0trl] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-n9712e0trl],
    .emergency-shelter-page[b-n9712e0trl]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY CENTER PREMIUM
   ========================================================= */

.emergency-shelter-page[b-n9712e0trl] {
    --emergency-red: #b83f35;
    --emergency-deep: #651e1a;
    --emergency-soft: #fff1ef;
    --command-navy: #263b4a;
}

.shelter-hero[b-n9712e0trl] {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255, 177, 144, .18),
            transparent 23rem),
        radial-gradient(
            circle at 16% 80%,
            rgba(201, 166, 93, .13),
            transparent 19rem),
        linear-gradient(
            135deg,
            #6f211c 0%,
            #421411 54%,
            #24100f 100%) !important;
}

.hero-alert-line[b-n9712e0trl] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffb28e 18%,
            #f6db9f 50%,
            #ffb28e 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(255, 153, 112, .55);
}

.emergency-online .status-dot[b-n9712e0trl] {
    background: #ffb28e !important;

    box-shadow:
        0 0 0 5px rgba(255, 178, 142, .15),
        0 0 14px rgba(255, 178, 142, .78) !important;
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button,
.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #d95e46,
            #a72f29) !important;

    box-shadow:
        0 11px 24px rgba(119, 31, 25, .28) !important;
}

.summary-card.critical[b-n9712e0trl] {
    --summary-accent: #bd3e35;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 62, 53, .20);
}

.summary-card.active[b-n9712e0trl] {
    --summary-accent: #8b529f;
    --summary-soft: #f3eafb;
    --summary-border: rgba(139, 82, 159, .20);
}

.summary-card.sla[b-n9712e0trl] {
    --summary-accent: #c27a22;
    --summary-soft: #fff3df;
    --summary-border: rgba(194, 122, 34, .20);
}

.summary-card.resolved[b-n9712e0trl] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.new > span[b-n9712e0trl] {
    background: #bd3e35;
}

.status-overview-card.dispatched > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.active > span[b-n9712e0trl] {
    background: #8b529f;
}

.status-overview-card.over-sla > span[b-n9712e0trl] {
    background: #c27a22;
}

.status-overview-card.resolved > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.incident-code-photo-cell[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 152px;
    align-items: center;
    gap: 8px;
}

.incident-photo-mini[b-n9712e0trl] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(184, 63, 53, .12);
    border-radius: 12px;

    color: #b83f35;
    background: #fff2f0;
}

.incident-photo-mini button[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.incident-photo-mini img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.incident-code-photo-cell > div:last-child[b-n9712e0trl] {
    min-width: 0;
}

.incident-code-photo-cell strong[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(184, 63, 53, .14);
    border-radius: 8px;

    color: #a3362f;
    background: #fff3f1;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.incident-code-photo-cell small[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .43rem;
}

.incident-subject-cell[b-n9712e0trl],
.priority-status-cell[b-n9712e0trl],
.response-unit-cell[b-n9712e0trl],
.sla-cell[b-n9712e0trl],
.responder-cell[b-n9712e0trl],
.latest-update-cell[b-n9712e0trl] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.incident-subject-cell[b-n9712e0trl] {
    gap: 4px;
}

.incident-subject-cell strong[b-n9712e0trl],
.response-unit-cell strong[b-n9712e0trl],
.sla-cell strong[b-n9712e0trl],
.responder-cell strong[b-n9712e0trl],
.latest-update-cell strong[b-n9712e0trl] {
    color: #3f4e49;
    font-size: .56rem;
    line-height: 1.48;
}

.incident-subject-cell small[b-n9712e0trl],
.response-unit-cell small[b-n9712e0trl],
.sla-cell small[b-n9712e0trl],
.responder-cell small[b-n9712e0trl],
.latest-update-cell small[b-n9712e0trl] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.response-unit-cell em[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d78a4;
    background: #e8f3f9;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.priority-status-cell[b-n9712e0trl] {
    align-items: flex-start;
    gap: 5px;
}

.sla-cell.overdue strong[b-n9712e0trl],
.sla-cell.overdue small[b-n9712e0trl] {
    color: #b13e36;
}

.latest-update-cell small[b-n9712e0trl] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.type-chip[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5b625e;
    background: #edf1ef;

    font-size: .41rem;
    font-weight: 700;
}

.type-chip.fire[b-n9712e0trl] {
    color: #ad382f;
    background: #fff0ee;
}

.type-chip.flood[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.type-chip.accident[b-n9712e0trl] {
    color: #a46622;
    background: #fff1dc;
}

.type-chip.medical[b-n9712e0trl] {
    color: #a93e5b;
    background: #fceaf0;
}

.type-chip.power[b-n9712e0trl] {
    color: #9a741f;
    background: #fff5d8;
}

.type-chip.tree[b-n9712e0trl] {
    color: #367849;
    background: #e8f5ec;
}

.type-chip.animal[b-n9712e0trl] {
    color: #746140;
    background: #f3ecdf;
}

.type-chip.security[b-n9712e0trl] {
    color: #655496;
    background: #eee9fa;
}

.type-chip.chemical[b-n9712e0trl] {
    color: #75498b;
    background: #f4eafa;
}

.type-chip.building[b-n9712e0trl] {
    color: #815f43;
    background: #f2e9df;
}

.priority-chip.critical[b-n9712e0trl] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d65043,
            #9f2e29);

    box-shadow:
        0 5px 13px rgba(159, 46, 41, .18);
}

.priority-chip.urgent[b-n9712e0trl] {
    color: #a33c32;
    background: #ffe4df;
}

.priority-chip.high[b-n9712e0trl] {
    color: #a46622;
    background: #fff0d8;
}

.priority-chip.normal[b-n9712e0trl] {
    color: #39745a;
    background: #e7f5ee;
}

.status-chip.new[b-n9712e0trl] {
    color: #ad382f;
    background: #fff0ee;
}

.status-chip.dispatched[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.on-scene[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.in-progress[b-n9712e0trl] {
    color: #7d4c96;
    background: #f3e9fa;
}

.status-chip.resolved[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.closed[b-n9712e0trl] {
    color: #3d6657;
    background: #e9f1ed;
}

.status-chip.cancelled[b-n9712e0trl] {
    color: #697770;
    background: #edf1ef;
}

.anonymous-switch-card[b-n9712e0trl] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 12px;

    background: #fff8f7;
}

.shelter-photo-upload-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 11px;
}

.privacy-note[b-n9712e0trl] {
    margin-top: 12px;
}

.shelter-capacity-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        70px
        minmax(160px, 1fr)
        minmax(150px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .7fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 16px;

    background: rgba(184, 63, 53, .10);

    box-shadow:
        0 12px 30px rgba(88, 31, 26, .07);
}

.shelter-capacity-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 182, 148, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .command-icon[b-n9712e0trl] {
    color: #ffd5c3;
    background:
        linear-gradient(
            145deg,
            #8c2b25,
            #4c1714);
}

.command-icon .mud-icon-root[b-n9712e0trl] {
    font-size: 1.7rem;
}

.shelter-capacity-banner small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.shelter-capacity-banner strong[b-n9712e0trl] {
    margin-top: 4px;

    color: #3f4e49;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.response-timeline-overview[b-n9712e0trl] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(184, 63, 53, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 177, 144, .09),
            transparent 18rem),
        #fbf9f8;
}

.response-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.response-heading small[b-n9712e0trl] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.response-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #3f4e49;
    font-size: .74rem;
}

.response-badge[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.response-badge.normal[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.response-badge.overdue[b-n9712e0trl] {
    color: #ad382f;
    background: #fff0ee;
}

.response-time-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.response-time-grid > div[b-n9712e0trl] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(184, 63, 53, .07);
    border-radius: 10px;

    background: #fff;
}

.response-time-grid span[b-n9712e0trl] {
    display: block;

    color: var(--theme-muted);
    font-size: .41rem;
}

.response-time-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: #3f4e49;
    font-size: .51rem;
}

.shelter-location-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.shelter-location-panel > span[b-n9712e0trl] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.shelter-location-panel small[b-n9712e0trl] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.shelter-location-panel h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.shelter-location-panel p[b-n9712e0trl] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.shelter-location-panel p em[b-n9712e0trl] {
    font-style: normal;
}

.shelter-location-panel b[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.shelter-location-panel a[b-n9712e0trl] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.shelter-detail-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.shelter-detail-grid > div[b-n9712e0trl] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.shelter-detail-grid .danger-note[b-n9712e0trl] {
    border-color: rgba(184, 63, 53, .13);
    background: #fff7f5;
}

.shelter-detail-grid .risk-note[b-n9712e0trl] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.shelter-detail-grid small[b-n9712e0trl] {
    color: #a06137;
    font-size: .45rem;
    font-weight: 700;
}

.shelter-detail-grid p[b-n9712e0trl] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-n9712e0trl] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6b5148;
    background: #f4ece8;

    font-size: .41rem;
    font-style: normal;
}

.three-columns[b-n9712e0trl] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-n9712e0trl] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1200px) {
    .shelter-photo-upload-grid[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .response-time-grid[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .shelter-photo-upload-grid[b-n9712e0trl],
    .shelter-detail-grid[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .command-icon[b-n9712e0trl] {
        grid-column: 1 / -1;
    }

    .response-time-grid[b-n9712e0trl],
    .three-columns[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-location-panel[b-n9712e0trl] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .shelter-location-panel a[b-n9712e0trl] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .view-toolbar-actions[b-n9712e0trl] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-n9712e0trl],
    .emergency-shelter-page[b-n9712e0trl]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY DISPATCH & TEAM ASSIGNMENT PREMIUM
   ========================================================= */

.emergency-shelter-page[b-n9712e0trl] {
    --dispatch-purple: #6e4d91;
    --dispatch-deep: #352441;
    --dispatch-soft: #f4effa;
    --dispatch-gold: #c99f52;
}

.shelter-hero[b-n9712e0trl] {
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(200, 166, 238, .20),
            transparent 24rem),
        radial-gradient(
            circle at 14% 80%,
            rgba(201, 166, 93, .14),
            transparent 19rem),
        linear-gradient(
            135deg,
            #49325e 0%,
            #30213e 54%,
            #1e1527 100%) !important;
}

.hero-command-line[b-n9712e0trl] {
    position: absolute;
    inset: 0 0 auto;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c9a6ee 18%,
            #f2d69e 50%,
            #c9a6ee 82%,
            transparent);

    box-shadow:
        0 0 18px rgba(184, 139, 226, .50);
}

.dispatch-online .status-dot[b-n9712e0trl] {
    background: #cba8ec !important;

    box-shadow:
        0 0 0 5px rgba(203, 168, 236, .15),
        0 0 14px rgba(203, 168, 236, .78) !important;
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button,
.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button {
    color: #fff !important;
    background:
        linear-gradient(
            145deg,
            #845baa,
            #594075) !important;

    box-shadow:
        0 11px 24px rgba(64, 42, 84, .28) !important;
}

.summary-card.pending[b-n9712e0trl] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.moving[b-n9712e0trl] {
    --summary-accent: #2d78a4;
    --summary-soft: #e6f2f9;
    --summary-border: rgba(45, 120, 164, .20);
}

.summary-card.scene[b-n9712e0trl] {
    --summary-accent: var(--theme-primary);
    --summary-soft: color-mix(in srgb, var(--theme-light) 15%, white);
    --summary-border: rgba(8, 116, 90, .20);
}

.summary-card.eta[b-n9712e0trl] {
    --summary-accent: #bd4f43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(189, 79, 67, .20);
}

.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-n9712e0trl] {
    grid-template-columns:
        repeat(7, minmax(0, 1fr)) !important;
}

.status-overview-card.draft > span[b-n9712e0trl] {
    background: #7658a7;
}

.status-overview-card.dispatched > span[b-n9712e0trl] {
    background: #2d78a4;
}

.status-overview-card.accepted > span[b-n9712e0trl] {
    background: var(--theme-primary);
}

.status-overview-card.en-route > span[b-n9712e0trl] {
    background: #557d9c;
}

.status-overview-card.on-scene > span[b-n9712e0trl] {
    background: #8b529f;
}

.status-overview-card.completed > span[b-n9712e0trl] {
    background: #3f8650;
}

.dispatch-code-photo-cell[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.dispatch-photo-mini[b-n9712e0trl] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 12px;

    color: #6e4d91;
    background: #f4effa;
}

.dispatch-photo-mini button[b-n9712e0trl] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.dispatch-photo-mini img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-code-photo-cell > div:last-child[b-n9712e0trl] {
    min-width: 0;
}

.dispatch-code-photo-cell strong[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(110, 77, 145, .14);
    border-radius: 8px;

    color: #68498a;
    background: #f7f2fb;

    font-size: .50rem;
    font-weight: 760;
    white-space: nowrap;
}

.dispatch-code-photo-cell small[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: #9c7932;
    font-size: .43rem;
    font-weight: 650;
}

.source-incident-cell[b-n9712e0trl],
.team-cell[b-n9712e0trl],
.assignment-status-cell[b-n9712e0trl],
.vehicle-cell[b-n9712e0trl],
.responder-cell[b-n9712e0trl],
.latest-update-cell[b-n9712e0trl] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.source-incident-cell[b-n9712e0trl] {
    min-width: 190px;
}

.source-incident-cell > div[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.source-incident-cell strong[b-n9712e0trl],
.team-cell strong[b-n9712e0trl],
.vehicle-cell strong[b-n9712e0trl],
.responder-cell strong[b-n9712e0trl],
.latest-update-cell strong[b-n9712e0trl] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.48;
}

.source-incident-cell small[b-n9712e0trl],
.team-cell small[b-n9712e0trl],
.vehicle-cell small[b-n9712e0trl],
.responder-cell small[b-n9712e0trl],
.latest-update-cell small[b-n9712e0trl] {
    margin-top: 3px;

    color: #84928d;
    font-size: .44rem;
    line-height: 1.5;
}

.team-cell em[b-n9712e0trl] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #6e4d91;
    background: #f0eafb;

    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

.assignment-status-cell[b-n9712e0trl] {
    align-items: flex-start;
    gap: 5px;
}

.assignment-status-cell small[b-n9712e0trl] {
    color: #687a73;
    font-size: .43rem;
    font-weight: 650;
}

.assignment-status-cell small.eta-overdue[b-n9712e0trl] {
    color: #b13e36;
}

.latest-update-cell small[b-n9712e0trl] {
    display: -webkit-box;
    max-width: 190px;
    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.status-chip.draft[b-n9712e0trl] {
    color: #6e4d91;
    background: #f0eafb;
}

.status-chip.dispatched[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.status-chip.accepted[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.en-route[b-n9712e0trl] {
    color: #476f8e;
    background: #eaf2f7;
}

.status-chip.on-scene[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.status-chip.completed[b-n9712e0trl] {
    color: #347849;
    background: #e7f5ec;
}

.status-chip.cancelled[b-n9712e0trl] {
    color: #697770;
    background: #edf1ef;
}

.incident-status-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #4b655c;
    background: #edf3f0;

    font-size: .42rem;
    font-weight: 700;
}

.incident-status-chip.new[b-n9712e0trl] {
    color: #ad382f;
    background: #fff0ee;
}

.incident-status-chip.dispatched[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.incident-status-chip.on-scene[b-n9712e0trl],
.incident-status-chip.in-progress[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.dispatch-picker[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.dispatch-source-card[b-n9712e0trl] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(110, 77, 145, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(63, 42, 82, .06);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.dispatch-source-card:hover[b-n9712e0trl] {
    transform: translateY(-2px);

    border-color: rgba(110, 77, 145, .30);

    box-shadow:
        0 15px 31px rgba(63, 42, 82, .12);
}

.dispatch-source-card.selected[b-n9712e0trl] {
    border: 2px solid #7658a7;

    box-shadow:
        0 0 0 4px rgba(118, 88, 167, .09),
        0 16px 34px rgba(63, 42, 82, .14);
}

.dispatch-picker-cover[b-n9712e0trl] {
    position: relative;

    display: grid;
    height: 125px;
    overflow: hidden;

    place-items: center;

    color: #7658a7;
    background:
        radial-gradient(
            circle,
            rgba(118, 88, 167, .13),
            transparent 58%),
        #f2eef7;
}

.dispatch-picker-cover img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dispatch-picker-cover > span .mud-icon-root[b-n9712e0trl] {
    font-size: 2rem;
}

.priority-badge[b-n9712e0trl] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(75, 84, 79, .84);

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.priority-badge.critical[b-n9712e0trl] {
    background: rgba(183, 57, 48, .92);
}

.priority-badge.urgent[b-n9712e0trl] {
    background: rgba(190, 101, 31, .92);
}

.priority-badge.high[b-n9712e0trl] {
    background: rgba(166, 111, 35, .92);
}

.priority-badge.normal[b-n9712e0trl] {
    background: rgba(48, 112, 81, .90);
}

.dispatch-picker-content[b-n9712e0trl] {
    padding: 10px;
}

.dispatch-picker-content > small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
}

.dispatch-picker-content > strong[b-n9712e0trl] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > p[b-n9712e0trl] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-picker-content > div[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.received-chip[b-n9712e0trl] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #476f8e;
    background: #eaf2f7;

    font-family: 'Kanit', sans-serif;
    font-size: .39rem;
    font-weight: 650;
}

.source-empty-alert[b-n9712e0trl] {
    margin-bottom: 16px;
}

.locked-dispatch-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .11),
            transparent 20rem),
        #faf8fc;
}

.locked-dispatch-cover[b-n9712e0trl] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #7658a7;
    background: #eee8f4;
}

.locked-dispatch-cover img[b-n9712e0trl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-dispatch-cover .mud-icon-root[b-n9712e0trl] {
    font-size: 2.4rem;
}

.locked-dispatch-content[b-n9712e0trl] {
    min-width: 0;
}

.locked-dispatch-heading[b-n9712e0trl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-dispatch-heading small[b-n9712e0trl] {
    color: #9c7932;
    font-size: .46rem;
    font-weight: 700;
    letter-spacing: .05em;
}

.locked-dispatch-heading h3[b-n9712e0trl] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .83rem;
}

.locked-dispatch-heading p[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #7658a7;
    font-size: .50rem;
    font-weight: 700;
}

.locked-incident-badges[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-description[b-n9712e0trl] {
    margin: 10px 0 0;

    color: var(--theme-muted);
    font-size: .55rem;
    line-height: 1.72;
}

.locked-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-grid > div[b-n9712e0trl] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(110, 77, 145, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-grid span[b-n9712e0trl] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-risk-note[b-n9712e0trl] {
    display: flex;
    min-height: 38px;

    align-items: center;
    gap: 7px;

    margin-top: 9px;
    padding: 8px 10px;

    border: 1px solid rgba(194, 122, 34, .16);
    border-radius: 10px;

    color: #8f621d;
    background: #fff9ed;

    font-size: .46rem;
}

.source-panel-actions[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-n9712e0trl],
.source-panel-actions button[b-n9712e0trl] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(110, 77, 145, .16);
    border-radius: 9px;

    color: #68498a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.source-link-note[b-n9712e0trl] {
    margin-top: 12px;
}

.shelter-photo-upload-grid[b-n9712e0trl] {
    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;
}

.shelter-capacity-banner[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        70px
        minmax(150px, 1fr)
        minmax(140px, .9fr)
        minmax(90px, .55fr)
        minmax(120px, .75fr);

    gap: 1px;
    margin-top: 15px;
    overflow: hidden;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 16px;

    background: rgba(110, 77, 145, .10);

    box-shadow:
        0 12px 30px rgba(63, 42, 82, .07);
}

.shelter-capacity-banner > div[b-n9712e0trl] {
    display: flex;
    min-height: 102px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(201, 166, 93, .08),
            transparent 12rem),
        #fff;
}

.shelter-capacity-banner .command-banner-icon[b-n9712e0trl] {
    color: #e5d5ff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3d2c51);
}

.command-banner-icon .mud-icon-root[b-n9712e0trl] {
    font-size: 1.75rem;
}

.shelter-capacity-banner small[b-n9712e0trl] {
    color: var(--theme-muted);
    font-size: .43rem;
}

.shelter-capacity-banner strong[b-n9712e0trl] {
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .57rem;
    line-height: 1.45;
    text-align: center;
}

.source-incident-detail[b-n9712e0trl] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(110, 77, 145, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .11),
            transparent 18rem),
        #f9f6fc;
}

.source-detail-icon[b-n9712e0trl] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #7658a7,
            #3f2d54);

    box-shadow:
        0 10px 22px rgba(63, 42, 82, .20);
}

.source-incident-detail small[b-n9712e0trl] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-incident-detail h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-incident-detail p[b-n9712e0trl] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-n9712e0trl] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-n9712e0trl] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.shelter-location-panel[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 164, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 164, .10),
            transparent 18rem),
        #f5fafc;
}

.shelter-location-panel > span[b-n9712e0trl] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.shelter-location-panel small[b-n9712e0trl] {
    color: #2d78a4;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.shelter-location-panel h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.shelter-location-panel p[b-n9712e0trl] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.55;
}

.shelter-location-panel p em[b-n9712e0trl] {
    font-style: normal;
}

.shelter-location-panel b[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: #2d78a4;
    font-size: .43rem;
}

.shelter-location-panel a[b-n9712e0trl] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 164, .18);
    border-radius: 10px;

    color: #2d78a4;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.resource-time-panel[b-n9712e0trl] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(110, 77, 145, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(118, 88, 167, .09),
            transparent 18rem),
        #faf8fc;
}

.dispatch-time-heading[b-n9712e0trl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dispatch-time-heading small[b-n9712e0trl] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.dispatch-time-heading h3[b-n9712e0trl] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .73rem;
}

.eta-badge[b-n9712e0trl] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.eta-badge.normal[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.eta-badge.overdue[b-n9712e0trl] {
    color: #ad382f;
    background: #fff0ee;
}

.eta-badge.arrived[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.resource-time-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.resource-time-grid > div[b-n9712e0trl] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(110, 77, 145, .07);
    border-radius: 10px;

    background: #fff;
}

.resource-time-grid span[b-n9712e0trl] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.resource-time-grid strong[b-n9712e0trl] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.shelter-detail-grid[b-n9712e0trl] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.shelter-detail-grid > div[b-n9712e0trl] {
    min-height: 112px;
    padding: 13px;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.shelter-detail-grid .command-note[b-n9712e0trl] {
    border-color: rgba(110, 77, 145, .14);
    background: #faf7fc;
}

.shelter-detail-grid .safety-note[b-n9712e0trl] {
    border-color: rgba(194, 122, 34, .16);
    background: #fffaf0;
}

.shelter-detail-grid small[b-n9712e0trl] {
    color: #7658a7;
    font-size: .45rem;
    font-weight: 700;
}

.shelter-detail-grid p[b-n9712e0trl] {
    margin: 7px 0 0;

    color: #60756d;
    font-size: .54rem;
    line-height: 1.75;
}

.history-list article > div > em[b-n9712e0trl] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #604d70;
    background: #f0eaf5;

    font-size: .41rem;
    font-style: normal;
}

.four-columns[b-n9712e0trl] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.source span[b-n9712e0trl] {
    color: #a06137;
    background: #fff1e8;
}

.attachment-card.scene span[b-n9712e0trl] {
    color: #2d78a4;
    background: #e8f3f9;
}

.attachment-card.assignment span[b-n9712e0trl] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.result span[b-n9712e0trl] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

@media (max-width: 1380px) {
    .status-overview[b-n9712e0trl] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-n9712e0trl],
    .four-columns[b-n9712e0trl] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-dispatch-panel[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-dispatch-cover[b-n9712e0trl] {
        max-height: 310px;
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            70px
            repeat(2, minmax(0, 1fr));
    }

    .locked-grid[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .resource-time-grid[b-n9712e0trl],
    .four-columns[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 800px) {
    .status-overview[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .dispatch-picker[b-n9712e0trl],
    .shelter-photo-upload-grid[b-n9712e0trl],
    .shelter-detail-grid[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .shelter-capacity-banner .command-banner-icon[b-n9712e0trl] {
        grid-column: 1 / -1;
    }

    .resource-time-grid[b-n9712e0trl],
    .four-columns[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .shelter-location-panel[b-n9712e0trl] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .shelter-location-panel a[b-n9712e0trl] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-n9712e0trl],
    .locked-grid[b-n9712e0trl],
    .shelter-capacity-banner[b-n9712e0trl] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-dispatch-heading[b-n9712e0trl] {
        flex-direction: column;
    }

    .locked-incident-badges[b-n9712e0trl] {
        justify-content: flex-start;
    }

    .view-toolbar-actions[b-n9712e0trl] {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .view-map-button[b-n9712e0trl],
    .emergency-shelter-page[b-n9712e0trl]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   EMERGENCY PERSONNEL & EQUIPMENT PREMIUM
   ========================================================= */

.emergency-shelter-page[b-n9712e0trl] {
    --resource-green: var(--theme-primary);
    --resource-deep: #163f35;
    --resource-soft: #edf7f3;
    --resource-gold: #c49a4c;
}

.shelter-hero[b-n9712e0trl] {
    background:
        radial-gradient(circle at 88% 18%, rgba(130, 218, 183, .18), transparent 24rem),
        radial-gradient(circle at 14% 80%, rgba(201, 166, 93, .14), transparent 19rem),
        linear-gradient(135deg, #145b49 0%, #0a3e32 54%, #08271f 100%) !important;
}

.hero-accent-line[b-n9712e0trl] {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, transparent, #8fd9b8 18%, #f2d69e 50%, #8fd9b8 82%, transparent);
    box-shadow: 0 0 18px rgba(99, 205, 159, .46);
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button,
.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button {
    color: #fff !important;
    background: linear-gradient(145deg, #15936e, #0a684f) !important;
    box-shadow: 0 11px 24px rgba(8, 91, 68, .28) !important;
}

.summary-card.personnel[b-n9712e0trl] { --summary-accent:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); --summary-border:rgba(11,116,88,.20); }
.summary-card.equipment[b-n9712e0trl] { --summary-accent:#2d78a4; --summary-soft:#e6f2f9; --summary-border:rgba(45,120,164,.20); }
.summary-card.readiness[b-n9712e0trl] { --summary-accent:#805fa8; --summary-soft:#f0eafb; --summary-border:rgba(128,95,168,.20); }
.summary-card.warning[b-n9712e0trl] { --summary-accent:#bd4f43; --summary-soft:#fff0ee; --summary-border:rgba(189,79,67,.20); }
.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root { color:var(--summary-accent) !important; }

.status-overview[b-n9712e0trl] { grid-template-columns:repeat(6,minmax(0,1fr)) !important; }
.status-overview-card.checking > span[b-n9712e0trl] { background:#2d78a4; }
.status-overview-card.ready > span[b-n9712e0trl] { background:var(--theme-primary); }
.status-overview-card.mission > span[b-n9712e0trl] { background:#7658a7; }
.status-overview-card.returned > span[b-n9712e0trl] { background:#4e725f; }
.status-overview-card.not-ready > span[b-n9712e0trl] { background:#bd4f43; }

.resource-code-photo-cell[b-n9712e0trl] { display:grid; grid-template-columns:50px minmax(0,1fr); min-width:155px; align-items:center; gap:8px; }
.resource-photo-mini[b-n9712e0trl] { display:grid; width:50px; height:50px; overflow:hidden; place-items:center; border:1px solid rgba(11,116,88,.13); border-radius:12px; color:var(--theme-primary); background:#edf7f3; }
.resource-photo-mini button[b-n9712e0trl] { width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.resource-photo-mini img[b-n9712e0trl] { width:100%; height:100%; object-fit:cover; }
.resource-code-photo-cell strong[b-n9712e0trl] { display:inline-flex; min-height:28px; align-items:center; padding:0 8px; border:1px solid rgba(11,116,88,.14); border-radius:8px; color:#0a684f; background:#eff8f4; font-size:.50rem; font-weight:760; white-space:nowrap; }
.resource-code-photo-cell small[b-n9712e0trl] { display:block; margin-top:4px; color:#9c7932; font-size:.43rem; font-weight:650; }

.source-cell[b-n9712e0trl],.team-cell[b-n9712e0trl],.equipment-cell[b-n9712e0trl],.readiness-cell[b-n9712e0trl],.fuel-return-cell[b-n9712e0trl],.latest-cell[b-n9712e0trl] { display:flex; min-width:132px; flex-direction:column; }
.source-cell[b-n9712e0trl] { min-width:190px; }
.source-cell>div[b-n9712e0trl] { display:flex; flex-wrap:wrap; gap:4px; }
.source-cell strong[b-n9712e0trl],.team-cell strong[b-n9712e0trl],.equipment-cell strong[b-n9712e0trl],.fuel-return-cell strong[b-n9712e0trl],.latest-cell strong[b-n9712e0trl] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.55rem; line-height:1.48; }
.source-cell small[b-n9712e0trl],.team-cell small[b-n9712e0trl],.equipment-cell small[b-n9712e0trl],.latest-cell small[b-n9712e0trl],.fuel-return-cell small[b-n9712e0trl] { margin-top:3px; color:#84928d; font-size:.44rem; line-height:1.5; }
.team-cell em[b-n9712e0trl],.equipment-cell em[b-n9712e0trl] { display:-webkit-box; margin-top:5px; overflow:hidden; color:var(--theme-primary); font-size:.40rem; font-style:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.readiness-cell[b-n9712e0trl] { align-items:flex-start; gap:5px; }
.latest-cell small[b-n9712e0trl] { display:-webkit-box; max-width:190px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }

.readiness-chip[b-n9712e0trl] { display:inline-flex; min-height:24px; align-items:center; padding:0 8px; border-radius:999px; font-size:.42rem; font-weight:700; }
.readiness-chip.ready[b-n9712e0trl] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.readiness-chip.partial[b-n9712e0trl] { color:#94651b; background:#fff1d7; }
.readiness-chip.not-ready[b-n9712e0trl] { color:#aa453e; background:#fff0ef; }
.status-chip.planned[b-n9712e0trl] { color:#6e4d91; background:#f0eafb; }
.status-chip.checking[b-n9712e0trl] { color:#2d78a4; background:#e8f3f9; }
.status-chip.ready[b-n9712e0trl] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.issued[b-n9712e0trl] { color:#8d641f; background:#fff1d7; }
.status-chip.on-mission[b-n9712e0trl] { color:#7658a7; background:#f0eafb; }
.status-chip.returned[b-n9712e0trl] { color:#3d6657; background:#e9f1ed; }
.status-chip.cancelled[b-n9712e0trl] { color:#697770; background:#edf1ef; }

.fuel-track[b-n9712e0trl] { width:95px; height:6px; margin-top:5px; overflow:hidden; border-radius:999px; background:#e6ece9; }
.fuel-track span[b-n9712e0trl] { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#d49a37,var(--theme-primary)); }
.fuel-return-cell small.overdue[b-n9712e0trl] { color:#b13e36; font-weight:700; }

.dispatch-picker[b-n9712e0trl] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.dispatch-source-card[b-n9712e0trl] { overflow:hidden; padding:0; border:1px solid rgba(11,116,88,.12); border-radius:15px; background:#fff; box-shadow:0 10px 25px rgba(8,75,56,.06); cursor:pointer; text-align:left; transition:.17s ease; }
.dispatch-source-card:hover[b-n9712e0trl] { transform:translateY(-2px); border-color:rgba(11,116,88,.30); box-shadow:0 15px 31px rgba(8,75,56,.12); }
.dispatch-source-card.selected[b-n9712e0trl] { border:2px solid var(--theme-primary); box-shadow:0 0 0 4px rgba(11,116,88,.09),0 16px 34px rgba(8,75,56,.14); }
.dispatch-picker-cover[b-n9712e0trl] { position:relative; display:grid; height:125px; overflow:hidden; place-items:center; color:var(--theme-primary); background:radial-gradient(circle,rgba(11,116,88,.13),transparent 58%),#edf7f3; }
.dispatch-picker-cover img[b-n9712e0trl] { width:100%; height:100%; object-fit:cover; }
.dispatch-picker-cover .mud-icon-root[b-n9712e0trl] { font-size:2rem; }
.dispatch-picker-content[b-n9712e0trl] { padding:10px; }
.dispatch-picker-content>small[b-n9712e0trl] { color:#9c7932; font-size:.42rem; font-weight:700; }
.dispatch-picker-content>strong[b-n9712e0trl] { display:-webkit-box; min-height:38px; margin-top:4px; overflow:hidden; color:#354740; font-size:.57rem; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>p[b-n9712e0trl] { display:-webkit-box; min-height:30px; margin:5px 0 0; overflow:hidden; color:var(--theme-muted); font-size:.43rem; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.dispatch-picker-content>div[b-n9712e0trl] { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
.source-status-chip[b-n9712e0trl] { display:inline-flex; min-height:23px; align-items:center; padding:0 7px; border-radius:999px; color:#476f8e; background:#eaf2f7; font-size:.39rem; font-weight:650; }

.locked-dispatch-panel[b-n9712e0trl] { display:grid; grid-template-columns:240px minmax(0,1fr); gap:15px; margin-bottom:16px; overflow:hidden; padding:14px; border:1px solid rgba(11,116,88,.13); border-radius:16px; background:radial-gradient(circle at 100% 0%,rgba(201,166,93,.11),transparent 20rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.locked-dispatch-cover[b-n9712e0trl] { display:grid; min-height:220px; overflow:hidden; place-items:center; border-radius:13px; color:var(--theme-primary); background:#e8f3ee; }
.locked-dispatch-cover img[b-n9712e0trl] { width:100%; height:100%; object-fit:cover; }
.locked-dispatch-cover .mud-icon-root[b-n9712e0trl] { font-size:2.4rem; }
.locked-dispatch-heading[b-n9712e0trl] { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.locked-dispatch-heading small[b-n9712e0trl] { color:#9c7932; font-size:.46rem; font-weight:700; }
.locked-dispatch-heading h3[b-n9712e0trl] { margin:4px 0 0; color:#34483f; font-size:.83rem; }
.locked-dispatch-heading p[b-n9712e0trl] { margin:3px 0 0; color:var(--theme-primary); font-size:.50rem; font-weight:700; }
.locked-grid[b-n9712e0trl] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-top:12px; }
.locked-grid>div[b-n9712e0trl] { min-height:58px; padding:8px; border:1px solid rgba(11,116,88,.08); border-radius:10px; background:#fff; }
.locked-grid span[b-n9712e0trl] { display:block; color:var(--theme-muted); font-size:.40rem; }
.locked-grid strong[b-n9712e0trl] { display:block; margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.49rem; line-height:1.42; }
.command-readonly[b-n9712e0trl] { margin-top:9px; padding:10px; border-left:3px solid var(--theme-primary); border-radius:8px; background:#fff; }
.command-readonly small[b-n9712e0trl] { color:var(--theme-primary); font-size:.42rem; font-weight:700; }
.command-readonly p[b-n9712e0trl] { margin:5px 0 0; color:var(--theme-muted); font-size:.49rem; line-height:1.6; }
.source-actions[b-n9712e0trl] { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.source-actions a[b-n9712e0trl],.source-actions button[b-n9712e0trl] { display:inline-flex; min-height:34px; align-items:center; gap:5px; padding:0 9px; border:1px solid rgba(11,116,88,.16); border-radius:9px; color:var(--theme-primary); background:#fff; font-family:'Kanit',sans-serif; font-size:.42rem; font-weight:650; text-decoration:none; cursor:pointer; }

.shelter-photo-upload-grid[b-n9712e0trl] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; }
.shelter-capacity-banner[b-n9712e0trl] { display:grid; grid-template-columns:70px repeat(4,minmax(0,1fr)); gap:1px; margin-top:15px; overflow:hidden; border:1px solid rgba(11,116,88,.11); border-radius:16px; background:rgba(11,116,88,.10); box-shadow:0 12px 30px rgba(8,75,56,.07); }
.shelter-capacity-banner>div[b-n9712e0trl] { display:flex; min-height:102px; align-items:center; justify-content:center; flex-direction:column; gap:3px; padding:12px; background:#fff; }
.shelter-capacity-banner .shelter-capacity-banner-icon[b-n9712e0trl] { color:#ddf5e9; background:linear-gradient(145deg,var(--theme-primary),#16473a); }
.shelter-capacity-banner-icon .mud-icon-root[b-n9712e0trl] { font-size:1.75rem; }
.shelter-capacity-banner small[b-n9712e0trl] { color:var(--theme-muted); font-size:.43rem; }
.shelter-capacity-banner strong[b-n9712e0trl] { margin-top:4px; color:color-mix(in srgb, var(--theme-ink) 82%, white); font-size:.58rem; text-align:center; }

.source-dispatch-detail[b-n9712e0trl] { display:grid; grid-template-columns:62px minmax(0,1fr); gap:11px; align-items:center; margin-top:14px; padding:13px; border:1px solid rgba(11,116,88,.13); border-radius:15px; background:radial-gradient(circle at 100% 0%,rgba(11,116,88,.09),transparent 18rem),color-mix(in srgb, var(--theme-bg) 58%, white); }
.source-dispatch-detail>span[b-n9712e0trl] { display:grid; width:62px; height:62px; place-items:center; border-radius:18px; color:#fff; background:linear-gradient(145deg,var(--theme-primary),#153f34); }
.source-dispatch-detail small[b-n9712e0trl] { color:var(--theme-primary); font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.source-dispatch-detail h3[b-n9712e0trl] { margin:3px 0 0; color:#34483f; font-size:.71rem; }
.source-dispatch-detail p[b-n9712e0trl] { margin:4px 0 0; color:#9c7932; font-size:.48rem; font-weight:650; }
.source-dispatch-detail em[b-n9712e0trl] { display:block; margin-top:5px; color:var(--theme-muted); font-size:.50rem; line-height:1.6; font-style:normal; }

.shelter-location-panel[b-n9712e0trl] { display:grid; grid-template-columns:54px minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:13px; padding:13px; border:1px solid rgba(45,120,164,.14); border-radius:14px; background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.10),transparent 18rem),#f5fafc; }
.shelter-location-panel>span[b-n9712e0trl] { display:grid; width:54px; height:54px; place-items:center; border-radius:16px; color:#fff; background:linear-gradient(145deg,#3a86af,#245f82); }
.shelter-location-panel small[b-n9712e0trl] { color:#2d78a4; font-size:.45rem; font-weight:700; letter-spacing:.07em; }
.shelter-location-panel h3[b-n9712e0trl] { margin:3px 0 0; color:#344a42; font-size:.69rem; }
.shelter-location-panel p[b-n9712e0trl] { margin:4px 0 0; color:var(--theme-muted); font-size:.51rem; }
.shelter-location-panel b[b-n9712e0trl] { display:block; margin-top:4px; color:#2d78a4; font-size:.43rem; }
.shelter-location-panel a[b-n9712e0trl] { display:inline-flex; min-height:38px; align-items:center; gap:5px; padding:0 10px; border:1px solid rgba(45,120,164,.18); border-radius:10px; color:#2d78a4; background:#fff; font-size:.44rem; font-weight:650; text-decoration:none; }

.shelter-detail-grid[b-n9712e0trl] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:13px; }
.shelter-detail-grid>div[b-n9712e0trl] { min-height:105px; padding:13px; border:1px solid rgba(7,88,67,.08); border-radius:13px; background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.shelter-detail-grid .ready-note[b-n9712e0trl] { border-color:rgba(11,116,88,.14); background:#f2faf6; }
.shelter-detail-grid .defect-note[b-n9712e0trl] { border-color:rgba(189,79,67,.14); background:#fff7f5; }
.shelter-detail-grid small[b-n9712e0trl] { color:var(--theme-primary); font-size:.45rem; font-weight:700; }
.shelter-detail-grid p[b-n9712e0trl] { margin:7px 0 0; color:#60756d; font-size:.54rem; line-height:1.75; }

.five-columns[b-n9712e0trl] { grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
.attachment-card.incident span[b-n9712e0trl] { color:#ad382f; background:#fff0ee; }
.attachment-card.assignment span[b-n9712e0trl] { color:#7658a7; background:#f0eafb; }
.attachment-card.preparation span[b-n9712e0trl] { color:var(--theme-primary); background:color-mix(in srgb, var(--theme-light) 13%, white); }
.attachment-card.equipment span[b-n9712e0trl] { color:#2d78a4; background:#e8f3f9; }
.attachment-card.returned span[b-n9712e0trl] { color:#8d641f; background:#fff1d7; }

@media (max-width:1380px) {
    .status-overview[b-n9712e0trl] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
    .dispatch-picker[b-n9712e0trl] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .five-columns[b-n9712e0trl] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:1050px) {
    .locked-dispatch-panel[b-n9712e0trl] { grid-template-columns:minmax(0,1fr); }
    .locked-grid[b-n9712e0trl] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .shelter-capacity-banner[b-n9712e0trl] { grid-template-columns:70px repeat(2,minmax(0,1fr)); }
    .shelter-photo-upload-grid[b-n9712e0trl],.five-columns[b-n9712e0trl] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:800px) {
    .status-overview[b-n9712e0trl] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .dispatch-picker[b-n9712e0trl],.shelter-photo-upload-grid[b-n9712e0trl],.shelter-detail-grid[b-n9712e0trl],.five-columns[b-n9712e0trl] { grid-template-columns:minmax(0,1fr) !important; }
    .shelter-capacity-banner[b-n9712e0trl] { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .shelter-capacity-banner .shelter-capacity-banner-icon[b-n9712e0trl] { grid-column:1/-1; }
    .shelter-location-panel[b-n9712e0trl] { grid-template-columns:50px minmax(0,1fr); }
    .shelter-location-panel a[b-n9712e0trl] { grid-column:1/-1; }
}
@media (max-width:560px) {
    .status-overview[b-n9712e0trl],.locked-grid[b-n9712e0trl],.shelter-capacity-banner[b-n9712e0trl] { grid-template-columns:minmax(0,1fr) !important; }
    .locked-dispatch-heading[b-n9712e0trl] { flex-direction:column; }
    .view-toolbar-actions[b-n9712e0trl] { width:100%; align-items:stretch; flex-direction:column; }
    .view-map-button[b-n9712e0trl],.emergency-shelter-page[b-n9712e0trl]  .view-edit-button { width:100%; }
}


/* =========================================================
   EMERGENCY SHELTER & AID CENTER PREMIUM
   ========================================================= */

.emergency-shelter-page[b-n9712e0trl] {
    --shelter-blue: #2d78a4;
    --shelter-deep: #173f56;
    --shelter-soft: #eaf5fb;
    --aid-green: var(--theme-primary);
}

.shelter-hero[b-n9712e0trl] {
    background:
        radial-gradient(circle at 88% 18%, rgba(148, 210, 236, .22), transparent 24rem),
        radial-gradient(circle at 14% 82%, rgba(201, 166, 93, .14), transparent 20rem),
        linear-gradient(135deg, #235f80 0%, #153e55 56%, #0d2838 100%) !important;
}

.hero-accent-line[b-n9712e0trl] {
    position:absolute;inset:0 0 auto;height:4px;
    background:linear-gradient(90deg,transparent,#9ddbf2 18%,#f0d49a 50%,#9ddbf2 82%,transparent);
    box-shadow:0 0 18px rgba(113,194,225,.50);
}

.emergency-shelter-page[b-n9712e0trl]  .hero-add-button,
.emergency-shelter-page[b-n9712e0trl]  .toolbar-add-button {
    color:#fff !important;
    background:linear-gradient(145deg,#3a8fba,#226689) !important;
    box-shadow:0 11px 24px rgba(26,79,108,.28) !important;
}

.summary-card.occupancy[b-n9712e0trl] { --summary-accent:#2d78a4; --summary-soft:#e6f2f9; --summary-border:rgba(45,120,164,.20); }
.summary-card.available[b-n9712e0trl] { --summary-accent:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); --summary-border:rgba(8,116,90,.20); }
.summary-card.vulnerable[b-n9712e0trl] { --summary-accent:#7658a7; --summary-soft:#f0eafb; --summary-border:rgba(118,88,167,.20); }
.summary-card.supply[b-n9712e0trl] { --summary-accent:#bd4f43; --summary-soft:#fff0ee; --summary-border:rgba(189,79,67,.20); }
.emergency-shelter-page[b-n9712e0trl]  .summary-card .summary-icon .mud-icon-root { color:var(--summary-accent) !important; }

.shelter-status-overview[b-n9712e0trl] { grid-template-columns:repeat(7,minmax(0,1fr)) !important; }
.status-overview-card.open > span[b-n9712e0trl] { background:var(--theme-primary); }
.status-overview-card.preparing > span[b-n9712e0trl] { background:#2d78a4; }
.status-overview-card.full > span[b-n9712e0trl] { background:#bd4f43; }
.status-overview-card.standby > span[b-n9712e0trl] { background:#7658a7; }
.status-overview-card.low-supply > span[b-n9712e0trl] { background:#c27a22; }
.status-overview-card.closed > span[b-n9712e0trl] { background:#68766f; }

.shelter-code-photo-cell[b-n9712e0trl] { display:grid;grid-template-columns:50px minmax(0,1fr);min-width:150px;align-items:center;gap:8px; }
.shelter-photo-mini[b-n9712e0trl] { display:grid;width:50px;height:50px;overflow:hidden;place-items:center;border:1px solid rgba(45,120,164,.13);border-radius:12px;color:#2d78a4;background:#eaf5fb; }
.shelter-photo-mini button[b-n9712e0trl] { width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer; }
.shelter-photo-mini img[b-n9712e0trl] { width:100%;height:100%;object-fit:cover; }
.shelter-code-photo-cell strong[b-n9712e0trl] { display:inline-flex;min-height:28px;align-items:center;padding:0 8px;border:1px solid rgba(45,120,164,.14);border-radius:8px;color:#2d78a4;background:#eff8fc;font-size:.50rem;font-weight:760;white-space:nowrap; }
.shelter-code-photo-cell small[b-n9712e0trl] { display:block;margin-top:4px;color:var(--theme-muted);font-size:.43rem; }

.shelter-name-cell[b-n9712e0trl],.capacity-cell[b-n9712e0trl],.manager-cell[b-n9712e0trl],.vulnerable-cell[b-n9712e0trl],.supply-cell[b-n9712e0trl],.latest-update-cell[b-n9712e0trl] { display:flex;min-width:130px;flex-direction:column; }
.shelter-name-cell[b-n9712e0trl] { min-width:190px; }
.shelter-name-cell strong[b-n9712e0trl],.capacity-cell strong[b-n9712e0trl],.manager-cell strong[b-n9712e0trl],.vulnerable-cell strong[b-n9712e0trl],.latest-update-cell strong[b-n9712e0trl] { color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.56rem;line-height:1.48; }
.shelter-name-cell small[b-n9712e0trl],.capacity-cell small[b-n9712e0trl],.manager-cell small[b-n9712e0trl],.vulnerable-cell small[b-n9712e0trl],.supply-cell small[b-n9712e0trl],.latest-update-cell small[b-n9712e0trl] { margin-top:3px;color:#84928d;font-size:.44rem;line-height:1.5; }
.shelter-name-cell em[b-n9712e0trl],.manager-cell em[b-n9712e0trl] { display:inline-flex;width:fit-content;min-height:22px;align-items:center;margin-top:5px;padding:0 7px;border-radius:999px;color:#2d78a4;background:#e8f3f9;font-size:.40rem;font-style:normal;font-weight:650; }
.capacity-cell[b-n9712e0trl] { gap:5px; }
.capacity-track[b-n9712e0trl] { width:100%;height:7px;overflow:hidden;border-radius:999px;background:#e5ece9; }
.capacity-track span[b-n9712e0trl] { display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2d78a4,#6fb4d3); }
.supply-cell[b-n9712e0trl] { align-items:flex-start;gap:4px; }
.latest-update-cell small[b-n9712e0trl] { display:-webkit-box;max-width:190px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2; }

.status-chip.preparing[b-n9712e0trl] { color:#2d78a4;background:#e8f3f9; }
.status-chip.open[b-n9712e0trl] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.status-chip.full[b-n9712e0trl] { color:#ad382f;background:#fff0ee; }
.status-chip.standby[b-n9712e0trl] { color:#7658a7;background:#f0eafb; }
.status-chip.closed[b-n9712e0trl] { color:#68766f;background:#edf1ef; }
.status-chip.cancelled[b-n9712e0trl] { color:#7d4a54;background:#f8eaee; }

.supply-badge[b-n9712e0trl] { display:inline-flex;min-height:25px;align-items:center;padding:0 8px;border-radius:999px;font-size:.41rem;font-weight:700; }
.supply-badge.enough[b-n9712e0trl] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.supply-badge.warning[b-n9712e0trl] { color:#94651b;background:#fff1d7; }
.supply-badge.low[b-n9712e0trl] { color:#b15d24;background:#fff0df; }
.supply-badge.critical[b-n9712e0trl] { color:#aa453e;background:#fff0ef; }

.type-chip.shelter[b-n9712e0trl] { color:#2d78a4;background:#e8f3f9; }
.type-chip.aid_point[b-n9712e0trl] { color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white); }
.type-chip.medical_point[b-n9712e0trl] { color:#a93e5b;background:#fceaf0; }
.type-chip.food_point[b-n9712e0trl] { color:#a46622;background:#fff1dc; }
.type-chip.assembly_point[b-n9712e0trl] { color:#655496;background:#eee9fa; }
.type-chip.mobile_point[b-n9712e0trl] { color:#367849;background:#e8f5ec; }

.priority-chip.critical[b-n9712e0trl] { color:#fff;background:linear-gradient(145deg,#d65043,#9f2e29); }
.priority-chip.urgent[b-n9712e0trl] { color:#a33c32;background:#ffe4df; }
.priority-chip.high[b-n9712e0trl] { color:#a46622;background:#fff0d8; }
.priority-chip.normal[b-n9712e0trl] { color:#39745a;background:#e7f5ee; }

.source-select[b-n9712e0trl] { margin-bottom:12px; }
.linked-dispatch-panel[b-n9712e0trl] { display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px;padding:13px;margin-bottom:16px;border:1px solid rgba(45,120,164,.14);border-radius:16px;background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.09),transparent 18rem),#f7fbfd; }
.linked-cover[b-n9712e0trl] { display:grid;min-height:190px;overflow:hidden;place-items:center;border-radius:13px;color:#2d78a4;background:#e4f1f7; }
.linked-cover img[b-n9712e0trl] { width:100%;height:100%;object-fit:cover; }
.linked-cover .mud-icon-root[b-n9712e0trl] { font-size:2.2rem; }
.linked-heading[b-n9712e0trl] { display:flex;justify-content:space-between;gap:12px; }
.linked-heading small[b-n9712e0trl] { color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.06em; }
.linked-heading h3[b-n9712e0trl] { margin:3px 0 0;color:#34483f;font-size:.78rem; }
.linked-heading p[b-n9712e0trl] { margin:3px 0 0;color:#9c7932;font-size:.48rem;font-weight:650; }
.linked-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px; }
.linked-grid > div[b-n9712e0trl] { min-height:58px;padding:8px;border:1px solid rgba(45,120,164,.08);border-radius:10px;background:#fff; }
.linked-grid span[b-n9712e0trl] { display:block;color:var(--theme-muted);font-size:.40rem; }
.linked-grid strong[b-n9712e0trl] { display:block;margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.48rem;line-height:1.42; }
.linked-actions[b-n9712e0trl] { display:flex;flex-wrap:wrap;gap:6px;margin-top:9px; }
.linked-actions a[b-n9712e0trl],.linked-actions button[b-n9712e0trl] { display:inline-flex;min-height:34px;align-items:center;justify-content:center;gap:5px;padding:0 9px;border:1px solid rgba(45,120,164,.16);border-radius:9px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.42rem;font-weight:650;text-decoration:none;cursor:pointer; }

.coordinate-preview[b-n9712e0trl] { display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;margin:5px 0 15px;padding:10px 12px;border:1px solid rgba(45,120,164,.14);border-radius:13px;background:#f5fafc; }
.coordinate-preview > span[b-n9712e0trl] { display:grid;width:42px;height:42px;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(145deg,#3a86af,#245f82); }
.coordinate-preview > div[b-n9712e0trl] { display:flex;flex-direction:column; }.coordinate-preview small[b-n9712e0trl]{color:#7d8e87;font-size:.43rem}.coordinate-preview strong[b-n9712e0trl]{margin-top:3px;color:color-mix(in srgb, var(--theme-ink) 80%, white);font-size:.54rem}.coordinate-preview a[b-n9712e0trl]{display:inline-flex;min-height:36px;align-items:center;padding:0 10px;border:1px solid rgba(45,120,164,.18);border-radius:9px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.44rem;font-weight:650;text-decoration:none}

.capacity-preview[b-n9712e0trl] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:7px 0 15px; }
.capacity-preview>div[b-n9712e0trl] { display:flex;min-height:65px;justify-content:center;flex-direction:column;padding:10px 12px;border:1px solid rgba(45,120,164,.13);border-radius:12px;background:linear-gradient(145deg,#f4fbfe,#fff); }
.capacity-preview span[b-n9712e0trl] { color:var(--theme-muted);font-size:.43rem; }.capacity-preview strong[b-n9712e0trl]{margin-top:4px;color:#2d78a4;font-size:.66rem}

.supply-preview-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:7px 0 15px; }
.supply-preview-grid>div[b-n9712e0trl] { padding:10px 11px;border:1px solid rgba(7,88,67,.09);border-radius:11px;background:#fff; }
.supply-preview-grid span[b-n9712e0trl] { color:#657871;font-size:.44rem; }.supply-preview-grid strong[b-n9712e0trl]{display:block;margin-top:5px;color:#34483f;font-size:.55rem}
.supply-preview-grid>div>div[b-n9712e0trl] { height:8px;margin-top:7px;overflow:hidden;border-radius:999px;background:#e8eeeb; }.supply-preview-grid i[b-n9712e0trl]{display:block;height:100%;border-radius:999px;background:var(--theme-primary)}.supply-preview-grid .water i[b-n9712e0trl]{background:#2d78a4}.supply-preview-grid .medicine i[b-n9712e0trl]{background:#b24e66}

.service-switch-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:15px; }
.service-switch-grid[b-n9712e0trl]  .mud-switch { min-height:52px;padding:7px 9px;border:1px solid rgba(45,120,164,.09);border-radius:11px;background:#f8fbfc; }

.shelter-photo-upload-grid[b-n9712e0trl] { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }

.shelter-capacity-banner[b-n9712e0trl] { display:grid;grid-template-columns:70px repeat(4,minmax(0,1fr));gap:1px;margin-top:15px;overflow:hidden;border:1px solid rgba(45,120,164,.11);border-radius:16px;background:rgba(45,120,164,.10);box-shadow:0 12px 30px rgba(26,79,108,.07); }
.shelter-capacity-banner>div[b-n9712e0trl] { display:flex;min-height:102px;align-items:center;justify-content:center;flex-direction:column;gap:3px;padding:12px;background:#fff; }
.shelter-capacity-banner .capacity-banner-icon[b-n9712e0trl] { color:#d8f0f7;background:linear-gradient(145deg,#3a86af,#1d516d); }.capacity-banner-icon .mud-icon-root[b-n9712e0trl]{font-size:1.75rem}.shelter-capacity-banner small[b-n9712e0trl]{color:var(--theme-muted);font-size:.43rem}.shelter-capacity-banner strong[b-n9712e0trl]{margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.59rem;text-align:center}

.occupancy-overview-panel[b-n9712e0trl],.supply-overview-panel[b-n9712e0trl],.service-feature-panel[b-n9712e0trl] { margin-top:14px;padding:14px;border:1px solid rgba(45,120,164,.10);border-radius:15px;background:radial-gradient(circle at 100% 0%,rgba(45,120,164,.08),transparent 18rem),#f8fbfc; }
.occupancy-heading[b-n9712e0trl] { display:flex;align-items:center;justify-content:space-between;gap:12px; }.occupancy-heading small[b-n9712e0trl]{color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.08em}.occupancy-heading h3[b-n9712e0trl]{margin:3px 0 0;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.73rem}
.occupancy-badge[b-n9712e0trl] { display:inline-flex;min-height:28px;align-items:center;padding:0 9px;border-radius:999px;font-size:.43rem;font-weight:700; }.occupancy-badge.available[b-n9712e0trl]{color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white)}.occupancy-badge.medium[b-n9712e0trl]{color:#2d78a4;background:#e8f3f9}.occupancy-badge.high[b-n9712e0trl]{color:#a46622;background:#fff0d8}.occupancy-badge.full[b-n9712e0trl]{color:#ad382f;background:#fff0ee}
.occupancy-progress[b-n9712e0trl] { height:12px;margin-top:12px;overflow:hidden;border-radius:999px;background:#e4ece9; }.occupancy-progress span[b-n9712e0trl]{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2d78a4,#6fb4d3)}
.occupancy-stat-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px; }.occupancy-stat-grid>div[b-n9712e0trl]{min-height:60px;padding:9px;border:1px solid rgba(45,120,164,.07);border-radius:10px;background:#fff}.occupancy-stat-grid span[b-n9712e0trl]{display:block;color:var(--theme-muted);font-size:.40rem}.occupancy-stat-grid strong[b-n9712e0trl]{display:block;margin-top:4px;color:color-mix(in srgb, var(--theme-ink) 82%, white);font-size:.51rem}

.source-dispatch-detail[b-n9712e0trl] { display:grid;grid-template-columns:62px minmax(0,1fr);gap:11px;align-items:center;margin-top:14px;padding:13px;border:1px solid rgba(118,88,167,.13);border-radius:15px;background:#faf7fc; }.source-detail-icon[b-n9712e0trl]{display:grid;width:62px;height:62px;place-items:center;border-radius:18px;color:#fff;background:linear-gradient(145deg,#7658a7,#3f2d54)}.source-dispatch-detail small[b-n9712e0trl]{color:#7658a7;font-size:.45rem;font-weight:700;letter-spacing:.07em}.source-dispatch-detail h3[b-n9712e0trl]{margin:3px 0 0;color:#34483f;font-size:.70rem}.source-dispatch-detail p[b-n9712e0trl]{margin:5px 0 0;color:var(--theme-muted);font-size:.50rem}

.shelter-location-panel[b-n9712e0trl] { display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:10px;align-items:center;margin-top:13px;padding:13px;border:1px solid rgba(45,120,164,.14);border-radius:14px;background:#f5fafc; }.shelter-location-panel>span[b-n9712e0trl]{display:grid;width:54px;height:54px;place-items:center;border-radius:16px;color:#fff;background:linear-gradient(145deg,#3a86af,#245f82)}.shelter-location-panel small[b-n9712e0trl]{color:#2d78a4;font-size:.45rem;font-weight:700;letter-spacing:.07em}.shelter-location-panel h3[b-n9712e0trl]{margin:3px 0 0;color:#344a42;font-size:.69rem}.shelter-location-panel p[b-n9712e0trl]{margin:4px 0 0;color:var(--theme-muted);font-size:.51rem;line-height:1.55}.shelter-location-panel p em[b-n9712e0trl]{font-style:normal}.shelter-location-panel b[b-n9712e0trl]{display:block;margin-top:4px;color:#2d78a4;font-size:.43rem}.shelter-location-panel a[b-n9712e0trl]{display:inline-flex;min-height:38px;align-items:center;justify-content:center;gap:5px;padding:0 10px;border:1px solid rgba(45,120,164,.18);border-radius:10px;color:#2d78a4;background:#fff;font-family:'Kanit',sans-serif;font-size:.44rem;font-weight:650;text-decoration:none}

.supply-detail-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px; }.supply-detail-grid>div[b-n9712e0trl]{padding:10px 11px;border:1px solid rgba(7,88,67,.08);border-radius:11px;background:#fff}.supply-detail-grid>div>div:first-child[b-n9712e0trl]{display:flex;justify-content:space-between;gap:8px}.supply-detail-grid span[b-n9712e0trl]{color:#657871;font-size:.45rem}.supply-detail-grid strong[b-n9712e0trl]{color:#34483f;font-size:.52rem}.supply-detail-grid>div>div:last-child[b-n9712e0trl]{height:8px;margin-top:8px;overflow:hidden;border-radius:999px;background:#e8eeeb}.supply-detail-grid i[b-n9712e0trl]{display:block;height:100%;border-radius:999px;background:var(--theme-primary)}.supply-detail-grid .water i[b-n9712e0trl]{background:#2d78a4}.supply-detail-grid .medicine i[b-n9712e0trl]{background:#b24e66}

.service-chip-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px; }.service-chip[b-n9712e0trl]{display:inline-flex;min-height:42px;align-items:center;gap:6px;padding:0 9px;border-radius:10px;font-size:.44rem;font-weight:650}.service-chip.available[b-n9712e0trl]{color:var(--theme-primary);border:1px solid rgba(8,112,82,.13);background:#eaf7f1}.service-chip.unavailable[b-n9712e0trl]{color:#9aa49f;border:1px solid rgba(105,119,112,.08);background:#f1f4f2;text-decoration:line-through}

.shelter-note-grid[b-n9712e0trl] { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:13px; }.shelter-note-grid>div[b-n9712e0trl]{min-height:112px;padding:13px;border:1px solid rgba(7,88,67,.08);border-radius:13px;background:color-mix(in srgb, var(--theme-bg) 58%, white)}.shelter-note-grid .supply-need-note[b-n9712e0trl]{border-color:rgba(194,122,34,.16);background:#fffaf0}.shelter-note-grid small[b-n9712e0trl]{color:#2d78a4;font-size:.45rem;font-weight:700}.shelter-note-grid p[b-n9712e0trl]{margin:7px 0 0;color:#60756d;font-size:.54rem;line-height:1.75}

.four-columns[b-n9712e0trl] { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }.attachment-card.source span[b-n9712e0trl]{color:#7658a7;background:#f0eafb}.attachment-card.exterior span[b-n9712e0trl]{color:#2d78a4;background:#e8f3f9}.attachment-card.interior span[b-n9712e0trl]{color:var(--theme-primary);background:color-mix(in srgb, var(--theme-light) 13%, white)}.attachment-card.aid span[b-n9712e0trl]{color:#a46622;background:#fff1dc}

@media(max-width:1380px){.shelter-status-overview[b-n9712e0trl]{grid-template-columns:repeat(4,minmax(0,1fr)) !important}.linked-grid[b-n9712e0trl],.service-switch-grid[b-n9712e0trl],.service-chip-grid[b-n9712e0trl]{grid-template-columns:repeat(2,minmax(0,1fr))}.occupancy-stat-grid[b-n9712e0trl]{grid-template-columns:repeat(3,minmax(0,1fr))}.four-columns[b-n9712e0trl]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media(max-width:1050px){.linked-dispatch-panel[b-n9712e0trl]{grid-template-columns:minmax(0,1fr)}.linked-cover[b-n9712e0trl]{max-height:300px}.shelter-capacity-banner[b-n9712e0trl]{grid-template-columns:70px repeat(2,minmax(0,1fr))}.shelter-photo-upload-grid[b-n9712e0trl]{grid-template-columns:repeat(2,minmax(0,1fr)) !important}.supply-detail-grid[b-n9712e0trl]{grid-template-columns:minmax(0,1fr)}}
@media(max-width:800px){.shelter-status-overview[b-n9712e0trl],.capacity-preview[b-n9712e0trl],.supply-preview-grid[b-n9712e0trl],.shelter-photo-upload-grid[b-n9712e0trl],.shelter-note-grid[b-n9712e0trl]{grid-template-columns:minmax(0,1fr) !important}.shelter-capacity-banner[b-n9712e0trl]{grid-template-columns:repeat(2,minmax(0,1fr))}.shelter-capacity-banner .capacity-banner-icon[b-n9712e0trl]{grid-column:1/-1}.occupancy-stat-grid[b-n9712e0trl]{grid-template-columns:repeat(2,minmax(0,1fr))}.shelter-location-panel[b-n9712e0trl]{grid-template-columns:50px minmax(0,1fr)}.shelter-location-panel a[b-n9712e0trl]{grid-column:1/-1}.coordinate-preview[b-n9712e0trl]{grid-template-columns:42px minmax(0,1fr)}.coordinate-preview a[b-n9712e0trl]{grid-column:1/-1}}
@media(max-width:560px){.shelter-status-overview[b-n9712e0trl],.linked-grid[b-n9712e0trl],.service-switch-grid[b-n9712e0trl],.service-chip-grid[b-n9712e0trl],.occupancy-stat-grid[b-n9712e0trl],.shelter-capacity-banner[b-n9712e0trl],.four-columns[b-n9712e0trl]{grid-template-columns:minmax(0,1fr) !important}.linked-heading[b-n9712e0trl]{flex-direction:column}.view-toolbar-actions[b-n9712e0trl]{width:100%;align-items:stretch;flex-direction:column}.view-map-button[b-n9712e0trl],.emergency-shelter-page[b-n9712e0trl]  .view-edit-button{width:100%}}
/* /Components/Pages/02Specialized/01Construction/01PermitApplication/AllPermitApplications.razor.rz.scp.css */
.permit-page[b-17gxr0m3og] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.permit-page[b-17gxr0m3og]  .permit-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.permit-hero[b-17gxr0m3og] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-17gxr0m3og] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-17gxr0m3og] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-17gxr0m3og] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-17gxr0m3og] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-17gxr0m3og] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-17gxr0m3og] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-17gxr0m3og] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-17gxr0m3og] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-17gxr0m3og] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-17gxr0m3og] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-17gxr0m3og] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-17gxr0m3og] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-17gxr0m3og] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-17gxr0m3og] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.permit-page[b-17gxr0m3og]  .hero-add-button,
.permit-page[b-17gxr0m3og]  .search-button,
.permit-page[b-17gxr0m3og]  .toolbar-add-button,
.permit-page[b-17gxr0m3og]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.permit-page[b-17gxr0m3og]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-17gxr0m3og] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-17gxr0m3og] {
    opacity: .55;
    cursor: not-allowed;
}

.permit-page[b-17gxr0m3og]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.permit-page[b-17gxr0m3og]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-17gxr0m3og] {
    margin-top: 7px;
}

.summary-card[b-17gxr0m3og] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-17gxr0m3og] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-17gxr0m3og] {
    color: #2c7da8;
}

.summary-card.approved[b-17gxr0m3og] {
    color: #7658a7;
}

.summary-card.incomplete[b-17gxr0m3og] {
    color: #c05b4e;
}

.summary-line[b-17gxr0m3og] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-17gxr0m3og] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-17gxr0m3og] {
    min-width: 0;
}

.summary-card small[b-17gxr0m3og] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-17gxr0m3og] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-17gxr0m3og] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-17gxr0m3og] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-17gxr0m3og] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-17gxr0m3og],
.permit-list-panel[b-17gxr0m3og] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-17gxr0m3og],
.list-toolbar[b-17gxr0m3og] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-17gxr0m3og],
.panel-kicker[b-17gxr0m3og] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-17gxr0m3og],
.list-toolbar h2[b-17gxr0m3og] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-17gxr0m3og],
.list-toolbar p[b-17gxr0m3og] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-17gxr0m3og] {
    align-items: center;
}

.permit-page[b-17gxr0m3og]  .premium-field,
.permit-page[b-17gxr0m3og]  .form-field {
    width: 100%;
}

.permit-page[b-17gxr0m3og]  .premium-field .mud-input-outlined-border,
.permit-page[b-17gxr0m3og]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.permit-page[b-17gxr0m3og]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.permit-page[b-17gxr0m3og]  .sort-select {
    width: 160px;
}

.permit-page[b-17gxr0m3og]  .toolbar-add-button {
    min-height: 42px;
}

.permit-page[b-17gxr0m3og]  .permit-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.permit-page[b-17gxr0m3og]  .permit-table .mud-table-head {
    background: #eef6f2;
}

.permit-page[b-17gxr0m3og]  .permit-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-17gxr0m3og] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-17gxr0m3og],
.view-avatar[b-17gxr0m3og] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-17gxr0m3og],
.view-avatar.female[b-17gxr0m3og] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-17gxr0m3og],
.view-avatar.other[b-17gxr0m3og] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-17gxr0m3og] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-17gxr0m3og],
.person-name small[b-17gxr0m3og] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-17gxr0m3og] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-17gxr0m3og] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-17gxr0m3og] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-17gxr0m3og] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-17gxr0m3og],
.area-cell[b-17gxr0m3og],
.date-cell[b-17gxr0m3og] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-17gxr0m3og] {
    gap: 3px;
}

.contact-cell span[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-17gxr0m3og],
.date-cell strong[b-17gxr0m3og] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-17gxr0m3og],
.date-cell small[b-17gxr0m3og] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-17gxr0m3og],
.document-chip[b-17gxr0m3og],
.status-chip[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-17gxr0m3og] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-17gxr0m3og] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-17gxr0m3og] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-17gxr0m3og] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-17gxr0m3og] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-17gxr0m3og] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-17gxr0m3og] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-17gxr0m3og] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-17gxr0m3og] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-17gxr0m3og] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-17gxr0m3og] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-17gxr0m3og] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.permit-page[b-17gxr0m3og]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.permit-page[b-17gxr0m3og]  .row-action.view {
    color: #2d79a2;
}

.permit-page[b-17gxr0m3og]  .row-action.edit {
    color: var(--theme-primary);
}

.permit-page[b-17gxr0m3og]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.permit-page[b-17gxr0m3og]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-17gxr0m3og] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-17gxr0m3og] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-17gxr0m3og] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-17gxr0m3og] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-17gxr0m3og] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.permit-form-modal[b-17gxr0m3og],
.permit-view-modal[b-17gxr0m3og],
.delete-modal[b-17gxr0m3og] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-17gxr0m3og .22s ease-out;
}

@keyframes modalAppear-b-17gxr0m3og {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.permit-form-modal[b-17gxr0m3og] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-17gxr0m3og] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-17gxr0m3og] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-17gxr0m3og] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-17gxr0m3og] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-17gxr0m3og] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-17gxr0m3og] {
    margin-top: 24px;
}

.form-section-title > span[b-17gxr0m3og] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-17gxr0m3og] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-17gxr0m3og] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-17gxr0m3og] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-17gxr0m3og] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-17gxr0m3og] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.permit-page[b-17gxr0m3og]  .cancel-button,
.permit-page[b-17gxr0m3og]  .save-button,
.permit-page[b-17gxr0m3og]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.permit-page[b-17gxr0m3og]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.permit-page[b-17gxr0m3og]  .save-button {
    min-width: 170px;
}

.permit-view-modal[b-17gxr0m3og] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-17gxr0m3og] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-17gxr0m3og] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-17gxr0m3og] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-17gxr0m3og] {
    padding: 61px 24px 25px;
}

.view-heading[b-17gxr0m3og] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-17gxr0m3og] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-17gxr0m3og] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-17gxr0m3og] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-17gxr0m3og] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-17gxr0m3og] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-17gxr0m3og],
.view-address small[b-17gxr0m3og],
.view-note small[b-17gxr0m3og] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-17gxr0m3og] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-17gxr0m3og] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-17gxr0m3og] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-17gxr0m3og] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-17gxr0m3og] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-17gxr0m3og] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-17gxr0m3og] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-17gxr0m3og] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-17gxr0m3og] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-17gxr0m3og] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-17gxr0m3og] {
    color: #963b36;
}

.delete-warning[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.permit-page[b-17gxr0m3og]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .permit-hero[b-17gxr0m3og] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-17gxr0m3og] {
        max-width: 570px;
    }

    .list-toolbar[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-17gxr0m3og] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .permit-page[b-17gxr0m3og] {
        padding: 15px 12px 30px;
    }

    .permit-hero[b-17gxr0m3og] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-17gxr0m3og] {
        font-size: 2.3rem;
    }

    .hero-meta[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-17gxr0m3og] {
        width: 100%;
    }

    .filter-heading[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }

    .permit-page[b-17gxr0m3og]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-17gxr0m3og] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-17gxr0m3og] {
        align-items: end;
        padding: 0;
    }

    .permit-form-modal[b-17gxr0m3og],
    .permit-view-modal[b-17gxr0m3og] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-17gxr0m3og] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-17gxr0m3og] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-17gxr0m3og],
    .permit-list-panel[b-17gxr0m3og] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-17gxr0m3og] {
        align-items: flex-start;
    }

    .modal-icon[b-17gxr0m3og] {
        display: none;
    }

    .modal-footer[b-17gxr0m3og] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .permit-page[b-17gxr0m3og]  .save-button {
        min-width: 0;
    }

    .view-heading[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-17gxr0m3og],
    .permit-form-modal[b-17gxr0m3og],
    .permit-view-modal[b-17gxr0m3og],
    .delete-modal[b-17gxr0m3og] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.permit-page[b-17gxr0m3og] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.permit-hero[b-17gxr0m3og] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.permit-page[b-17gxr0m3og]  .hero-add-button,
.permit-page[b-17gxr0m3og]  .toolbar-add-button,
.permit-page[b-17gxr0m3og]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-17gxr0m3og] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-17gxr0m3og] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-17gxr0m3og] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-17gxr0m3og] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.permit-page[b-17gxr0m3og]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-17gxr0m3og] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-17gxr0m3og] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-17gxr0m3og] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-17gxr0m3og] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-17gxr0m3og] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-17gxr0m3og] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-17gxr0m3og] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-17gxr0m3og] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-17gxr0m3og] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-17gxr0m3og] {
    background: #b54d43;
}

.status-overview-card div[b-17gxr0m3og] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-17gxr0m3og] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-17gxr0m3og] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.permit-code-photo-cell[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.permit-photo-mini[b-17gxr0m3og] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.permit-photo-mini button[b-17gxr0m3og] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.permit-photo-mini img[b-17gxr0m3og] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.permit-code-photo-cell strong[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.permit-code-photo-cell small[b-17gxr0m3og] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-17gxr0m3og],
.applicant-cell[b-17gxr0m3og],
.status-document-cell[b-17gxr0m3og],
.officer-cell[b-17gxr0m3og],
.fee-cell[b-17gxr0m3og],
.due-cell[b-17gxr0m3og] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-17gxr0m3og] {
    min-width: 190px;
}

.project-cell strong[b-17gxr0m3og],
.applicant-cell strong[b-17gxr0m3og],
.officer-cell strong[b-17gxr0m3og],
.fee-cell strong[b-17gxr0m3og],
.due-cell strong[b-17gxr0m3og] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-17gxr0m3og],
.applicant-cell small[b-17gxr0m3og],
.officer-cell small[b-17gxr0m3og],
.due-cell small[b-17gxr0m3og] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-17gxr0m3og] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-17gxr0m3og] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-17gxr0m3og] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-17gxr0m3og] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-17gxr0m3og] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-17gxr0m3og],
.due-cell.due-soon small[b-17gxr0m3og] {
    color: #b14a40;
}

.permit-type-chip[b-17gxr0m3og],
.priority-chip[b-17gxr0m3og],
.document-chip[b-17gxr0m3og] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-17gxr0m3og],
.permit-type-chip.occupancy[b-17gxr0m3og] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-17gxr0m3og] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-17gxr0m3og],
.permit-type-chip.factory[b-17gxr0m3og] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-17gxr0m3og],
.permit-type-chip.market[b-17gxr0m3og] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-17gxr0m3og] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-17gxr0m3og] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-17gxr0m3og],
.permit-type-chip.event[b-17gxr0m3og] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-17gxr0m3og] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-17gxr0m3og] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-17gxr0m3og] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-17gxr0m3og] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-17gxr0m3og] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-17gxr0m3og] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-17gxr0m3og] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-17gxr0m3og] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-17gxr0m3og],
.status-chip.inspection[b-17gxr0m3og],
.status-chip.reviewing[b-17gxr0m3og] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-17gxr0m3og] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-17gxr0m3og] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-17gxr0m3og] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-17gxr0m3og] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-17gxr0m3og] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-17gxr0m3og] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-17gxr0m3og] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-17gxr0m3og] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-17gxr0m3og] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-17gxr0m3og] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-17gxr0m3og] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-photo-upload-grid[b-17gxr0m3og] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-17gxr0m3og] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-17gxr0m3og] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-17gxr0m3og] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-17gxr0m3og] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-17gxr0m3og] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-17gxr0m3og] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-17gxr0m3og] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-17gxr0m3og] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-17gxr0m3og] {
    font-size: 1.8rem;
}

.photo-empty strong[b-17gxr0m3og] {
    font-size: .48rem;
}

.photo-empty small[b-17gxr0m3og] {
    font-size: .38rem;
}

.photo-upload-actions[b-17gxr0m3og] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-17gxr0m3og],
.remove-photo-button[b-17gxr0m3og] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-17gxr0m3og] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-17gxr0m3og] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-17gxr0m3og] {
    margin-top: 12px;
}

.permit-form-modal[b-17gxr0m3og] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.permit-view-modal[b-17gxr0m3og] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-17gxr0m3og] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-identity-banner[b-17gxr0m3og] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.permit-identity-banner > div[b-17gxr0m3og] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.permit-identity-banner .permit-banner-icon[b-17gxr0m3og] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.permit-banner-icon .mud-icon-root[b-17gxr0m3og] {
    font-size: 1.7rem;
}

.permit-identity-banner small[b-17gxr0m3og] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.permit-identity-banner strong[b-17gxr0m3og] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-17gxr0m3og] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-17gxr0m3og] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-17gxr0m3og] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-17gxr0m3og] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-17gxr0m3og] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-17gxr0m3og] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-17gxr0m3og] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-17gxr0m3og] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.permit-location-panel[b-17gxr0m3og] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.permit-location-panel > span[b-17gxr0m3og] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.permit-location-panel small[b-17gxr0m3og] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.permit-location-panel h3[b-17gxr0m3og] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.permit-location-panel p[b-17gxr0m3og] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.permit-location-panel p em[b-17gxr0m3og] {
    font-style: normal;
}

.permit-location-panel b[b-17gxr0m3og] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.permit-location-panel a[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-note-grid[b-17gxr0m3og] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.permit-note-grid > div[b-17gxr0m3og] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.permit-note-grid .document-note[b-17gxr0m3og] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.permit-note-grid .decision-note[b-17gxr0m3og] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.permit-note-grid small[b-17gxr0m3og] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.permit-note-grid p[b-17gxr0m3og] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-17gxr0m3og] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-17gxr0m3og] {
    display: grid;
    gap: 10px;
}

.three-columns[b-17gxr0m3og] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-17gxr0m3og] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-17gxr0m3og] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-17gxr0m3og] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-17gxr0m3og] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-17gxr0m3og] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-17gxr0m3og] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-17gxr0m3og] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-17gxr0m3og] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-17gxr0m3og] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-17gxr0m3og] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-17gxr0m3og] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-17gxr0m3og] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-17gxr0m3og] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-17gxr0m3og] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-17gxr0m3og] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .permit-identity-banner[b-17gxr0m3og] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .permit-photo-upload-grid[b-17gxr0m3og],
    .three-columns[b-17gxr0m3og] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-17gxr0m3og] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .permit-photo-upload-grid[b-17gxr0m3og],
    .project-summary-grid[b-17gxr0m3og],
    .permit-note-grid[b-17gxr0m3og],
    .three-columns[b-17gxr0m3og] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .permit-location-panel[b-17gxr0m3og] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .permit-location-panel a[b-17gxr0m3og] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-17gxr0m3og] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-17gxr0m3og] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-17gxr0m3og],
    .permit-identity-banner[b-17gxr0m3og] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .permit-identity-banner .permit-banner-icon[b-17gxr0m3og] {
        min-height: 72px;
    }

    .view-toolbar[b-17gxr0m3og] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-17gxr0m3og] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-17gxr0m3og],
    .permit-page[b-17gxr0m3og]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   ALL PERMIT APPLICATIONS ADMIN PAGE
   ========================================================= */

.permit-hero[b-17gxr0m3og] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .24),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(44, 139, 116, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #174b45 0%,
            #103932 55%,
            #092620 100%) !important;
}

.permit-list-panel .list-toolbar[b-17gxr0m3og] {
    align-items: center;
}

.permit-list-panel .list-toolbar[b-17gxr0m3og]::after {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    padding: 0 10px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    content: "ADMIN MASTER LIST";

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .06em;
}

@media (max-width: 720px) {
    .permit-list-panel .list-toolbar[b-17gxr0m3og]::after {
        width: fit-content;
    }
}
/* /Components/Pages/02Specialized/01Construction/01PermitApplication/ContractorOperatorReport.razor.rz.scp.css */
.contractor-report-page[b-amni8dyy31] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.contractor-report-page[b-amni8dyy31]  .contractor-report-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.report-hero[b-amni8dyy31] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-amni8dyy31] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-amni8dyy31] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-amni8dyy31] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-amni8dyy31] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-amni8dyy31] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-amni8dyy31] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-amni8dyy31] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-amni8dyy31] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-amni8dyy31] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-amni8dyy31] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-amni8dyy31] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-amni8dyy31] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.contractor-report-page[b-amni8dyy31]  .hero-add-button,
.contractor-report-page[b-amni8dyy31]  .search-button,
.contractor-report-page[b-amni8dyy31]  .toolbar-add-button,
.contractor-report-page[b-amni8dyy31]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.contractor-report-page[b-amni8dyy31]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-amni8dyy31] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-amni8dyy31] {
    opacity: .55;
    cursor: not-allowed;
}

.contractor-report-page[b-amni8dyy31]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.contractor-report-page[b-amni8dyy31]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-amni8dyy31] {
    margin-top: 7px;
}

.summary-card[b-amni8dyy31] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-amni8dyy31] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-amni8dyy31] {
    color: #2c7da8;
}

.summary-card.approved[b-amni8dyy31] {
    color: #7658a7;
}

.summary-card.incomplete[b-amni8dyy31] {
    color: #c05b4e;
}

.summary-line[b-amni8dyy31] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-amni8dyy31] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-amni8dyy31] {
    min-width: 0;
}

.summary-card small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-amni8dyy31] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-amni8dyy31] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-amni8dyy31] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-amni8dyy31],
.report-list-panel[b-amni8dyy31] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-amni8dyy31],
.list-toolbar[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-amni8dyy31],
.panel-kicker[b-amni8dyy31] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-amni8dyy31],
.list-toolbar h2[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-amni8dyy31],
.list-toolbar p[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-amni8dyy31] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-amni8dyy31] {
    align-items: center;
}

.contractor-report-page[b-amni8dyy31]  .premium-field,
.contractor-report-page[b-amni8dyy31]  .form-field {
    width: 100%;
}

.contractor-report-page[b-amni8dyy31]  .premium-field .mud-input-outlined-border,
.contractor-report-page[b-amni8dyy31]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.contractor-report-page[b-amni8dyy31]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.contractor-report-page[b-amni8dyy31]  .sort-select {
    width: 160px;
}

.contractor-report-page[b-amni8dyy31]  .toolbar-add-button {
    min-height: 42px;
}

.contractor-report-page[b-amni8dyy31]  .contractor-report-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.contractor-report-page[b-amni8dyy31]  .contractor-report-table .mud-table-head {
    background: #eef6f2;
}

.contractor-report-page[b-amni8dyy31]  .contractor-report-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-amni8dyy31] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-amni8dyy31] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-amni8dyy31],
.view-avatar[b-amni8dyy31] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-amni8dyy31],
.view-avatar.female[b-amni8dyy31] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-amni8dyy31],
.view-avatar.other[b-amni8dyy31] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-amni8dyy31] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-amni8dyy31],
.person-name small[b-amni8dyy31] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-amni8dyy31] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-amni8dyy31] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-amni8dyy31] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-amni8dyy31] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-amni8dyy31],
.area-cell[b-amni8dyy31],
.date-cell[b-amni8dyy31] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-amni8dyy31] {
    gap: 3px;
}

.contact-cell span[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-amni8dyy31],
.date-cell strong[b-amni8dyy31] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-amni8dyy31],
.date-cell small[b-amni8dyy31] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-amni8dyy31],
.document-chip[b-amni8dyy31],
.status-chip[b-amni8dyy31] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-amni8dyy31] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-amni8dyy31] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-amni8dyy31] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-amni8dyy31] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-amni8dyy31] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-amni8dyy31] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-amni8dyy31] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-amni8dyy31] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-amni8dyy31] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-amni8dyy31] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-amni8dyy31] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-amni8dyy31] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.contractor-report-page[b-amni8dyy31]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.contractor-report-page[b-amni8dyy31]  .row-action.view {
    color: #2d79a2;
}

.contractor-report-page[b-amni8dyy31]  .row-action.edit {
    color: var(--theme-primary);
}

.contractor-report-page[b-amni8dyy31]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.contractor-report-page[b-amni8dyy31]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-amni8dyy31] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-amni8dyy31] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-amni8dyy31] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-amni8dyy31] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-amni8dyy31] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.report-form-modal[b-amni8dyy31],
.report-view-modal[b-amni8dyy31],
.delete-modal[b-amni8dyy31] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-amni8dyy31 .22s ease-out;
}

@keyframes modalAppear-b-amni8dyy31 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.report-form-modal[b-amni8dyy31] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-amni8dyy31] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-amni8dyy31] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-amni8dyy31] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-amni8dyy31] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-amni8dyy31] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-amni8dyy31] {
    margin-top: 24px;
}

.form-section-title > span[b-amni8dyy31] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-amni8dyy31] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-amni8dyy31] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-amni8dyy31] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-amni8dyy31] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-amni8dyy31] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.contractor-report-page[b-amni8dyy31]  .cancel-button,
.contractor-report-page[b-amni8dyy31]  .save-button,
.contractor-report-page[b-amni8dyy31]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.contractor-report-page[b-amni8dyy31]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.contractor-report-page[b-amni8dyy31]  .save-button {
    min-width: 170px;
}

.report-view-modal[b-amni8dyy31] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-amni8dyy31] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-amni8dyy31] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-amni8dyy31] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-amni8dyy31] {
    padding: 61px 24px 25px;
}

.view-heading[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-amni8dyy31] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-amni8dyy31] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-amni8dyy31] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-amni8dyy31] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-amni8dyy31],
.view-address small[b-amni8dyy31],
.view-note small[b-amni8dyy31] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-amni8dyy31] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-amni8dyy31] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-amni8dyy31] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-amni8dyy31] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-amni8dyy31] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-amni8dyy31] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-amni8dyy31] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-amni8dyy31] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-amni8dyy31] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-amni8dyy31] {
    color: #963b36;
}

.delete-warning[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-amni8dyy31] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.contractor-report-page[b-amni8dyy31]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .report-hero[b-amni8dyy31] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-amni8dyy31] {
        max-width: 570px;
    }

    .list-toolbar[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-amni8dyy31] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .contractor-report-page[b-amni8dyy31] {
        padding: 15px 12px 30px;
    }

    .report-hero[b-amni8dyy31] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-amni8dyy31] {
        font-size: 2.3rem;
    }

    .hero-meta[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-amni8dyy31] {
        width: 100%;
    }

    .filter-heading[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }

    .contractor-report-page[b-amni8dyy31]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-amni8dyy31] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-amni8dyy31] {
        align-items: end;
        padding: 0;
    }

    .report-form-modal[b-amni8dyy31],
    .report-view-modal[b-amni8dyy31] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-amni8dyy31] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-amni8dyy31] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-amni8dyy31],
    .report-list-panel[b-amni8dyy31] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-amni8dyy31] {
        align-items: flex-start;
    }

    .modal-icon[b-amni8dyy31] {
        display: none;
    }

    .modal-footer[b-amni8dyy31] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .contractor-report-page[b-amni8dyy31]  .save-button {
        min-width: 0;
    }

    .view-heading[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-amni8dyy31],
    .report-form-modal[b-amni8dyy31],
    .report-view-modal[b-amni8dyy31],
    .delete-modal[b-amni8dyy31] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.contractor-report-page[b-amni8dyy31] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.report-hero[b-amni8dyy31] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.contractor-report-page[b-amni8dyy31]  .hero-add-button,
.contractor-report-page[b-amni8dyy31]  .toolbar-add-button,
.contractor-report-page[b-amni8dyy31]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-amni8dyy31] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-amni8dyy31] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-amni8dyy31] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-amni8dyy31] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.contractor-report-page[b-amni8dyy31]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-amni8dyy31] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-amni8dyy31] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-amni8dyy31] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-amni8dyy31] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-amni8dyy31] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-amni8dyy31] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-amni8dyy31] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-amni8dyy31] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-amni8dyy31] {
    background: #b54d43;
}

.status-overview-card div[b-amni8dyy31] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-amni8dyy31] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-amni8dyy31] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.profile-code-photo-cell[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.profile-photo-mini[b-amni8dyy31] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.profile-photo-mini button[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.profile-photo-mini img[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.profile-code-photo-cell strong[b-amni8dyy31] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.profile-code-photo-cell small[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-amni8dyy31],
.applicant-cell[b-amni8dyy31],
.status-document-cell[b-amni8dyy31],
.officer-cell[b-amni8dyy31],
.fee-cell[b-amni8dyy31],
.due-cell[b-amni8dyy31] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-amni8dyy31] {
    min-width: 190px;
}

.project-cell strong[b-amni8dyy31],
.applicant-cell strong[b-amni8dyy31],
.officer-cell strong[b-amni8dyy31],
.fee-cell strong[b-amni8dyy31],
.due-cell strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-amni8dyy31],
.applicant-cell small[b-amni8dyy31],
.officer-cell small[b-amni8dyy31],
.due-cell small[b-amni8dyy31] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-amni8dyy31] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-amni8dyy31],
.due-cell.due-soon small[b-amni8dyy31] {
    color: #b14a40;
}

.permit-type-chip[b-amni8dyy31],
.priority-chip[b-amni8dyy31],
.document-chip[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-amni8dyy31],
.permit-type-chip.occupancy[b-amni8dyy31] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-amni8dyy31] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-amni8dyy31],
.permit-type-chip.factory[b-amni8dyy31] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-amni8dyy31],
.permit-type-chip.market[b-amni8dyy31] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-amni8dyy31] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-amni8dyy31] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-amni8dyy31],
.permit-type-chip.event[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-amni8dyy31] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-amni8dyy31] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-amni8dyy31] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-amni8dyy31] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-amni8dyy31] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-amni8dyy31] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-amni8dyy31],
.status-chip.inspection[b-amni8dyy31],
.status-chip.reviewing[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-amni8dyy31] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-amni8dyy31] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-amni8dyy31] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-amni8dyy31] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-amni8dyy31] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.approval-photo-upload-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-amni8dyy31] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-amni8dyy31] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-amni8dyy31] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-amni8dyy31] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-amni8dyy31] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-amni8dyy31] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-amni8dyy31] {
    font-size: 1.8rem;
}

.photo-empty strong[b-amni8dyy31] {
    font-size: .48rem;
}

.photo-empty small[b-amni8dyy31] {
    font-size: .38rem;
}

.photo-upload-actions[b-amni8dyy31] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-amni8dyy31],
.remove-photo-button[b-amni8dyy31] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-amni8dyy31] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-amni8dyy31] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-amni8dyy31] {
    margin-top: 12px;
}

.report-form-modal[b-amni8dyy31] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.report-view-modal[b-amni8dyy31] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-amni8dyy31] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.profile-identity-banner[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.profile-identity-banner > div[b-amni8dyy31] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.profile-banner-icon .mud-icon-root[b-amni8dyy31] {
    font-size: 1.7rem;
}

.profile-identity-banner small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.profile-identity-banner strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-amni8dyy31] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-amni8dyy31] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-amni8dyy31] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-amni8dyy31] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-amni8dyy31] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-amni8dyy31] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-amni8dyy31] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-amni8dyy31] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-amni8dyy31] {
    font-style: normal;
}

.approval-location-panel b[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-amni8dyy31] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-amni8dyy31] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-amni8dyy31] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-amni8dyy31] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-amni8dyy31] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-amni8dyy31] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-amni8dyy31] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-amni8dyy31] {
    display: grid;
    gap: 10px;
}

.three-columns[b-amni8dyy31] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-amni8dyy31] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-amni8dyy31] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-amni8dyy31] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-amni8dyy31] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-amni8dyy31] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-amni8dyy31] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-amni8dyy31] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-amni8dyy31] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-amni8dyy31] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-amni8dyy31] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-amni8dyy31] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-amni8dyy31] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-amni8dyy31] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .approval-photo-upload-grid[b-amni8dyy31],
    .three-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .approval-photo-upload-grid[b-amni8dyy31],
    .project-summary-grid[b-amni8dyy31],
    .inspection-note-grid[b-amni8dyy31],
    .three-columns[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-amni8dyy31] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-amni8dyy31] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-amni8dyy31] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-amni8dyy31] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-amni8dyy31],
    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
        min-height: 72px;
    }

    .view-toolbar[b-amni8dyy31] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-amni8dyy31] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-amni8dyy31],
    .contractor-report-page[b-amni8dyy31]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.contractor-report-page[b-amni8dyy31] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.report-hero[b-amni8dyy31] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-amni8dyy31] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-amni8dyy31] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-amni8dyy31] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-amni8dyy31] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.contractor-report-page[b-amni8dyy31]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-amni8dyy31] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-amni8dyy31] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-amni8dyy31] {
    background: #73569b;
}

.status-overview-card.completed > span[b-amni8dyy31] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-amni8dyy31] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-amni8dyy31] {
    background: #b54d43;
}

.profile-code-photo-cell[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.profile-photo-mini[b-amni8dyy31] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.profile-photo-mini button[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.profile-photo-mini img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-code-photo-cell strong[b-amni8dyy31] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.profile-code-photo-cell small[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-amni8dyy31],
.appointment-cell[b-amni8dyy31],
.team-cell[b-amni8dyy31],
.status-result-cell[b-amni8dyy31],
.applicant-cell[b-amni8dyy31],
.notification-cell[b-amni8dyy31] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-amni8dyy31] {
    min-width: 190px;
}

.project-cell strong[b-amni8dyy31],
.appointment-cell strong[b-amni8dyy31],
.team-cell strong[b-amni8dyy31],
.applicant-cell strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-amni8dyy31],
.appointment-cell small[b-amni8dyy31],
.team-cell small[b-amni8dyy31],
.applicant-cell small[b-amni8dyy31],
.notification-cell small[b-amni8dyy31] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-amni8dyy31],
.team-cell em[b-amni8dyy31],
.applicant-cell em[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-amni8dyy31],
.appointment-cell.overdue small[b-amni8dyy31] {
    color: #b0443b;
}

.status-result-cell[b-amni8dyy31] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-amni8dyy31] {
    align-items: flex-start;
}

.notification-cell > span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-amni8dyy31] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-amni8dyy31] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-amni8dyy31] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-amni8dyy31] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-amni8dyy31] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-amni8dyy31] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-amni8dyy31] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-amni8dyy31] {
    font-size: 2rem;
}

.source-priority[b-amni8dyy31] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-amni8dyy31] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-amni8dyy31] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-amni8dyy31] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-amni8dyy31] {
    padding: 10px;
}

.source-picker-content > small[b-amni8dyy31] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-amni8dyy31] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-amni8dyy31] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-amni8dyy31] {
    margin-bottom: 16px;
}

.locked-application-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-amni8dyy31] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-amni8dyy31] {
    font-size: 2.4rem;
}

.locked-application-content[b-amni8dyy31] {
    min-width: 0;
}

.locked-application-heading[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-amni8dyy31] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-amni8dyy31] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-amni8dyy31] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-amni8dyy31] {
    grid-column: span 2;
}

.locked-application-grid span[b-amni8dyy31] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-amni8dyy31],
.source-panel-actions button[b-amni8dyy31] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-amni8dyy31] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.approval-photo-upload-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.report-form-modal[b-amni8dyy31] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.report-view-modal[b-amni8dyy31] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.profile-identity-banner[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.profile-identity-banner > div[b-amni8dyy31] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.profile-banner-icon .mud-icon-root[b-amni8dyy31] {
    font-size: 1.7rem;
}

.profile-identity-banner small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.profile-identity-banner strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-amni8dyy31] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-amni8dyy31] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-amni8dyy31] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-amni8dyy31] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-amni8dyy31] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-amni8dyy31] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-amni8dyy31] {
    font-style: normal;
}

.approval-location-panel b[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-amni8dyy31] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-amni8dyy31] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-amni8dyy31] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-amni8dyy31] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-amni8dyy31] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-amni8dyy31] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-amni8dyy31] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-amni8dyy31] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-amni8dyy31] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-amni8dyy31] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-amni8dyy31] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-amni8dyy31] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-amni8dyy31] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-amni8dyy31] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-amni8dyy31] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-amni8dyy31] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-amni8dyy31] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-amni8dyy31] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-amni8dyy31] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-amni8dyy31],
    .five-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-amni8dyy31] {
        max-height: 310px;
    }

    .locked-application-grid[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-amni8dyy31],
    .five-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-amni8dyy31],
    .approval-photo-upload-grid[b-amni8dyy31],
    .inspection-note-grid[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-amni8dyy31],
    .five-columns[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-amni8dyy31] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-amni8dyy31] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .profile-identity-banner[b-amni8dyy31],
    .locked-application-grid[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-amni8dyy31] {
        grid-column: auto;
    }

    .locked-application-heading[b-amni8dyy31] {
        flex-direction: column;
    }

    .locked-application-badges[b-amni8dyy31] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.contractor-report-page[b-amni8dyy31] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.report-hero[b-amni8dyy31] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-amni8dyy31] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-amni8dyy31] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-amni8dyy31] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-amni8dyy31] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-amni8dyy31] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-amni8dyy31] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-amni8dyy31] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.contractor-report-page[b-amni8dyy31]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-amni8dyy31] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-amni8dyy31] {
    background: #73569b;
}

.status-overview-card.revision > span[b-amni8dyy31] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-amni8dyy31] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-amni8dyy31] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-amni8dyy31] {
    background: #9f4139;
}

.source-note[b-amni8dyy31] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.profile-code-photo-cell[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.profile-photo-mini[b-amni8dyy31] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.profile-photo-mini button[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.profile-photo-mini img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-code-photo-cell strong[b-amni8dyy31] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.profile-code-photo-cell small[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-amni8dyy31],
.inspection-result-cell[b-amni8dyy31],
.status-recommendation-cell[b-amni8dyy31],
.reviewer-cell[b-amni8dyy31],
.decision-cell[b-amni8dyy31],
.permit-fee-cell[b-amni8dyy31] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-amni8dyy31] {
    min-width: 190px;
}

.project-cell strong[b-amni8dyy31],
.inspection-result-cell strong[b-amni8dyy31],
.reviewer-cell strong[b-amni8dyy31],
.decision-cell strong[b-amni8dyy31],
.permit-fee-cell strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-amni8dyy31],
.inspection-result-cell small[b-amni8dyy31],
.reviewer-cell small[b-amni8dyy31],
.decision-cell small[b-amni8dyy31],
.permit-fee-cell small[b-amni8dyy31] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-amni8dyy31] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-amni8dyy31] {
    gap: 4px;
}

.decision-cell.overdue strong[b-amni8dyy31],
.decision-cell.overdue small[b-amni8dyy31] {
    color: #ad4037;
}

.permit-fee-cell > span[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-amni8dyy31],
.recommendation-chip[b-amni8dyy31],
.final-decision-chip[b-amni8dyy31],
.inspection-result-chip[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-amni8dyy31] {
    gap: 5px;
}

.review-status-chip > i[b-amni8dyy31] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-amni8dyy31] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-amni8dyy31] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-amni8dyy31] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-amni8dyy31] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-amni8dyy31] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-amni8dyy31] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-amni8dyy31] {
    font-size: 2.4rem;
}

.locked-source-heading[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-amni8dyy31] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-amni8dyy31] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-amni8dyy31] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-amni8dyy31] {
    grid-column: span 2;
}

.locked-source-grid span[b-amni8dyy31] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.approval-photo-upload-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.report-form-modal[b-amni8dyy31] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.report-view-modal[b-amni8dyy31] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.profile-identity-banner[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.profile-identity-banner > div[b-amni8dyy31] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.profile-banner-icon .mud-icon-root[b-amni8dyy31] {
    font-size: 1.7rem;
}

.profile-identity-banner small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.profile-identity-banner strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-amni8dyy31] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-amni8dyy31] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-amni8dyy31] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-amni8dyy31] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-amni8dyy31] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-amni8dyy31] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-amni8dyy31] {
    font-style: normal;
}

.approval-location-panel b[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-amni8dyy31] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-amni8dyy31] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-amni8dyy31] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-amni8dyy31] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-amni8dyy31] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-amni8dyy31] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-amni8dyy31],
.condition-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-amni8dyy31],
.condition-grid > div[b-amni8dyy31] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-amni8dyy31] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-amni8dyy31] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-amni8dyy31] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-amni8dyy31] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-amni8dyy31] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-amni8dyy31] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-amni8dyy31] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-amni8dyy31],
.condition-grid small[b-amni8dyy31] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-amni8dyy31],
.condition-grid p[b-amni8dyy31] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-amni8dyy31] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-amni8dyy31] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-amni8dyy31] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-amni8dyy31] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-amni8dyy31] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-amni8dyy31],
    .six-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-amni8dyy31] {
        max-height: 320px;
    }

    .locked-source-grid[b-amni8dyy31],
    .decision-summary-grid[b-amni8dyy31],
    .six-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .approval-photo-upload-grid[b-amni8dyy31],
    .opinion-grid[b-amni8dyy31],
    .condition-grid[b-amni8dyy31],
    .decision-summary-grid[b-amni8dyy31],
    .six-columns[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-amni8dyy31] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-amni8dyy31] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .profile-identity-banner[b-amni8dyy31],
    .locked-source-grid[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-amni8dyy31] {
        grid-column: auto;
    }

    .locked-source-heading[b-amni8dyy31] {
        flex-direction: column;
    }

    .locked-source-badges[b-amni8dyy31] {
        justify-content: flex-start;
    }
}


/* =========================================================
   CONTRACTOR & OPERATOR REPORT PREMIUM EXTENSIONS
   ========================================================= */

.contractor-report-page[b-amni8dyy31] {
    --report-green: #0b7358;
    --report-deep: #073d31;
    --report-gold: var(--theme-accent);
    --report-blue: #2f789f;
    --report-purple: #73569b;
    --report-red: #b54d43;
}

.report-hero[b-amni8dyy31] {
    background:
        radial-gradient(
            circle at 87% 4%,
            rgba(199, 163, 93, .25),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #124f43 0%,
            #0a3b31 56%,
            #05271f 100%) !important;
}

.hero-export-button[b-amni8dyy31],
.toolbar-export-button[b-amni8dyy31],
.view-export-button[b-amni8dyy31] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 12px;
    border: 1px solid rgba(242, 217, 153, .25);
    border-radius: 11px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            rgba(199, 163, 93, .94),
            rgba(153, 116, 49, .96));

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;

    box-shadow:
        0 10px 23px rgba(73, 50, 13, .18);
}

.toolbar-export-button[b-amni8dyy31] {
    min-height: 36px;

    color: #0b7358;
    border-color: rgba(11, 115, 88, .14);
    background: #edf7f3;

    box-shadow: none;
}

.view-export-button[b-amni8dyy31] {
    color: #987634;
    border-color: rgba(199, 163, 93, .22);
    background: #fff9eb;

    box-shadow: none;
}

.summary-card.total[b-amni8dyy31] {
    --summary-accent: #0b7358;
    --summary-soft: #e7f5ef;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.project[b-amni8dyy31] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.value[b-amni8dyy31] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.compliance[b-amni8dyy31] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.contractor-report-page[b-amni8dyy31]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-amni8dyy31] {
    background: #397a4c;
}

.status-overview-card.expiring > span[b-amni8dyy31] {
    background: #b27a25;
}

.status-overview-card.expired > span[b-amni8dyy31] {
    background: #7d665f;
}

.status-overview-card.pending > span[b-amni8dyy31] {
    background: #73569b;
}

.status-overview-card.suspended > span[b-amni8dyy31] {
    background: #b54d43;
}

.status-overview-card.risk > span[b-amni8dyy31] {
    background: #9f4139;
}

.report-insight-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 14px;
    margin-top: 15px;
}

.insight-panel[b-amni8dyy31] {
    padding: 15px;
    border: 1px solid rgba(11, 115, 88, .09);
    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 18rem),
        #fff;

    box-shadow:
        0 14px 35px rgba(5, 62, 46, .065);
}

.insight-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-amni8dyy31] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 700;
}

.distribution-list[b-amni8dyy31] {
    display: grid;
    gap: 12px;

    margin-top: 15px;
}

.distribution-item[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        minmax(130px, 180px)
        minmax(0, 1fr)
        55px;

    align-items: center;
    gap: 10px;
}

.distribution-item > div:first-child[b-amni8dyy31] {
    display: flex;
    min-width: 0;

    flex-direction: column;
}

.distribution-item span[b-amni8dyy31] {
    color: #52655d;
    font-size: .48rem;
}

.distribution-item strong[b-amni8dyy31] {
    margin-top: 3px;

    color: var(--theme-ink);
    font-size: .55rem;
}

.distribution-track[b-amni8dyy31] {
    height: 9px;
    overflow: hidden;

    border-radius: 999px;

    background: #edf2ef;
}

.distribution-track i[b-amni8dyy31] {
    display: block;
    height: 100%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            #0b7358,
            #41a685);
}

.distribution-item > small[b-amni8dyy31] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    text-align: right;
}

.watch-list[b-amni8dyy31] {
    display: grid;
    gap: 7px;

    margin-top: 13px;
}

.watch-item[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        44px
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: 9px;

    width: 100%;
    min-height: 59px;

    padding: 7px;
    border: 1px solid rgba(11, 115, 88, .075);
    border-radius: 12px;

    background: #f9fbfa;

    text-align: left;
    cursor: pointer;

    transition:
        transform .16s ease,
        border-color .16s ease;
}

.watch-item:hover[b-amni8dyy31] {
    transform: translateX(2px);
    border-color: rgba(11, 115, 88, .20);
}

.watch-item.high[b-amni8dyy31] {
    border-color: rgba(181, 77, 67, .14);
    background: #fff8f6;
}

.watch-item.medium[b-amni8dyy31] {
    border-color: rgba(178, 122, 37, .14);
    background: #fffbf4;
}

.watch-avatar[b-amni8dyy31] {
    display: grid;
    width: 44px;
    height: 44px;
    overflow: hidden;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.watch-avatar img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.watch-item > div[b-amni8dyy31] {
    display: flex;
    min-width: 0;

    flex-direction: column;
}

.watch-item strong[b-amni8dyy31] {
    overflow: hidden;

    color: #384b43;
    font-size: .50rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.watch-item small[b-amni8dyy31] {
    margin-top: 3px;
    overflow: hidden;

    color: #83918c;
    font-size: .40rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.watch-item em[b-amni8dyy31] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .38rem;
    font-style: normal;
    font-weight: 700;
}

.watch-item.high em[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.watch-item.medium em[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.profile-code-photo-cell[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 150px;
    align-items: center;
    gap: 8px;
}

.profile-photo-mini[b-amni8dyy31] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.profile-photo-mini button[b-amni8dyy31] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.profile-photo-mini img[b-amni8dyy31] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-code-photo-cell strong[b-amni8dyy31] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.profile-code-photo-cell small[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #7b8b85;
    font-size: .40rem;
}

.business-cell[b-amni8dyy31],
.permit-project-cell[b-amni8dyy31],
.performance-cell[b-amni8dyy31],
.status-risk-cell[b-amni8dyy31],
.expiry-contact-cell[b-amni8dyy31] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.business-cell[b-amni8dyy31],
.permit-project-cell[b-amni8dyy31] {
    min-width: 185px;
}

.business-cell strong[b-amni8dyy31],
.permit-project-cell strong[b-amni8dyy31],
.performance-cell strong[b-amni8dyy31],
.expiry-contact-cell strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.business-cell small[b-amni8dyy31],
.permit-project-cell small[b-amni8dyy31],
.performance-cell small[b-amni8dyy31],
.expiry-contact-cell small[b-amni8dyy31] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.business-cell em[b-amni8dyy31],
.performance-cell em[b-amni8dyy31],
.expiry-contact-cell em[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.expiry-contact-cell.expired strong[b-amni8dyy31],
.expiry-contact-cell.expired small[b-amni8dyy31] {
    color: #ad4037;
}

.party-chip[b-amni8dyy31],
.risk-chip[b-amni8dyy31],
.inspection-result-chip[b-amni8dyy31],
.decision-chip[b-amni8dyy31],
.verified-chip[b-amni8dyy31] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    gap: 4px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.party-chip.contractor[b-amni8dyy31] {
    color: #0b7358;
    background: #e7f5ef;
}

.party-chip.operator[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.party-chip.both[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.risk-chip.low[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.risk-chip.medium[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.risk-chip.high[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.inspection-result-chip.pass[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.decision-chip.approved[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-chip.conditional-approved[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.decision-chip.pending[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.decision-chip.returned[b-amni8dyy31] {
    color: #a5652b;
    background: #f8ecdd;
}

.decision-chip.rejected[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.verified-chip[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.active[b-amni8dyy31] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.expiring[b-amni8dyy31] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.expired[b-amni8dyy31] {
    color: #775f59;
    background: #f0e9e7;
}

.status-chip.pending-review[b-amni8dyy31] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.suspended[b-amni8dyy31] {
    color: #ad4037;
    background: #fff0ee;
}

.status-risk-cell[b-amni8dyy31] {
    align-items: flex-start;
    gap: 5px;
}

.score-cell[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 160px;
    align-items: center;
    gap: 8px;
}

.score-cell > div:last-child[b-amni8dyy31] {
    display: flex;
    min-width: 0;

    flex-direction: column;
    align-items: flex-start;
}

.score-cell small[b-amni8dyy31] {
    margin-top: 5px;

    color: #83918c;
    font-size: .39rem;
    line-height: 1.45;
}

.score-ring[b-amni8dyy31],
.compliance-score-large[b-amni8dyy31] {
    --score: 0;

    position: relative;

    display: grid;
    width: 50px;
    height: 50px;

    place-items: center;
    border-radius: 50%;

    background:
        radial-gradient(
            circle at center,
            #fff 57%,
            transparent 58%),
        conic-gradient(
            #0b7358 calc(var(--score) * 1%),
            #e4ece8 0);
}

.score-ring[b-amni8dyy31]::after,
.compliance-score-large[b-amni8dyy31]::after {
    position: absolute;
    inset: 5px;

    border-radius: 50%;
    border: 1px solid rgba(11, 115, 88, .08);

    content: "";
}

.score-ring strong[b-amni8dyy31] {
    z-index: 1;

    color: var(--theme-ink);
    font-size: .56rem;
}

.row-map-action[b-amni8dyy31] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

.report-view-modal[b-amni8dyy31] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.profile-identity-banner[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.profile-identity-banner > div[b-amni8dyy31] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.profile-banner-icon .mud-icon-root[b-amni8dyy31] {
    font-size: 1.7rem;
}

.profile-identity-banner small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.profile-identity-banner strong[b-amni8dyy31] {
    margin-top: 4px;

    color: #355047;
    font-size: .52rem;
    line-height: 1.45;
    text-align: center;
}

.profile-summary-panel[b-amni8dyy31] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.profile-summary-heading[b-amni8dyy31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.profile-summary-heading small[b-amni8dyy31] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.profile-summary-heading h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.profile-summary-heading > span[b-amni8dyy31] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.profile-summary-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.profile-summary-grid > div[b-amni8dyy31] {
    min-height: 96px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.profile-summary-grid span[b-amni8dyy31] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.profile-summary-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .57rem;
}

.profile-summary-grid p[b-amni8dyy31] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .48rem;
    line-height: 1.65;
}

.permit-source-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(115, 86, 155, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .10),
            transparent 18rem),
        #faf8fc;
}

.permit-source-panel > span[b-amni8dyy31] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #8465ad,
            #5d437e);

    box-shadow:
        0 10px 22px rgba(115, 86, 155, .20);
}

.permit-source-panel small[b-amni8dyy31] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.permit-source-panel h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.permit-source-panel p[b-amni8dyy31] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-badges[b-amni8dyy31] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.metric-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.metric-grid article[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);

    min-height: 82px;
    align-items: center;
    gap: 9px;

    padding: 10px;
    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 13px;

    background: #fff;
}

.metric-grid article > span[b-amni8dyy31] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #e7f5ef;
}

.metric-grid article:nth-child(2) > span[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.metric-grid article:nth-child(3) > span[b-amni8dyy31] {
    color: #397a4c;
    background: #e7f5ec;
}

.metric-grid article:nth-child(4) > span[b-amni8dyy31] {
    color: #987634;
    background: #fff4df;
}

.metric-grid div[b-amni8dyy31] {
    display: flex;
    flex-direction: column;
}

.metric-grid small[b-amni8dyy31] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.metric-grid strong[b-amni8dyy31] {
    margin-top: 3px;

    color: #34483f;
    font-size: .70rem;
}

.metric-grid em[b-amni8dyy31] {
    color: #72837c;
    font-size: .38rem;
    font-style: normal;
}

.compliance-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns: 145px minmax(0, 1fr);

    gap: 18px;
    align-items: center;

    margin-top: 14px;
    padding: 16px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(11, 115, 88, .09),
            transparent 15rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.compliance-score-large[b-amni8dyy31] {
    width: 128px;
    height: 128px;

    justify-self: center;
}

.compliance-score-large strong[b-amni8dyy31] {
    z-index: 1;

    color: var(--theme-ink);
    font-size: 1.05rem;
}

.compliance-score-large small[b-amni8dyy31] {
    z-index: 1;

    margin-top: -25px;

    color: #82918b;
    font-size: .40rem;
}

.section-title-row[b-amni8dyy31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.section-title-row small[b-amni8dyy31] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.section-title-row h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.compliance-stat-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.compliance-stat-grid > div[b-amni8dyy31] {
    min-height: 60px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .07);
    border-radius: 10px;

    background: #fff;
}

.compliance-stat-grid span[b-amni8dyy31] {
    display: block;

    color: #87958f;
    font-size: .39rem;
}

.compliance-stat-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #354940;
    font-size: .63rem;
}

.compliance-track[b-amni8dyy31] {
    height: 8px;
    overflow: hidden;

    margin-top: 12px;
    border-radius: 999px;

    background: #e4ece8;
}

.compliance-track i[b-amni8dyy31] {
    display: block;
    height: 100%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            #0b7358,
            #54ad8e);
}

.compliance-content > p[b-amni8dyy31] {
    margin: 10px 0 0;

    color: #60746c;
    font-size: .49rem;
    line-height: 1.7;
}

.expiry-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.expiry-grid > div[b-amni8dyy31] {
    min-height: 92px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.expiry-grid > div.expiring[b-amni8dyy31] {
    border-color: rgba(178, 122, 37, .14);
    background: #fffbf4;
}

.expiry-grid > div.expired[b-amni8dyy31] {
    border-color: rgba(181, 77, 67, .14);
    background: #fff7f5;
}

.expiry-grid span[b-amni8dyy31] {
    color: #87958f;
    font-size: .40rem;
}

.expiry-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 6px;

    color: #354940;
    font-size: .57rem;
}

.expiry-grid small[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #687a72;
    font-size: .42rem;
}

.expiry-grid > div.expiring strong[b-amni8dyy31],
.expiry-grid > div.expiring small[b-amni8dyy31] {
    color: #9d671c;
}

.expiry-grid > div.expired strong[b-amni8dyy31],
.expiry-grid > div.expired small[b-amni8dyy31] {
    color: #ad4037;
}

.location-panel[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.location-panel > span[b-amni8dyy31] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.location-panel small[b-amni8dyy31] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.location-panel h3[b-amni8dyy31] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.location-panel p[b-amni8dyy31] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.location-panel b[b-amni8dyy31] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.location-panel a[b-amni8dyy31] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.report-info-grid[b-amni8dyy31] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.report-info-grid > div[b-amni8dyy31] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(11, 115, 88, .07);
    border-radius: 10px;

    background: #fff;
}

.report-info-grid span[b-amni8dyy31] {
    display: block;

    color: #87958f;
    font-size: .40rem;
}

.report-info-grid strong[b-amni8dyy31] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
}

.four-columns[b-amni8dyy31] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.logo > span[b-amni8dyy31] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.business > span[b-amni8dyy31] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.project > span[b-amni8dyy31] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.permit > span[b-amni8dyy31] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .metric-grid[b-amni8dyy31],
    .expiry-grid[b-amni8dyy31],
    .report-info-grid[b-amni8dyy31],
    .four-columns[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .report-insight-grid[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .compliance-panel[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .compliance-score-large[b-amni8dyy31] {
        justify-self: center;
    }
}

@media (max-width: 780px) {
    .profile-summary-grid[b-amni8dyy31],
    .metric-grid[b-amni8dyy31],
    .expiry-grid[b-amni8dyy31],
    .report-info-grid[b-amni8dyy31],
    .four-columns[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .compliance-stat-grid[b-amni8dyy31] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .location-panel[b-amni8dyy31] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .location-panel a[b-amni8dyy31] {
        grid-column: 1 / -1;
    }

    .distribution-item[b-amni8dyy31] {
        grid-template-columns:
            minmax(110px, 145px)
            minmax(0, 1fr)
            45px;
    }
}

@media (max-width: 560px) {
    .profile-identity-banner[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .profile-identity-banner .profile-banner-icon[b-amni8dyy31] {
        min-height: 72px;
    }

    .compliance-stat-grid[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .distribution-item[b-amni8dyy31] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .distribution-item > small[b-amni8dyy31] {
        text-align: left;
    }
}
/* /Components/Pages/02Specialized/01Construction/01PermitApplication/PermitApplications.razor.rz.scp.css */
.permit-page[b-51h1btw2lp] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.permit-page[b-51h1btw2lp]  .permit-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.permit-hero[b-51h1btw2lp] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-51h1btw2lp] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-51h1btw2lp] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-51h1btw2lp] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-51h1btw2lp] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-51h1btw2lp] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-51h1btw2lp] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-51h1btw2lp] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-51h1btw2lp] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-51h1btw2lp] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-51h1btw2lp] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-51h1btw2lp] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-51h1btw2lp] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-51h1btw2lp] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-51h1btw2lp] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.permit-page[b-51h1btw2lp]  .hero-add-button,
.permit-page[b-51h1btw2lp]  .search-button,
.permit-page[b-51h1btw2lp]  .toolbar-add-button,
.permit-page[b-51h1btw2lp]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.permit-page[b-51h1btw2lp]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-51h1btw2lp] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-51h1btw2lp] {
    opacity: .55;
    cursor: not-allowed;
}

.permit-page[b-51h1btw2lp]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.permit-page[b-51h1btw2lp]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-51h1btw2lp] {
    margin-top: 7px;
}

.summary-card[b-51h1btw2lp] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-51h1btw2lp] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-51h1btw2lp] {
    color: #2c7da8;
}

.summary-card.approved[b-51h1btw2lp] {
    color: #7658a7;
}

.summary-card.incomplete[b-51h1btw2lp] {
    color: #c05b4e;
}

.summary-line[b-51h1btw2lp] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-51h1btw2lp] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-51h1btw2lp] {
    min-width: 0;
}

.summary-card small[b-51h1btw2lp] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-51h1btw2lp] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-51h1btw2lp] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-51h1btw2lp] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-51h1btw2lp] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-51h1btw2lp],
.permit-list-panel[b-51h1btw2lp] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-51h1btw2lp],
.list-toolbar[b-51h1btw2lp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-51h1btw2lp],
.panel-kicker[b-51h1btw2lp] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-51h1btw2lp],
.list-toolbar h2[b-51h1btw2lp] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-51h1btw2lp],
.list-toolbar p[b-51h1btw2lp] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-51h1btw2lp] {
    align-items: center;
}

.permit-page[b-51h1btw2lp]  .premium-field,
.permit-page[b-51h1btw2lp]  .form-field {
    width: 100%;
}

.permit-page[b-51h1btw2lp]  .premium-field .mud-input-outlined-border,
.permit-page[b-51h1btw2lp]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.permit-page[b-51h1btw2lp]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.permit-page[b-51h1btw2lp]  .sort-select {
    width: 160px;
}

.permit-page[b-51h1btw2lp]  .toolbar-add-button {
    min-height: 42px;
}

.permit-page[b-51h1btw2lp]  .permit-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.permit-page[b-51h1btw2lp]  .permit-table .mud-table-head {
    background: #eef6f2;
}

.permit-page[b-51h1btw2lp]  .permit-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-51h1btw2lp] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-51h1btw2lp],
.view-avatar[b-51h1btw2lp] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-51h1btw2lp],
.view-avatar.female[b-51h1btw2lp] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-51h1btw2lp],
.view-avatar.other[b-51h1btw2lp] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-51h1btw2lp] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-51h1btw2lp],
.person-name small[b-51h1btw2lp] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-51h1btw2lp] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-51h1btw2lp] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-51h1btw2lp] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-51h1btw2lp] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-51h1btw2lp],
.area-cell[b-51h1btw2lp],
.date-cell[b-51h1btw2lp] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-51h1btw2lp] {
    gap: 3px;
}

.contact-cell span[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-51h1btw2lp],
.date-cell strong[b-51h1btw2lp] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-51h1btw2lp],
.date-cell small[b-51h1btw2lp] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-51h1btw2lp],
.document-chip[b-51h1btw2lp],
.status-chip[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-51h1btw2lp] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-51h1btw2lp] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-51h1btw2lp] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-51h1btw2lp] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-51h1btw2lp] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-51h1btw2lp] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-51h1btw2lp] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-51h1btw2lp] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-51h1btw2lp] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-51h1btw2lp] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-51h1btw2lp] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-51h1btw2lp] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.permit-page[b-51h1btw2lp]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.permit-page[b-51h1btw2lp]  .row-action.view {
    color: #2d79a2;
}

.permit-page[b-51h1btw2lp]  .row-action.edit {
    color: var(--theme-primary);
}

.permit-page[b-51h1btw2lp]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.permit-page[b-51h1btw2lp]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-51h1btw2lp] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-51h1btw2lp] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-51h1btw2lp] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-51h1btw2lp] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-51h1btw2lp] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.permit-form-modal[b-51h1btw2lp],
.permit-view-modal[b-51h1btw2lp],
.delete-modal[b-51h1btw2lp] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-51h1btw2lp .22s ease-out;
}

@keyframes modalAppear-b-51h1btw2lp {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.permit-form-modal[b-51h1btw2lp] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-51h1btw2lp] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-51h1btw2lp] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-51h1btw2lp] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-51h1btw2lp] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-51h1btw2lp] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-51h1btw2lp] {
    margin-top: 24px;
}

.form-section-title > span[b-51h1btw2lp] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-51h1btw2lp] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-51h1btw2lp] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-51h1btw2lp] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-51h1btw2lp] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-51h1btw2lp] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.permit-page[b-51h1btw2lp]  .cancel-button,
.permit-page[b-51h1btw2lp]  .save-button,
.permit-page[b-51h1btw2lp]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.permit-page[b-51h1btw2lp]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.permit-page[b-51h1btw2lp]  .save-button {
    min-width: 170px;
}

.permit-view-modal[b-51h1btw2lp] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-51h1btw2lp] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-51h1btw2lp] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-51h1btw2lp] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-51h1btw2lp] {
    padding: 61px 24px 25px;
}

.view-heading[b-51h1btw2lp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-51h1btw2lp] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-51h1btw2lp] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-51h1btw2lp] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-51h1btw2lp] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-51h1btw2lp] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-51h1btw2lp],
.view-address small[b-51h1btw2lp],
.view-note small[b-51h1btw2lp] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-51h1btw2lp] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-51h1btw2lp] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-51h1btw2lp] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-51h1btw2lp] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-51h1btw2lp] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-51h1btw2lp] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-51h1btw2lp] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-51h1btw2lp] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-51h1btw2lp] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-51h1btw2lp] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-51h1btw2lp] {
    color: #963b36;
}

.delete-warning[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.permit-page[b-51h1btw2lp]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .permit-hero[b-51h1btw2lp] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-51h1btw2lp] {
        max-width: 570px;
    }

    .list-toolbar[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-51h1btw2lp] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .permit-page[b-51h1btw2lp] {
        padding: 15px 12px 30px;
    }

    .permit-hero[b-51h1btw2lp] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-51h1btw2lp] {
        font-size: 2.3rem;
    }

    .hero-meta[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-51h1btw2lp] {
        width: 100%;
    }

    .filter-heading[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }

    .permit-page[b-51h1btw2lp]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-51h1btw2lp] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-51h1btw2lp] {
        align-items: end;
        padding: 0;
    }

    .permit-form-modal[b-51h1btw2lp],
    .permit-view-modal[b-51h1btw2lp] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-51h1btw2lp] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-51h1btw2lp] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-51h1btw2lp],
    .permit-list-panel[b-51h1btw2lp] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-51h1btw2lp] {
        align-items: flex-start;
    }

    .modal-icon[b-51h1btw2lp] {
        display: none;
    }

    .modal-footer[b-51h1btw2lp] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .permit-page[b-51h1btw2lp]  .save-button {
        min-width: 0;
    }

    .view-heading[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-51h1btw2lp],
    .permit-form-modal[b-51h1btw2lp],
    .permit-view-modal[b-51h1btw2lp],
    .delete-modal[b-51h1btw2lp] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.permit-page[b-51h1btw2lp] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.permit-hero[b-51h1btw2lp] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.permit-page[b-51h1btw2lp]  .hero-add-button,
.permit-page[b-51h1btw2lp]  .toolbar-add-button,
.permit-page[b-51h1btw2lp]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-51h1btw2lp] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-51h1btw2lp] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-51h1btw2lp] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-51h1btw2lp] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.permit-page[b-51h1btw2lp]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-51h1btw2lp] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-51h1btw2lp] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-51h1btw2lp] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-51h1btw2lp] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-51h1btw2lp] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-51h1btw2lp] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-51h1btw2lp] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-51h1btw2lp] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-51h1btw2lp] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-51h1btw2lp] {
    background: #b54d43;
}

.status-overview-card div[b-51h1btw2lp] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-51h1btw2lp] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-51h1btw2lp] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.permit-code-photo-cell[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.permit-photo-mini[b-51h1btw2lp] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.permit-photo-mini button[b-51h1btw2lp] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.permit-photo-mini img[b-51h1btw2lp] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.permit-code-photo-cell strong[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.permit-code-photo-cell small[b-51h1btw2lp] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-51h1btw2lp],
.applicant-cell[b-51h1btw2lp],
.status-document-cell[b-51h1btw2lp],
.officer-cell[b-51h1btw2lp],
.fee-cell[b-51h1btw2lp],
.due-cell[b-51h1btw2lp] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-51h1btw2lp] {
    min-width: 190px;
}

.project-cell strong[b-51h1btw2lp],
.applicant-cell strong[b-51h1btw2lp],
.officer-cell strong[b-51h1btw2lp],
.fee-cell strong[b-51h1btw2lp],
.due-cell strong[b-51h1btw2lp] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-51h1btw2lp],
.applicant-cell small[b-51h1btw2lp],
.officer-cell small[b-51h1btw2lp],
.due-cell small[b-51h1btw2lp] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-51h1btw2lp] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-51h1btw2lp] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-51h1btw2lp] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-51h1btw2lp] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-51h1btw2lp] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-51h1btw2lp],
.due-cell.due-soon small[b-51h1btw2lp] {
    color: #b14a40;
}

.permit-type-chip[b-51h1btw2lp],
.priority-chip[b-51h1btw2lp],
.document-chip[b-51h1btw2lp] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-51h1btw2lp],
.permit-type-chip.occupancy[b-51h1btw2lp] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-51h1btw2lp] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-51h1btw2lp],
.permit-type-chip.factory[b-51h1btw2lp] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-51h1btw2lp],
.permit-type-chip.market[b-51h1btw2lp] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-51h1btw2lp] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-51h1btw2lp] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-51h1btw2lp],
.permit-type-chip.event[b-51h1btw2lp] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-51h1btw2lp] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-51h1btw2lp] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-51h1btw2lp] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-51h1btw2lp] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-51h1btw2lp] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-51h1btw2lp] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-51h1btw2lp] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-51h1btw2lp] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-51h1btw2lp],
.status-chip.inspection[b-51h1btw2lp],
.status-chip.reviewing[b-51h1btw2lp] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-51h1btw2lp] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-51h1btw2lp] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-51h1btw2lp] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-51h1btw2lp] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-51h1btw2lp] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-51h1btw2lp] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-51h1btw2lp] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-51h1btw2lp] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-51h1btw2lp] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-51h1btw2lp] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-51h1btw2lp] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-photo-upload-grid[b-51h1btw2lp] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-51h1btw2lp] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-51h1btw2lp] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-51h1btw2lp] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-51h1btw2lp] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-51h1btw2lp] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-51h1btw2lp] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-51h1btw2lp] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-51h1btw2lp] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-51h1btw2lp] {
    font-size: 1.8rem;
}

.photo-empty strong[b-51h1btw2lp] {
    font-size: .48rem;
}

.photo-empty small[b-51h1btw2lp] {
    font-size: .38rem;
}

.photo-upload-actions[b-51h1btw2lp] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-51h1btw2lp],
.remove-photo-button[b-51h1btw2lp] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-51h1btw2lp] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-51h1btw2lp] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-51h1btw2lp] {
    margin-top: 12px;
}

.permit-form-modal[b-51h1btw2lp] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.permit-view-modal[b-51h1btw2lp] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-51h1btw2lp] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-identity-banner[b-51h1btw2lp] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.permit-identity-banner > div[b-51h1btw2lp] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.permit-identity-banner .permit-banner-icon[b-51h1btw2lp] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.permit-banner-icon .mud-icon-root[b-51h1btw2lp] {
    font-size: 1.7rem;
}

.permit-identity-banner small[b-51h1btw2lp] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.permit-identity-banner strong[b-51h1btw2lp] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-51h1btw2lp] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-51h1btw2lp] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-51h1btw2lp] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-51h1btw2lp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-51h1btw2lp] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-51h1btw2lp] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-51h1btw2lp] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-51h1btw2lp] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.permit-location-panel[b-51h1btw2lp] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.permit-location-panel > span[b-51h1btw2lp] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.permit-location-panel small[b-51h1btw2lp] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.permit-location-panel h3[b-51h1btw2lp] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.permit-location-panel p[b-51h1btw2lp] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.permit-location-panel p em[b-51h1btw2lp] {
    font-style: normal;
}

.permit-location-panel b[b-51h1btw2lp] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.permit-location-panel a[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.permit-note-grid[b-51h1btw2lp] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.permit-note-grid > div[b-51h1btw2lp] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.permit-note-grid .document-note[b-51h1btw2lp] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.permit-note-grid .decision-note[b-51h1btw2lp] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.permit-note-grid small[b-51h1btw2lp] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.permit-note-grid p[b-51h1btw2lp] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-51h1btw2lp] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-51h1btw2lp] {
    display: grid;
    gap: 10px;
}

.three-columns[b-51h1btw2lp] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-51h1btw2lp] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-51h1btw2lp] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-51h1btw2lp] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-51h1btw2lp] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-51h1btw2lp] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-51h1btw2lp] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-51h1btw2lp] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-51h1btw2lp] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-51h1btw2lp] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-51h1btw2lp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-51h1btw2lp] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-51h1btw2lp] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-51h1btw2lp] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-51h1btw2lp] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-51h1btw2lp] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .permit-identity-banner[b-51h1btw2lp] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .permit-photo-upload-grid[b-51h1btw2lp],
    .three-columns[b-51h1btw2lp] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-51h1btw2lp] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .permit-photo-upload-grid[b-51h1btw2lp],
    .project-summary-grid[b-51h1btw2lp],
    .permit-note-grid[b-51h1btw2lp],
    .three-columns[b-51h1btw2lp] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .permit-location-panel[b-51h1btw2lp] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .permit-location-panel a[b-51h1btw2lp] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-51h1btw2lp] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-51h1btw2lp] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-51h1btw2lp],
    .permit-identity-banner[b-51h1btw2lp] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .permit-identity-banner .permit-banner-icon[b-51h1btw2lp] {
        min-height: 72px;
    }

    .view-toolbar[b-51h1btw2lp] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-51h1btw2lp] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-51h1btw2lp],
    .permit-page[b-51h1btw2lp]  .view-edit-button {
        width: 100%;
    }
}
/* /Components/Pages/02Specialized/01Construction/01PermitApplication/PermitApprovals.razor.rz.scp.css */
.approval-page[b-4czs9lmtws] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.approval-page[b-4czs9lmtws]  .approval-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.approval-hero[b-4czs9lmtws] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-4czs9lmtws] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-4czs9lmtws] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-4czs9lmtws] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-4czs9lmtws] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-4czs9lmtws] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-4czs9lmtws] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-4czs9lmtws] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-4czs9lmtws] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-4czs9lmtws] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-4czs9lmtws] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-4czs9lmtws] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-4czs9lmtws] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.approval-page[b-4czs9lmtws]  .hero-add-button,
.approval-page[b-4czs9lmtws]  .search-button,
.approval-page[b-4czs9lmtws]  .toolbar-add-button,
.approval-page[b-4czs9lmtws]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.approval-page[b-4czs9lmtws]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-4czs9lmtws] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-4czs9lmtws] {
    opacity: .55;
    cursor: not-allowed;
}

.approval-page[b-4czs9lmtws]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.approval-page[b-4czs9lmtws]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-4czs9lmtws] {
    margin-top: 7px;
}

.summary-card[b-4czs9lmtws] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-4czs9lmtws] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-4czs9lmtws] {
    color: #2c7da8;
}

.summary-card.approved[b-4czs9lmtws] {
    color: #7658a7;
}

.summary-card.incomplete[b-4czs9lmtws] {
    color: #c05b4e;
}

.summary-line[b-4czs9lmtws] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-4czs9lmtws] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-4czs9lmtws] {
    min-width: 0;
}

.summary-card small[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-4czs9lmtws] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-4czs9lmtws] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-4czs9lmtws] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-4czs9lmtws],
.approval-list-panel[b-4czs9lmtws] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-4czs9lmtws],
.list-toolbar[b-4czs9lmtws] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-4czs9lmtws],
.panel-kicker[b-4czs9lmtws] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-4czs9lmtws],
.list-toolbar h2[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-4czs9lmtws],
.list-toolbar p[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-4czs9lmtws] {
    align-items: center;
}

.approval-page[b-4czs9lmtws]  .premium-field,
.approval-page[b-4czs9lmtws]  .form-field {
    width: 100%;
}

.approval-page[b-4czs9lmtws]  .premium-field .mud-input-outlined-border,
.approval-page[b-4czs9lmtws]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.approval-page[b-4czs9lmtws]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.approval-page[b-4czs9lmtws]  .sort-select {
    width: 160px;
}

.approval-page[b-4czs9lmtws]  .toolbar-add-button {
    min-height: 42px;
}

.approval-page[b-4czs9lmtws]  .approval-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.approval-page[b-4czs9lmtws]  .approval-table .mud-table-head {
    background: #eef6f2;
}

.approval-page[b-4czs9lmtws]  .approval-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-4czs9lmtws] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-4czs9lmtws],
.view-avatar[b-4czs9lmtws] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-4czs9lmtws],
.view-avatar.female[b-4czs9lmtws] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-4czs9lmtws],
.view-avatar.other[b-4czs9lmtws] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-4czs9lmtws] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-4czs9lmtws],
.person-name small[b-4czs9lmtws] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-4czs9lmtws] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-4czs9lmtws] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-4czs9lmtws] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-4czs9lmtws] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-4czs9lmtws],
.area-cell[b-4czs9lmtws],
.date-cell[b-4czs9lmtws] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-4czs9lmtws] {
    gap: 3px;
}

.contact-cell span[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-4czs9lmtws],
.date-cell strong[b-4czs9lmtws] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-4czs9lmtws],
.date-cell small[b-4czs9lmtws] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-4czs9lmtws],
.document-chip[b-4czs9lmtws],
.status-chip[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-4czs9lmtws] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-4czs9lmtws] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-4czs9lmtws] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-4czs9lmtws] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-4czs9lmtws] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-4czs9lmtws] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-4czs9lmtws] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-4czs9lmtws] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-4czs9lmtws] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-4czs9lmtws] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-4czs9lmtws] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-4czs9lmtws] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.approval-page[b-4czs9lmtws]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.approval-page[b-4czs9lmtws]  .row-action.view {
    color: #2d79a2;
}

.approval-page[b-4czs9lmtws]  .row-action.edit {
    color: var(--theme-primary);
}

.approval-page[b-4czs9lmtws]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.approval-page[b-4czs9lmtws]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-4czs9lmtws] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-4czs9lmtws] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-4czs9lmtws] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-4czs9lmtws] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-4czs9lmtws] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.approval-form-modal[b-4czs9lmtws],
.approval-view-modal[b-4czs9lmtws],
.delete-modal[b-4czs9lmtws] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-4czs9lmtws .22s ease-out;
}

@keyframes modalAppear-b-4czs9lmtws {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.approval-form-modal[b-4czs9lmtws] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-4czs9lmtws] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-4czs9lmtws] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-4czs9lmtws] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-4czs9lmtws] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-4czs9lmtws] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-4czs9lmtws] {
    margin-top: 24px;
}

.form-section-title > span[b-4czs9lmtws] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-4czs9lmtws] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-4czs9lmtws] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-4czs9lmtws] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-4czs9lmtws] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-4czs9lmtws] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.approval-page[b-4czs9lmtws]  .cancel-button,
.approval-page[b-4czs9lmtws]  .save-button,
.approval-page[b-4czs9lmtws]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.approval-page[b-4czs9lmtws]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.approval-page[b-4czs9lmtws]  .save-button {
    min-width: 170px;
}

.approval-view-modal[b-4czs9lmtws] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-4czs9lmtws] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-4czs9lmtws] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-4czs9lmtws] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-4czs9lmtws] {
    padding: 61px 24px 25px;
}

.view-heading[b-4czs9lmtws] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-4czs9lmtws] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-4czs9lmtws] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-4czs9lmtws] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-4czs9lmtws] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-4czs9lmtws],
.view-address small[b-4czs9lmtws],
.view-note small[b-4czs9lmtws] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-4czs9lmtws] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-4czs9lmtws] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-4czs9lmtws] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-4czs9lmtws] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-4czs9lmtws] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-4czs9lmtws] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-4czs9lmtws] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-4czs9lmtws] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-4czs9lmtws] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-4czs9lmtws] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-4czs9lmtws] {
    color: #963b36;
}

.delete-warning[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.approval-page[b-4czs9lmtws]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .approval-hero[b-4czs9lmtws] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-4czs9lmtws] {
        max-width: 570px;
    }

    .list-toolbar[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-4czs9lmtws] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .approval-page[b-4czs9lmtws] {
        padding: 15px 12px 30px;
    }

    .approval-hero[b-4czs9lmtws] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-4czs9lmtws] {
        font-size: 2.3rem;
    }

    .hero-meta[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-4czs9lmtws] {
        width: 100%;
    }

    .filter-heading[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }

    .approval-page[b-4czs9lmtws]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-4czs9lmtws] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-4czs9lmtws] {
        align-items: end;
        padding: 0;
    }

    .approval-form-modal[b-4czs9lmtws],
    .approval-view-modal[b-4czs9lmtws] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-4czs9lmtws] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-4czs9lmtws] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-4czs9lmtws],
    .approval-list-panel[b-4czs9lmtws] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-4czs9lmtws] {
        align-items: flex-start;
    }

    .modal-icon[b-4czs9lmtws] {
        display: none;
    }

    .modal-footer[b-4czs9lmtws] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .approval-page[b-4czs9lmtws]  .save-button {
        min-width: 0;
    }

    .view-heading[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-4czs9lmtws],
    .approval-form-modal[b-4czs9lmtws],
    .approval-view-modal[b-4czs9lmtws],
    .delete-modal[b-4czs9lmtws] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.approval-page[b-4czs9lmtws] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.approval-hero[b-4czs9lmtws] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.approval-page[b-4czs9lmtws]  .hero-add-button,
.approval-page[b-4czs9lmtws]  .toolbar-add-button,
.approval-page[b-4czs9lmtws]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-4czs9lmtws] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-4czs9lmtws] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-4czs9lmtws] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-4czs9lmtws] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.approval-page[b-4czs9lmtws]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-4czs9lmtws] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-4czs9lmtws] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-4czs9lmtws] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-4czs9lmtws] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-4czs9lmtws] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-4czs9lmtws] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-4czs9lmtws] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-4czs9lmtws] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-4czs9lmtws] {
    background: #b54d43;
}

.status-overview-card div[b-4czs9lmtws] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-4czs9lmtws] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-4czs9lmtws] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.approval-code-photo-cell[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.approval-photo-mini[b-4czs9lmtws] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.approval-photo-mini button[b-4czs9lmtws] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.approval-photo-mini img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.approval-code-photo-cell strong[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.approval-code-photo-cell small[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-4czs9lmtws],
.applicant-cell[b-4czs9lmtws],
.status-document-cell[b-4czs9lmtws],
.officer-cell[b-4czs9lmtws],
.fee-cell[b-4czs9lmtws],
.due-cell[b-4czs9lmtws] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-4czs9lmtws] {
    min-width: 190px;
}

.project-cell strong[b-4czs9lmtws],
.applicant-cell strong[b-4czs9lmtws],
.officer-cell strong[b-4czs9lmtws],
.fee-cell strong[b-4czs9lmtws],
.due-cell strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-4czs9lmtws],
.applicant-cell small[b-4czs9lmtws],
.officer-cell small[b-4czs9lmtws],
.due-cell small[b-4czs9lmtws] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-4czs9lmtws] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-4czs9lmtws],
.due-cell.due-soon small[b-4czs9lmtws] {
    color: #b14a40;
}

.permit-type-chip[b-4czs9lmtws],
.priority-chip[b-4czs9lmtws],
.document-chip[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-4czs9lmtws],
.permit-type-chip.occupancy[b-4czs9lmtws] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-4czs9lmtws] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-4czs9lmtws],
.permit-type-chip.factory[b-4czs9lmtws] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-4czs9lmtws],
.permit-type-chip.market[b-4czs9lmtws] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-4czs9lmtws] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-4czs9lmtws] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-4czs9lmtws],
.permit-type-chip.event[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-4czs9lmtws] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-4czs9lmtws] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-4czs9lmtws] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-4czs9lmtws] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-4czs9lmtws] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-4czs9lmtws] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-4czs9lmtws],
.status-chip.inspection[b-4czs9lmtws],
.status-chip.reviewing[b-4czs9lmtws] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-4czs9lmtws] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-4czs9lmtws] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-4czs9lmtws] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-4czs9lmtws] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.approval-photo-upload-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-4czs9lmtws] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-4czs9lmtws] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-4czs9lmtws] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-4czs9lmtws] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-4czs9lmtws] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-4czs9lmtws] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-4czs9lmtws] {
    font-size: 1.8rem;
}

.photo-empty strong[b-4czs9lmtws] {
    font-size: .48rem;
}

.photo-empty small[b-4czs9lmtws] {
    font-size: .38rem;
}

.photo-upload-actions[b-4czs9lmtws] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-4czs9lmtws],
.remove-photo-button[b-4czs9lmtws] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-4czs9lmtws] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-4czs9lmtws] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-4czs9lmtws] {
    margin-top: 12px;
}

.approval-form-modal[b-4czs9lmtws] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.approval-view-modal[b-4czs9lmtws] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.approval-identity-banner[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.approval-identity-banner > div[b-4czs9lmtws] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.approval-identity-banner .approval-banner-icon[b-4czs9lmtws] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.approval-banner-icon .mud-icon-root[b-4czs9lmtws] {
    font-size: 1.7rem;
}

.approval-identity-banner small[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.approval-identity-banner strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-4czs9lmtws] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-4czs9lmtws] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-4czs9lmtws] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-4czs9lmtws] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-4czs9lmtws] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-4czs9lmtws] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-4czs9lmtws] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-4czs9lmtws] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-4czs9lmtws] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-4czs9lmtws] {
    font-style: normal;
}

.approval-location-panel b[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-4czs9lmtws] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-4czs9lmtws] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-4czs9lmtws] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-4czs9lmtws] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-4czs9lmtws] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-4czs9lmtws] {
    display: grid;
    gap: 10px;
}

.three-columns[b-4czs9lmtws] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-4czs9lmtws] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-4czs9lmtws] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-4czs9lmtws] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-4czs9lmtws] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-4czs9lmtws] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-4czs9lmtws] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-4czs9lmtws] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-4czs9lmtws] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-4czs9lmtws] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-4czs9lmtws] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-4czs9lmtws] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-4czs9lmtws] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-4czs9lmtws] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .approval-identity-banner[b-4czs9lmtws] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .approval-photo-upload-grid[b-4czs9lmtws],
    .three-columns[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .approval-photo-upload-grid[b-4czs9lmtws],
    .project-summary-grid[b-4czs9lmtws],
    .inspection-note-grid[b-4czs9lmtws],
    .three-columns[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-4czs9lmtws] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-4czs9lmtws] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-4czs9lmtws] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-4czs9lmtws] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-4czs9lmtws],
    .approval-identity-banner[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .approval-identity-banner .approval-banner-icon[b-4czs9lmtws] {
        min-height: 72px;
    }

    .view-toolbar[b-4czs9lmtws] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-4czs9lmtws] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-4czs9lmtws],
    .approval-page[b-4czs9lmtws]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.approval-page[b-4czs9lmtws] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.approval-hero[b-4czs9lmtws] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-4czs9lmtws] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-4czs9lmtws] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-4czs9lmtws] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-4czs9lmtws] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.approval-page[b-4czs9lmtws]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-4czs9lmtws] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-4czs9lmtws] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-4czs9lmtws] {
    background: #73569b;
}

.status-overview-card.completed > span[b-4czs9lmtws] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-4czs9lmtws] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-4czs9lmtws] {
    background: #b54d43;
}

.approval-code-photo-cell[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.approval-photo-mini[b-4czs9lmtws] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.approval-photo-mini button[b-4czs9lmtws] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.approval-photo-mini img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.approval-code-photo-cell strong[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.approval-code-photo-cell small[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-4czs9lmtws],
.appointment-cell[b-4czs9lmtws],
.team-cell[b-4czs9lmtws],
.status-result-cell[b-4czs9lmtws],
.applicant-cell[b-4czs9lmtws],
.notification-cell[b-4czs9lmtws] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-4czs9lmtws] {
    min-width: 190px;
}

.project-cell strong[b-4czs9lmtws],
.appointment-cell strong[b-4czs9lmtws],
.team-cell strong[b-4czs9lmtws],
.applicant-cell strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-4czs9lmtws],
.appointment-cell small[b-4czs9lmtws],
.team-cell small[b-4czs9lmtws],
.applicant-cell small[b-4czs9lmtws],
.notification-cell small[b-4czs9lmtws] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-4czs9lmtws],
.team-cell em[b-4czs9lmtws],
.applicant-cell em[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-4czs9lmtws],
.appointment-cell.overdue small[b-4czs9lmtws] {
    color: #b0443b;
}

.status-result-cell[b-4czs9lmtws] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-4czs9lmtws] {
    align-items: flex-start;
}

.notification-cell > span[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-4czs9lmtws] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-4czs9lmtws] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-4czs9lmtws] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-4czs9lmtws] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-4czs9lmtws] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-4czs9lmtws] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-4czs9lmtws] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-4czs9lmtws] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-4czs9lmtws] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-4czs9lmtws] {
    font-size: 2rem;
}

.source-priority[b-4czs9lmtws] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-4czs9lmtws] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-4czs9lmtws] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-4czs9lmtws] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-4czs9lmtws] {
    padding: 10px;
}

.source-picker-content > small[b-4czs9lmtws] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-4czs9lmtws] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-4czs9lmtws] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-4czs9lmtws] {
    margin-bottom: 16px;
}

.locked-application-panel[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-4czs9lmtws] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-4czs9lmtws] {
    font-size: 2.4rem;
}

.locked-application-content[b-4czs9lmtws] {
    min-width: 0;
}

.locked-application-heading[b-4czs9lmtws] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-4czs9lmtws] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-4czs9lmtws] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-4czs9lmtws] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-4czs9lmtws] {
    grid-column: span 2;
}

.locked-application-grid span[b-4czs9lmtws] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-4czs9lmtws],
.source-panel-actions button[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-4czs9lmtws] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.approval-photo-upload-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.approval-form-modal[b-4czs9lmtws] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.approval-view-modal[b-4czs9lmtws] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.approval-identity-banner[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.approval-identity-banner > div[b-4czs9lmtws] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.approval-identity-banner .approval-banner-icon[b-4czs9lmtws] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.approval-banner-icon .mud-icon-root[b-4czs9lmtws] {
    font-size: 1.7rem;
}

.approval-identity-banner small[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.approval-identity-banner strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-4czs9lmtws] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-4czs9lmtws] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-4czs9lmtws] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-4czs9lmtws] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-4czs9lmtws] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-4czs9lmtws] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-4czs9lmtws] {
    font-style: normal;
}

.approval-location-panel b[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-4czs9lmtws] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-4czs9lmtws] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-4czs9lmtws] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-4czs9lmtws] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-4czs9lmtws] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-4czs9lmtws] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-4czs9lmtws] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-4czs9lmtws] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-4czs9lmtws] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-4czs9lmtws] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-4czs9lmtws] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-4czs9lmtws] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-4czs9lmtws] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-4czs9lmtws] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-4czs9lmtws] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-4czs9lmtws] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .approval-identity-banner[b-4czs9lmtws] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-4czs9lmtws],
    .five-columns[b-4czs9lmtws] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-4czs9lmtws] {
        max-height: 310px;
    }

    .locked-application-grid[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-4czs9lmtws],
    .five-columns[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-4czs9lmtws],
    .approval-photo-upload-grid[b-4czs9lmtws],
    .inspection-note-grid[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-4czs9lmtws],
    .five-columns[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-4czs9lmtws] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-4czs9lmtws] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .approval-identity-banner[b-4czs9lmtws],
    .locked-application-grid[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-4czs9lmtws] {
        grid-column: auto;
    }

    .locked-application-heading[b-4czs9lmtws] {
        flex-direction: column;
    }

    .locked-application-badges[b-4czs9lmtws] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.approval-page[b-4czs9lmtws] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.approval-hero[b-4czs9lmtws] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-4czs9lmtws] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-4czs9lmtws] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-4czs9lmtws] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-4czs9lmtws] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-4czs9lmtws] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-4czs9lmtws] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-4czs9lmtws] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-4czs9lmtws] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.approval-page[b-4czs9lmtws]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-4czs9lmtws] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-4czs9lmtws] {
    background: #73569b;
}

.status-overview-card.revision > span[b-4czs9lmtws] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-4czs9lmtws] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-4czs9lmtws] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-4czs9lmtws] {
    background: #9f4139;
}

.source-note[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.approval-code-photo-cell[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.approval-photo-mini[b-4czs9lmtws] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.approval-photo-mini button[b-4czs9lmtws] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.approval-photo-mini img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.approval-code-photo-cell strong[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.approval-code-photo-cell small[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-4czs9lmtws],
.inspection-result-cell[b-4czs9lmtws],
.status-recommendation-cell[b-4czs9lmtws],
.reviewer-cell[b-4czs9lmtws],
.decision-cell[b-4czs9lmtws],
.permit-fee-cell[b-4czs9lmtws] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-4czs9lmtws] {
    min-width: 190px;
}

.project-cell strong[b-4czs9lmtws],
.inspection-result-cell strong[b-4czs9lmtws],
.reviewer-cell strong[b-4czs9lmtws],
.decision-cell strong[b-4czs9lmtws],
.permit-fee-cell strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-4czs9lmtws],
.inspection-result-cell small[b-4czs9lmtws],
.reviewer-cell small[b-4czs9lmtws],
.decision-cell small[b-4czs9lmtws],
.permit-fee-cell small[b-4czs9lmtws] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-4czs9lmtws] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-4czs9lmtws] {
    gap: 4px;
}

.decision-cell.overdue strong[b-4czs9lmtws],
.decision-cell.overdue small[b-4czs9lmtws] {
    color: #ad4037;
}

.permit-fee-cell > span[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-4czs9lmtws],
.recommendation-chip[b-4czs9lmtws],
.final-decision-chip[b-4czs9lmtws],
.inspection-result-chip[b-4czs9lmtws] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-4czs9lmtws] {
    gap: 5px;
}

.review-status-chip > i[b-4czs9lmtws] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-4czs9lmtws] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-4czs9lmtws] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-4czs9lmtws] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-4czs9lmtws] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-4czs9lmtws] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-4czs9lmtws] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-4czs9lmtws] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-4czs9lmtws] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-4czs9lmtws] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-4czs9lmtws] {
    font-size: 2.4rem;
}

.locked-source-heading[b-4czs9lmtws] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-4czs9lmtws] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-4czs9lmtws] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-4czs9lmtws] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-4czs9lmtws] {
    grid-column: span 2;
}

.locked-source-grid span[b-4czs9lmtws] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.approval-photo-upload-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.approval-form-modal[b-4czs9lmtws] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.approval-view-modal[b-4czs9lmtws] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.approval-identity-banner[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.approval-identity-banner > div[b-4czs9lmtws] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.approval-identity-banner .approval-banner-icon[b-4czs9lmtws] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.approval-banner-icon .mud-icon-root[b-4czs9lmtws] {
    font-size: 1.7rem;
}

.approval-identity-banner small[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.approval-identity-banner strong[b-4czs9lmtws] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-4czs9lmtws] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-4czs9lmtws] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-4czs9lmtws] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-4czs9lmtws] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-4czs9lmtws] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-4czs9lmtws] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-4czs9lmtws] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-4czs9lmtws] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-4czs9lmtws] {
    font-style: normal;
}

.approval-location-panel b[b-4czs9lmtws] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-4czs9lmtws] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-4czs9lmtws] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-4czs9lmtws] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-4czs9lmtws] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-4czs9lmtws] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-4czs9lmtws] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-4czs9lmtws] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-4czs9lmtws] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-4czs9lmtws] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-4czs9lmtws] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-4czs9lmtws],
.condition-grid[b-4czs9lmtws] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-4czs9lmtws],
.condition-grid > div[b-4czs9lmtws] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-4czs9lmtws] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-4czs9lmtws] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-4czs9lmtws] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-4czs9lmtws] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-4czs9lmtws] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-4czs9lmtws] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-4czs9lmtws] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-4czs9lmtws],
.condition-grid small[b-4czs9lmtws] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-4czs9lmtws],
.condition-grid p[b-4czs9lmtws] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-4czs9lmtws] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-4czs9lmtws] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-4czs9lmtws] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-4czs9lmtws] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-4czs9lmtws] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-4czs9lmtws] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-4czs9lmtws] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .approval-identity-banner[b-4czs9lmtws] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-4czs9lmtws],
    .six-columns[b-4czs9lmtws] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-4czs9lmtws] {
        max-height: 320px;
    }

    .locked-source-grid[b-4czs9lmtws],
    .decision-summary-grid[b-4czs9lmtws],
    .six-columns[b-4czs9lmtws] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .approval-photo-upload-grid[b-4czs9lmtws],
    .opinion-grid[b-4czs9lmtws],
    .condition-grid[b-4czs9lmtws],
    .decision-summary-grid[b-4czs9lmtws],
    .six-columns[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-4czs9lmtws] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-4czs9lmtws] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .approval-identity-banner[b-4czs9lmtws],
    .locked-source-grid[b-4czs9lmtws] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-4czs9lmtws] {
        grid-column: auto;
    }

    .locked-source-heading[b-4czs9lmtws] {
        flex-direction: column;
    }

    .locked-source-badges[b-4czs9lmtws] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/02Specialized/01Construction/01PermitApplication/PermitSiteInspections.razor.rz.scp.css */
.inspection-page[b-pu7jmvxki8] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.inspection-page[b-pu7jmvxki8]  .inspection-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.inspection-hero[b-pu7jmvxki8] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-pu7jmvxki8] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-pu7jmvxki8] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-pu7jmvxki8] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-pu7jmvxki8] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-pu7jmvxki8] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-pu7jmvxki8] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-pu7jmvxki8] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-pu7jmvxki8] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-pu7jmvxki8] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-pu7jmvxki8] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-pu7jmvxki8] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-pu7jmvxki8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.inspection-page[b-pu7jmvxki8]  .hero-add-button,
.inspection-page[b-pu7jmvxki8]  .search-button,
.inspection-page[b-pu7jmvxki8]  .toolbar-add-button,
.inspection-page[b-pu7jmvxki8]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.inspection-page[b-pu7jmvxki8]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-pu7jmvxki8] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-pu7jmvxki8] {
    opacity: .55;
    cursor: not-allowed;
}

.inspection-page[b-pu7jmvxki8]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.inspection-page[b-pu7jmvxki8]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-pu7jmvxki8] {
    margin-top: 7px;
}

.summary-card[b-pu7jmvxki8] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-pu7jmvxki8] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-pu7jmvxki8] {
    color: #2c7da8;
}

.summary-card.approved[b-pu7jmvxki8] {
    color: #7658a7;
}

.summary-card.incomplete[b-pu7jmvxki8] {
    color: #c05b4e;
}

.summary-line[b-pu7jmvxki8] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-pu7jmvxki8] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-pu7jmvxki8] {
    min-width: 0;
}

.summary-card small[b-pu7jmvxki8] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-pu7jmvxki8] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-pu7jmvxki8] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-pu7jmvxki8] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-pu7jmvxki8] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-pu7jmvxki8],
.inspection-list-panel[b-pu7jmvxki8] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-pu7jmvxki8],
.list-toolbar[b-pu7jmvxki8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-pu7jmvxki8],
.panel-kicker[b-pu7jmvxki8] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-pu7jmvxki8],
.list-toolbar h2[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-pu7jmvxki8],
.list-toolbar p[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-pu7jmvxki8] {
    align-items: center;
}

.inspection-page[b-pu7jmvxki8]  .premium-field,
.inspection-page[b-pu7jmvxki8]  .form-field {
    width: 100%;
}

.inspection-page[b-pu7jmvxki8]  .premium-field .mud-input-outlined-border,
.inspection-page[b-pu7jmvxki8]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.inspection-page[b-pu7jmvxki8]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.inspection-page[b-pu7jmvxki8]  .sort-select {
    width: 160px;
}

.inspection-page[b-pu7jmvxki8]  .toolbar-add-button {
    min-height: 42px;
}

.inspection-page[b-pu7jmvxki8]  .inspection-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.inspection-page[b-pu7jmvxki8]  .inspection-table .mud-table-head {
    background: #eef6f2;
}

.inspection-page[b-pu7jmvxki8]  .inspection-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-pu7jmvxki8] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-pu7jmvxki8],
.view-avatar[b-pu7jmvxki8] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-pu7jmvxki8],
.view-avatar.female[b-pu7jmvxki8] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-pu7jmvxki8],
.view-avatar.other[b-pu7jmvxki8] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-pu7jmvxki8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-pu7jmvxki8],
.person-name small[b-pu7jmvxki8] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-pu7jmvxki8] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-pu7jmvxki8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-pu7jmvxki8] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-pu7jmvxki8] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-pu7jmvxki8],
.area-cell[b-pu7jmvxki8],
.date-cell[b-pu7jmvxki8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-pu7jmvxki8] {
    gap: 3px;
}

.contact-cell span[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-pu7jmvxki8],
.date-cell strong[b-pu7jmvxki8] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-pu7jmvxki8],
.date-cell small[b-pu7jmvxki8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-pu7jmvxki8],
.document-chip[b-pu7jmvxki8],
.status-chip[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-pu7jmvxki8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-pu7jmvxki8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-pu7jmvxki8] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-pu7jmvxki8] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-pu7jmvxki8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-pu7jmvxki8] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-pu7jmvxki8] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-pu7jmvxki8] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-pu7jmvxki8] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-pu7jmvxki8] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-pu7jmvxki8] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-pu7jmvxki8] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.inspection-page[b-pu7jmvxki8]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.inspection-page[b-pu7jmvxki8]  .row-action.view {
    color: #2d79a2;
}

.inspection-page[b-pu7jmvxki8]  .row-action.edit {
    color: var(--theme-primary);
}

.inspection-page[b-pu7jmvxki8]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.inspection-page[b-pu7jmvxki8]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-pu7jmvxki8] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-pu7jmvxki8] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-pu7jmvxki8] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-pu7jmvxki8] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-pu7jmvxki8] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.inspection-form-modal[b-pu7jmvxki8],
.inspection-view-modal[b-pu7jmvxki8],
.delete-modal[b-pu7jmvxki8] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-pu7jmvxki8 .22s ease-out;
}

@keyframes modalAppear-b-pu7jmvxki8 {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.inspection-form-modal[b-pu7jmvxki8] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-pu7jmvxki8] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-pu7jmvxki8] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-pu7jmvxki8] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-pu7jmvxki8] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-pu7jmvxki8] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-pu7jmvxki8] {
    margin-top: 24px;
}

.form-section-title > span[b-pu7jmvxki8] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-pu7jmvxki8] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-pu7jmvxki8] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-pu7jmvxki8] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-pu7jmvxki8] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-pu7jmvxki8] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-page[b-pu7jmvxki8]  .cancel-button,
.inspection-page[b-pu7jmvxki8]  .save-button,
.inspection-page[b-pu7jmvxki8]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.inspection-page[b-pu7jmvxki8]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.inspection-page[b-pu7jmvxki8]  .save-button {
    min-width: 170px;
}

.inspection-view-modal[b-pu7jmvxki8] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-pu7jmvxki8] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-pu7jmvxki8] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-pu7jmvxki8] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-pu7jmvxki8] {
    padding: 61px 24px 25px;
}

.view-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-pu7jmvxki8] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-pu7jmvxki8] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-pu7jmvxki8] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-pu7jmvxki8] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-pu7jmvxki8],
.view-address small[b-pu7jmvxki8],
.view-note small[b-pu7jmvxki8] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-pu7jmvxki8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-pu7jmvxki8] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-pu7jmvxki8] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-pu7jmvxki8] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-pu7jmvxki8] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-pu7jmvxki8] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-pu7jmvxki8] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-pu7jmvxki8] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-pu7jmvxki8] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-pu7jmvxki8] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-pu7jmvxki8] {
    color: #963b36;
}

.delete-warning[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.inspection-page[b-pu7jmvxki8]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .inspection-hero[b-pu7jmvxki8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-pu7jmvxki8] {
        max-width: 570px;
    }

    .list-toolbar[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pu7jmvxki8] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .inspection-page[b-pu7jmvxki8] {
        padding: 15px 12px 30px;
    }

    .inspection-hero[b-pu7jmvxki8] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-pu7jmvxki8] {
        font-size: 2.3rem;
    }

    .hero-meta[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-pu7jmvxki8] {
        width: 100%;
    }

    .filter-heading[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }

    .inspection-page[b-pu7jmvxki8]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-pu7jmvxki8] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-pu7jmvxki8] {
        align-items: end;
        padding: 0;
    }

    .inspection-form-modal[b-pu7jmvxki8],
    .inspection-view-modal[b-pu7jmvxki8] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-pu7jmvxki8] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-pu7jmvxki8] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-pu7jmvxki8],
    .inspection-list-panel[b-pu7jmvxki8] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-pu7jmvxki8] {
        align-items: flex-start;
    }

    .modal-icon[b-pu7jmvxki8] {
        display: none;
    }

    .modal-footer[b-pu7jmvxki8] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inspection-page[b-pu7jmvxki8]  .save-button {
        min-width: 0;
    }

    .view-heading[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-pu7jmvxki8],
    .inspection-form-modal[b-pu7jmvxki8],
    .inspection-view-modal[b-pu7jmvxki8],
    .delete-modal[b-pu7jmvxki8] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.inspection-page[b-pu7jmvxki8] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.inspection-hero[b-pu7jmvxki8] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.inspection-page[b-pu7jmvxki8]  .hero-add-button,
.inspection-page[b-pu7jmvxki8]  .toolbar-add-button,
.inspection-page[b-pu7jmvxki8]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-pu7jmvxki8] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-pu7jmvxki8] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-pu7jmvxki8] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-pu7jmvxki8] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.inspection-page[b-pu7jmvxki8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-pu7jmvxki8] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-pu7jmvxki8] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-pu7jmvxki8] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-pu7jmvxki8] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-pu7jmvxki8] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-pu7jmvxki8] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-pu7jmvxki8] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-pu7jmvxki8] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-pu7jmvxki8] {
    background: #b54d43;
}

.status-overview-card div[b-pu7jmvxki8] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-pu7jmvxki8] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-pu7jmvxki8] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.inspection-code-photo-cell[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.inspection-photo-mini[b-pu7jmvxki8] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.inspection-photo-mini button[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.inspection-photo-mini img[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.inspection-code-photo-cell strong[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.inspection-code-photo-cell small[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-pu7jmvxki8],
.applicant-cell[b-pu7jmvxki8],
.status-document-cell[b-pu7jmvxki8],
.officer-cell[b-pu7jmvxki8],
.fee-cell[b-pu7jmvxki8],
.due-cell[b-pu7jmvxki8] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-pu7jmvxki8] {
    min-width: 190px;
}

.project-cell strong[b-pu7jmvxki8],
.applicant-cell strong[b-pu7jmvxki8],
.officer-cell strong[b-pu7jmvxki8],
.fee-cell strong[b-pu7jmvxki8],
.due-cell strong[b-pu7jmvxki8] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-pu7jmvxki8],
.applicant-cell small[b-pu7jmvxki8],
.officer-cell small[b-pu7jmvxki8],
.due-cell small[b-pu7jmvxki8] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-pu7jmvxki8] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-pu7jmvxki8] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-pu7jmvxki8],
.due-cell.due-soon small[b-pu7jmvxki8] {
    color: #b14a40;
}

.permit-type-chip[b-pu7jmvxki8],
.priority-chip[b-pu7jmvxki8],
.document-chip[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-pu7jmvxki8],
.permit-type-chip.occupancy[b-pu7jmvxki8] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-pu7jmvxki8] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-pu7jmvxki8],
.permit-type-chip.factory[b-pu7jmvxki8] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-pu7jmvxki8],
.permit-type-chip.market[b-pu7jmvxki8] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-pu7jmvxki8] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-pu7jmvxki8] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-pu7jmvxki8],
.permit-type-chip.event[b-pu7jmvxki8] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-pu7jmvxki8] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-pu7jmvxki8] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-pu7jmvxki8] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-pu7jmvxki8] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-pu7jmvxki8] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-pu7jmvxki8] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-pu7jmvxki8] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-pu7jmvxki8] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-pu7jmvxki8],
.status-chip.inspection[b-pu7jmvxki8],
.status-chip.reviewing[b-pu7jmvxki8] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-pu7jmvxki8] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-pu7jmvxki8] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-pu7jmvxki8] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-pu7jmvxki8] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-pu7jmvxki8] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-pu7jmvxki8] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-pu7jmvxki8] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-pu7jmvxki8] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-pu7jmvxki8] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-photo-upload-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-pu7jmvxki8] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-pu7jmvxki8] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-pu7jmvxki8] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-pu7jmvxki8] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-pu7jmvxki8] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-pu7jmvxki8] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-pu7jmvxki8] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-pu7jmvxki8] {
    font-size: 1.8rem;
}

.photo-empty strong[b-pu7jmvxki8] {
    font-size: .48rem;
}

.photo-empty small[b-pu7jmvxki8] {
    font-size: .38rem;
}

.photo-upload-actions[b-pu7jmvxki8] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-pu7jmvxki8],
.remove-photo-button[b-pu7jmvxki8] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-pu7jmvxki8] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-pu7jmvxki8] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-pu7jmvxki8] {
    margin-top: 12px;
}

.inspection-form-modal[b-pu7jmvxki8] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.inspection-view-modal[b-pu7jmvxki8] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-identity-banner[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.inspection-identity-banner > div[b-pu7jmvxki8] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.inspection-identity-banner .inspection-banner-icon[b-pu7jmvxki8] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.inspection-banner-icon .mud-icon-root[b-pu7jmvxki8] {
    font-size: 1.7rem;
}

.inspection-identity-banner small[b-pu7jmvxki8] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.inspection-identity-banner strong[b-pu7jmvxki8] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-pu7jmvxki8] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-pu7jmvxki8] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-pu7jmvxki8] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-pu7jmvxki8] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-pu7jmvxki8] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-pu7jmvxki8] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.inspection-location-panel[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.inspection-location-panel > span[b-pu7jmvxki8] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.inspection-location-panel small[b-pu7jmvxki8] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-location-panel h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.inspection-location-panel p[b-pu7jmvxki8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.inspection-location-panel p em[b-pu7jmvxki8] {
    font-style: normal;
}

.inspection-location-panel b[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.inspection-location-panel a[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-pu7jmvxki8] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-pu7jmvxki8] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-pu7jmvxki8] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-pu7jmvxki8] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-pu7jmvxki8] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-pu7jmvxki8] {
    display: grid;
    gap: 10px;
}

.three-columns[b-pu7jmvxki8] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-pu7jmvxki8] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-pu7jmvxki8] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-pu7jmvxki8] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-pu7jmvxki8] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-pu7jmvxki8] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-pu7jmvxki8] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-pu7jmvxki8] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-pu7jmvxki8] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-pu7jmvxki8] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-pu7jmvxki8] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-pu7jmvxki8] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-pu7jmvxki8] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .inspection-identity-banner[b-pu7jmvxki8] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .inspection-photo-upload-grid[b-pu7jmvxki8],
    .three-columns[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .inspection-photo-upload-grid[b-pu7jmvxki8],
    .project-summary-grid[b-pu7jmvxki8],
    .inspection-note-grid[b-pu7jmvxki8],
    .three-columns[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .inspection-location-panel[b-pu7jmvxki8] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .inspection-location-panel a[b-pu7jmvxki8] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-pu7jmvxki8] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-pu7jmvxki8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-pu7jmvxki8],
    .inspection-identity-banner[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .inspection-identity-banner .inspection-banner-icon[b-pu7jmvxki8] {
        min-height: 72px;
    }

    .view-toolbar[b-pu7jmvxki8] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-pu7jmvxki8] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-pu7jmvxki8],
    .inspection-page[b-pu7jmvxki8]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.inspection-page[b-pu7jmvxki8] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.inspection-hero[b-pu7jmvxki8] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-pu7jmvxki8] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-pu7jmvxki8] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-pu7jmvxki8] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-pu7jmvxki8] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.inspection-page[b-pu7jmvxki8]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-pu7jmvxki8] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-pu7jmvxki8] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-pu7jmvxki8] {
    background: #73569b;
}

.status-overview-card.completed > span[b-pu7jmvxki8] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-pu7jmvxki8] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-pu7jmvxki8] {
    background: #b54d43;
}

.inspection-code-photo-cell[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.inspection-photo-mini[b-pu7jmvxki8] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.inspection-photo-mini button[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.inspection-photo-mini img[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inspection-code-photo-cell strong[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.inspection-code-photo-cell small[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-pu7jmvxki8],
.appointment-cell[b-pu7jmvxki8],
.team-cell[b-pu7jmvxki8],
.status-result-cell[b-pu7jmvxki8],
.applicant-cell[b-pu7jmvxki8],
.notification-cell[b-pu7jmvxki8] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-pu7jmvxki8] {
    min-width: 190px;
}

.project-cell strong[b-pu7jmvxki8],
.appointment-cell strong[b-pu7jmvxki8],
.team-cell strong[b-pu7jmvxki8],
.applicant-cell strong[b-pu7jmvxki8] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-pu7jmvxki8],
.appointment-cell small[b-pu7jmvxki8],
.team-cell small[b-pu7jmvxki8],
.applicant-cell small[b-pu7jmvxki8],
.notification-cell small[b-pu7jmvxki8] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-pu7jmvxki8],
.team-cell em[b-pu7jmvxki8],
.applicant-cell em[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-pu7jmvxki8],
.appointment-cell.overdue small[b-pu7jmvxki8] {
    color: #b0443b;
}

.status-result-cell[b-pu7jmvxki8] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-pu7jmvxki8] {
    align-items: flex-start;
}

.notification-cell > span[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-pu7jmvxki8] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-pu7jmvxki8] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-pu7jmvxki8] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-pu7jmvxki8] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-pu7jmvxki8] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-pu7jmvxki8] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-pu7jmvxki8] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-pu7jmvxki8] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-pu7jmvxki8] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-pu7jmvxki8] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-pu7jmvxki8] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-pu7jmvxki8] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-pu7jmvxki8] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-pu7jmvxki8] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-pu7jmvxki8] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-pu7jmvxki8] {
    font-size: 2rem;
}

.source-priority[b-pu7jmvxki8] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-pu7jmvxki8] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-pu7jmvxki8] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-pu7jmvxki8] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-pu7jmvxki8] {
    padding: 10px;
}

.source-picker-content > small[b-pu7jmvxki8] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-pu7jmvxki8] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-pu7jmvxki8] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-pu7jmvxki8] {
    margin-bottom: 16px;
}

.locked-application-panel[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-pu7jmvxki8] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-pu7jmvxki8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-pu7jmvxki8] {
    font-size: 2.4rem;
}

.locked-application-content[b-pu7jmvxki8] {
    min-width: 0;
}

.locked-application-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-pu7jmvxki8] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-pu7jmvxki8] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-pu7jmvxki8] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-pu7jmvxki8] {
    grid-column: span 2;
}

.locked-application-grid span[b-pu7jmvxki8] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-pu7jmvxki8],
.source-panel-actions button[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-pu7jmvxki8] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.inspection-photo-upload-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.inspection-form-modal[b-pu7jmvxki8] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.inspection-view-modal[b-pu7jmvxki8] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.inspection-identity-banner[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.inspection-identity-banner > div[b-pu7jmvxki8] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.inspection-identity-banner .inspection-banner-icon[b-pu7jmvxki8] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.inspection-banner-icon .mud-icon-root[b-pu7jmvxki8] {
    font-size: 1.7rem;
}

.inspection-identity-banner small[b-pu7jmvxki8] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.inspection-identity-banner strong[b-pu7jmvxki8] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-pu7jmvxki8] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-pu7jmvxki8] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-pu7jmvxki8] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-pu7jmvxki8] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.inspection-location-panel[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.inspection-location-panel > span[b-pu7jmvxki8] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.inspection-location-panel small[b-pu7jmvxki8] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-location-panel h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.inspection-location-panel p[b-pu7jmvxki8] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.inspection-location-panel p em[b-pu7jmvxki8] {
    font-style: normal;
}

.inspection-location-panel b[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.inspection-location-panel a[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-pu7jmvxki8] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-pu7jmvxki8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-pu7jmvxki8] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-pu7jmvxki8] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-pu7jmvxki8] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-pu7jmvxki8] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-pu7jmvxki8] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-pu7jmvxki8] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-pu7jmvxki8] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-pu7jmvxki8] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-pu7jmvxki8] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-pu7jmvxki8] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-pu7jmvxki8] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-pu7jmvxki8] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-pu7jmvxki8] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-pu7jmvxki8] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-pu7jmvxki8] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-pu7jmvxki8] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-pu7jmvxki8] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-pu7jmvxki8] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-pu7jmvxki8] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-pu7jmvxki8] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-pu7jmvxki8] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-pu7jmvxki8] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .inspection-identity-banner[b-pu7jmvxki8] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-pu7jmvxki8],
    .five-columns[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-pu7jmvxki8] {
        max-height: 310px;
    }

    .locked-application-grid[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-pu7jmvxki8],
    .five-columns[b-pu7jmvxki8] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-pu7jmvxki8],
    .inspection-photo-upload-grid[b-pu7jmvxki8],
    .inspection-note-grid[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-pu7jmvxki8],
    .five-columns[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .inspection-location-panel[b-pu7jmvxki8] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .inspection-location-panel a[b-pu7jmvxki8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .inspection-identity-banner[b-pu7jmvxki8],
    .locked-application-grid[b-pu7jmvxki8] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-pu7jmvxki8] {
        grid-column: auto;
    }

    .locked-application-heading[b-pu7jmvxki8] {
        flex-direction: column;
    }

    .locked-application-badges[b-pu7jmvxki8] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/LandParcelMap.razor.rz.scp.css */
:root[b-7bxp0721ur] {
    --lm-green: var(--theme-primary);
    --lm-green-deep: var(--theme-dark);
    --lm-green-soft: #e7f5ef;
    --lm-gold: var(--theme-accent);
    --lm-blue: #2f789f;
    --lm-purple: #73569b;
    --lm-red: #b54d43;
    --lm-text: var(--theme-ink);
    --lm-muted: var(--theme-muted);
    --lm-border: rgba(10, 114, 87, .10);
    --lm-shadow: 0 14px 35px rgba(5, 62, 46, .07);
}

.land-map-page[b-7bxp0721ur] {
    min-height: 100vh;
    padding: 18px 0 32px;

    color: var(--lm-text);
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(10, 114, 87, .07),
            transparent 30rem),
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .06),
            transparent 24rem),
        var(--theme-bg);

    font-family: 'Kanit', sans-serif;
}

.land-map-container[b-7bxp0721ur] {
    width: 100%;
    padding-inline: 18px !important;
}

/* =========================================================
   HERO
   ========================================================= */

.map-hero[b-7bxp0721ur] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1fr) 265px;

    gap: 18px;
    overflow: hidden;

    padding: 24px;
    border-radius: 22px;

    color: #fff;
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .27),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%);

    box-shadow:
        0 22px 55px rgba(5, 62, 46, .19);
}

.hero-pattern[b-7bxp0721ur] {
    position: absolute;
    inset: 0;

    opacity: .20;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .045) 1px,
            transparent 1px),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .045) 1px,
            transparent 1px);

    background-size: 28px 28px;
}

.hero-gold-line[b-7bxp0721ur] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;

    background:
        linear-gradient(
            #f1d89b,
            #a87c32,
            #f1d89b);
}

.hero-content[b-7bxp0721ur],
.hero-action-panel[b-7bxp0721ur] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-7bxp0721ur] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);

    align-items: center;
    gap: 10px;

    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 14px;

    background: rgba(255, 255, 255, .07);
}

.hero-badge > span[b-7bxp0721ur] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-badge div[b-7bxp0721ur] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-7bxp0721ur] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-7bxp0721ur] {
    margin-top: 3px;
    font-size: .58rem;
}

.map-hero h1[b-7bxp0721ur] {
    margin: 17px 0 0;

    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.map-hero p[b-7bxp0721ur] {
    max-width: 900px;
    margin: 10px 0 0;

    color: rgba(255, 255, 255, .79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-7bxp0721ur] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    margin-top: 15px;
}

.hero-meta span[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 29px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 999px;

    color: rgba(255, 255, 255, .84);
    background: rgba(255, 255, 255, .06);

    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-7bxp0721ur] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-7bxp0721ur] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    background: rgba(255, 255, 255, .055);
}

.status-dot[b-7bxp0721ur] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: #34d78b;

    box-shadow:
        0 0 0 5px rgba(52, 215, 139, .12);
}

.hero-status div[b-7bxp0721ur] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-7bxp0721ur] {
    font-size: .51rem;
}

.hero-status small[b-7bxp0721ur] {
    margin-top: 2px;

    color: rgba(255, 255, 255, .68);
    font-size: .40rem;
}

.hero-registry-button[b-7bxp0721ur],
.hero-landsmaps-button[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 41px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border-radius: 11px;

    font-family: 'Kanit', sans-serif;
    font-size: .45rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-registry-button[b-7bxp0721ur] {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .08);
}

.hero-landsmaps-button[b-7bxp0721ur] {
    color: #fff;
    border: 1px solid rgba(242, 217, 153, .25);
    background:
        linear-gradient(
            145deg,
            rgba(199, 163, 93, .95),
            rgba(152, 118, 52, .96));
}

.hero-refresh-button[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 11px;

    color: rgba(255, 255, 255, .90);
    background: rgba(255, 255, 255, .06);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-7bxp0721ur] {
    opacity: .55;
    cursor: wait;
}

/* =========================================================
   LOADING / ALERT
   ========================================================= */

.page-loading[b-7bxp0721ur] {
    margin-top: 10px !important;
    border-radius: 999px;
}

.page-error[b-7bxp0721ur] {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
}

/* =========================================================
   SUMMARY
   ========================================================= */

.summary-grid[b-7bxp0721ur] {
    margin-top: 2px !important;
}

.summary-card[b-7bxp0721ur] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10, 114, 87, .18);

    position: relative;

    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);

    min-height: 116px;
    align-items: center;
    gap: 12px;

    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            color-mix(in srgb, var(--soft) 90%, transparent),
            transparent 16rem),
        #fff;

    box-shadow: var(--lm-shadow);
}

.summary-card.parcels[b-7bxp0721ur] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10, 114, 87, .18);
}

.summary-card.area[b-7bxp0721ur] {
    --accent: #4d7c45;
    --soft: #edf6e9;
    --border: rgba(77, 124, 69, .18);
}

.summary-card.value[b-7bxp0721ur] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152, 118, 52, .18);
}

.summary-card.photos[b-7bxp0721ur] {
    --accent: #73569b;
    --soft: #f0eafb;
    --border: rgba(115, 86, 155, .18);
}

.summary-line[b-7bxp0721ur] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;

    background: var(--accent);
}

.summary-icon[b-7bxp0721ur] {
    display: grid;
    width: 56px;
    height: 56px;

    place-items: center;
    border-radius: 16px;

    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-7bxp0721ur] {
    display: flex;
    min-width: 0;

    flex-direction: column;
}

.summary-card small[b-7bxp0721ur] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-7bxp0721ur] {
    display: flex;
    align-items: baseline;
    gap: 5px;

    margin: 5px 0 0;
}

.summary-card p strong[b-7bxp0721ur] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-7bxp0721ur] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-7bxp0721ur] {
    margin-top: 6px;

    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* =========================================================
   FILTER
   ========================================================= */

.map-filter-panel[b-7bxp0721ur] {
    margin-top: 14px;
    padding: 15px;

    border: 1px solid var(--lm-border);
    border-radius: 18px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .07),
            transparent 18rem),
        #fff;

    box-shadow: var(--lm-shadow);
}

.filter-heading[b-7bxp0721ur] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading > div:first-child[b-7bxp0721ur] {
    min-width: 0;
}

.filter-heading span[b-7bxp0721ur] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-7bxp0721ur] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.filter-actions[b-7bxp0721ur] {
    display: flex;
    gap: 7px;
}

.fit-map-button[b-7bxp0721ur],
.clear-filter-button[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border-radius: 10px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.fit-map-button[b-7bxp0721ur] {
    border: 1px solid rgba(47, 120, 159, .14);
    color: #2f789f;
    background: #edf6fb;
}

.clear-filter-button[b-7bxp0721ur] {
    border: 1px solid rgba(10, 114, 87, .12);
    color: var(--theme-primary);
    background: #edf7f3;
}

.filter-grid[b-7bxp0721ur] {
    margin-top: 8px !important;
}

.premium-field[b-7bxp0721ur] {
    font-family: 'Kanit', sans-serif !important;
}

/* =========================================================
   WORKSPACE
   ========================================================= */

.map-workspace[b-7bxp0721ur] {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);

    gap: 14px;
    margin-top: 14px;
}

.parcel-list-panel[b-7bxp0721ur],
.map-main-panel[b-7bxp0721ur] {
    min-width: 0;
    border: 1px solid var(--lm-border);
    border-radius: 18px;

    background: #fff;
    box-shadow: var(--lm-shadow);
}

.parcel-list-panel[b-7bxp0721ur] {
    align-self: stretch;
    overflow: hidden;
}

.parcel-list-header[b-7bxp0721ur],
.map-main-header[b-7bxp0721ur] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 13px 14px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .07),
            transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.parcel-list-header small[b-7bxp0721ur],
.map-main-header small[b-7bxp0721ur] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.parcel-list-header h2[b-7bxp0721ur],
.map-main-header h2[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.parcel-list-header p[b-7bxp0721ur],
.map-main-header p[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: #7f8f89;
    font-size: .41rem;
}

.list-count-badge[b-7bxp0721ur] {
    display: grid;
    min-width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 11px;

    color: var(--theme-primary);
    background: #e7f5ef;

    font-size: .50rem;
    font-weight: 800;
}

.map-legend[b-7bxp0721ur] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 6px;
    padding: 10px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.legend-item[b-7bxp0721ur] {
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;

    min-height: 31px;
    align-items: center;
    gap: 5px;

    padding: 0 7px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;

    color: #576a62;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .38rem;
    text-align: left;
    cursor: pointer;
}

.legend-item i[b-7bxp0721ur] {
    width: 8px;
    height: 8px;

    border-radius: 50%;
    background: var(--theme-primary);
}

.legend-item strong[b-7bxp0721ur] {
    color: var(--theme-ink);
    font-size: .40rem;
}

.legend-item.residential i[b-7bxp0721ur] {
    background: #2f789f;
}

.legend-item.agriculture i[b-7bxp0721ur] {
    background: #4d7c45;
}

.legend-item.commercial i[b-7bxp0721ur] {
    background: #c07a2a;
}

.legend-item.industrial i[b-7bxp0721ur] {
    background: #73569b;
}

.legend-item.public i[b-7bxp0721ur] {
    background: var(--theme-primary);
}

.legend-item.vacant i[b-7bxp0721ur] {
    background: #7a8882;
}

.parcel-scroll-list[b-7bxp0721ur] {
    max-height: 790px;
    overflow: auto;
    padding: 9px;
}

.parcel-scroll-list[b-7bxp0721ur]::-webkit-scrollbar {
    width: 7px;
}

.parcel-scroll-list[b-7bxp0721ur]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(10, 114, 87, .18);
}

.parcel-list-card[b-7bxp0721ur] {
    display: grid;
    grid-template-columns: 66px minmax(0, 1fr);

    width: 100%;
    min-height: 100px;
    align-items: center;
    gap: 9px;

    margin-bottom: 7px;
    padding: 8px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 13px;

    background: #fff;

    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;

    transition:
        transform .16s ease,
        border-color .16s ease,
        box-shadow .16s ease;
}

.parcel-list-card:hover[b-7bxp0721ur] {
    transform: translateX(2px);
    border-color: rgba(10, 114, 87, .19);
    box-shadow:
        0 9px 20px rgba(5, 62, 46, .07);
}

.parcel-list-card.selected[b-7bxp0721ur] {
    border-color: rgba(10, 114, 87, .32);
    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .10),
            transparent 11rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);

    box-shadow:
        0 12px 26px rgba(5, 62, 46, .10);
}

.parcel-list-card.no-coordinate[b-7bxp0721ur] {
    border-style: dashed;
}

.parcel-card-photo[b-7bxp0721ur] {
    display: grid;
    width: 66px;
    height: 76px;

    overflow: hidden;
    place-items: center;
    border-radius: 11px;

    color: var(--theme-primary);
    background: #eaf5f0;
}

.parcel-card-photo img[b-7bxp0721ur] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.parcel-card-content[b-7bxp0721ur] {
    min-width: 0;
}

.parcel-card-title[b-7bxp0721ur] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
}

.parcel-card-title > strong[b-7bxp0721ur] {
    color: var(--theme-primary);
    font-size: .49rem;
}

.usage-chip[b-7bxp0721ur] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    padding: 0 6px;
    border-radius: 999px;

    font-size: .36rem;
    font-weight: 700;
}

.usage-chip.residential[b-7bxp0721ur] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-7bxp0721ur] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-7bxp0721ur] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-7bxp0721ur] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-7bxp0721ur] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-7bxp0721ur] {
    color: #687872;
    background: #edf1ef;
}

.parcel-card-content h3[b-7bxp0721ur] {
    margin: 5px 0 0;

    overflow: hidden;

    color: #354940;
    font-size: .50rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.parcel-card-content p[b-7bxp0721ur] {
    margin: 3px 0 0;
    overflow: hidden;

    color: #7b8c85;
    font-size: .41rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.parcel-card-meta[b-7bxp0721ur] {
    display: flex;
    flex-direction: column;
    gap: 3px;

    margin-top: 6px;
}

.parcel-card-meta span[b-7bxp0721ur] {
    display: inline-flex;
    min-width: 0;

    align-items: center;
    gap: 4px;

    overflow: hidden;

    color: #6f8079;
    font-size: .37rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.empty-list[b-7bxp0721ur] {
    display: flex;
    min-height: 240px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    color: var(--theme-muted);
}

.empty-list strong[b-7bxp0721ur] {
    color: #40544b;
    font-size: .55rem;
}

.empty-list small[b-7bxp0721ur] {
    font-size: .40rem;
}

/* =========================================================
   MAP MAIN
   ========================================================= */

.map-main-panel[b-7bxp0721ur] {
    overflow: hidden;
}

.map-main-header[b-7bxp0721ur] {
    min-height: 75px;
}

.map-main-header > div:first-child[b-7bxp0721ur] {
    min-width: 0;
}

.map-main-header h2[b-7bxp0721ur],
.map-main-header p[b-7bxp0721ur] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selected-actions[b-7bxp0721ur] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.selected-registry-button[b-7bxp0721ur],
.selected-landsmaps-button[b-7bxp0721ur],
.selected-google-button[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 700;
    text-decoration: none;
}

.selected-registry-button[b-7bxp0721ur] {
    color: var(--theme-primary);
    border: 1px solid rgba(10, 114, 87, .13);
    background: #edf7f3;
}

.selected-landsmaps-button[b-7bxp0721ur] {
    color: #987634;
    border: 1px solid rgba(152, 118, 52, .14);
    background: #fff7e8;
}

.selected-google-button[b-7bxp0721ur] {
    color: #2f789f;
    border: 1px solid rgba(47, 120, 159, .14);
    background: #edf6fb;
}

.premium-map-tabs[b-7bxp0721ur] {
    font-family: 'Kanit', sans-serif !important;
}

.map-tab-panel[b-7bxp0721ur] {
    padding: 0 !important;
}

/* =========================================================
   GIS OVERVIEW
   ========================================================= */

.gis-overview[b-7bxp0721ur] {
    background: #edf4f0;
}

.gis-toolbar[b-7bxp0721ur] {
    display: flex;
    min-height: 54px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 9px 13px;
    border-bottom: 1px solid rgba(10, 114, 87, .10);

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.gis-toolbar > div:first-child[b-7bxp0721ur] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.gis-live-dot[b-7bxp0721ur] {
    width: 9px;
    height: 9px;

    border-radius: 50%;
    background: #28bd79;

    box-shadow:
        0 0 0 5px rgba(40, 189, 121, .12);
}

.gis-toolbar strong[b-7bxp0721ur] {
    color: var(--theme-primary);
    font-size: .47rem;
    letter-spacing: .07em;
}

.gis-toolbar small[b-7bxp0721ur] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.gis-toolbar-meta[b-7bxp0721ur] {
    display: flex;
    gap: 5px;
}

.gis-toolbar-meta span[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .38rem;
    font-weight: 700;
}

.gis-canvas[b-7bxp0721ur] {
    position: relative;

    min-height: 650px;
    overflow: hidden;

    background:
        linear-gradient(
            rgba(255, 255, 255, .37),
            rgba(255, 255, 255, .37)),
        linear-gradient(
            145deg,
            #dce9e2,
            #eff5f2 48%,
            #d7e5de);

    isolation: isolate;
}

.map-grid-lines[b-7bxp0721ur] {
    position: absolute;
    inset: 0;
    z-index: -5;

    opacity: .42;

    background-image:
        linear-gradient(
            rgba(65, 97, 84, .10) 1px,
            transparent 1px),
        linear-gradient(
            90deg,
            rgba(65, 97, 84, .10) 1px,
            transparent 1px);

    background-size: 38px 38px;
}

.map-road[b-7bxp0721ur] {
    position: absolute;
    z-index: -3;

    height: 26px;
    border: 7px solid rgba(255, 255, 255, .78);
    border-radius: 999px;

    background: #b8c2bd;

    box-shadow:
        0 0 0 1px rgba(77, 93, 86, .14);
}

.road-one[b-7bxp0721ur] {
    width: 125%;
    left: -11%;
    top: 46%;

    transform: rotate(-12deg);
}

.road-two[b-7bxp0721ur] {
    width: 100%;
    left: 5%;
    top: 66%;

    transform: rotate(26deg);
}

.map-water[b-7bxp0721ur] {
    position: absolute;
    z-index: -4;

    width: 165px;
    height: 440px;

    right: 8%;
    top: -70px;

    border-radius: 50%;
    background: rgba(91, 175, 211, .26);

    transform: rotate(18deg);
}

.map-park[b-7bxp0721ur] {
    position: absolute;
    z-index: -4;

    width: 260px;
    height: 180px;

    left: 9%;
    bottom: 8%;

    border-radius: 42% 58% 63% 37%;
    background: rgba(91, 152, 83, .18);

    transform: rotate(-8deg);
}

.parcel-marker[b-7bxp0721ur] {
    position: absolute;
    z-index: 2;

    display: flex;
    align-items: center;
    gap: 5px;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;

    transform: translate(-50%, -50%);

    transition:
        transform .17s ease,
        filter .17s ease;
}

.parcel-marker:hover[b-7bxp0721ur],
.parcel-marker.selected[b-7bxp0721ur] {
    z-index: 6;
    transform:
        translate(-50%, -50%)
        scale(1.10);
}

.parcel-marker.selected[b-7bxp0721ur] {
    filter:
        drop-shadow(
            0 7px 9px rgba(5, 62, 46, .28));
}

.marker-pin[b-7bxp0721ur] {
    display: grid;
    width: 39px;
    height: 39px;

    place-items: center;
    border: 4px solid #fff;
    border-radius: 50% 50% 50% 11px;

    color: #fff;
    background: var(--theme-primary);

    transform: rotate(-45deg);

    box-shadow:
        0 6px 13px rgba(5, 62, 46, .24);
}

.marker-pin > *[b-7bxp0721ur] {
    transform: rotate(45deg);
}

.parcel-marker.residential .marker-pin[b-7bxp0721ur] {
    background: #2f789f;
}

.parcel-marker.agriculture .marker-pin[b-7bxp0721ur] {
    background: #4d7c45;
}

.parcel-marker.commercial .marker-pin[b-7bxp0721ur] {
    background: #c07a2a;
}

.parcel-marker.industrial .marker-pin[b-7bxp0721ur] {
    background: #73569b;
}

.parcel-marker.public .marker-pin[b-7bxp0721ur] {
    background: var(--theme-primary);
}

.parcel-marker.vacant .marker-pin[b-7bxp0721ur] {
    background: #77857f;
}

.parcel-marker.selected .marker-pin[b-7bxp0721ur] {
    outline: 4px solid rgba(255, 211, 105, .46);
}

.marker-label[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 7px;
    border: 1px solid rgba(37, 67, 55, .12);
    border-radius: 8px;

    color: var(--theme-ink);
    background: rgba(255, 255, 255, .94);

    font-family: 'Kanit', sans-serif;
    font-size: .37rem;
    font-weight: 800;
    white-space: nowrap;

    box-shadow:
        0 6px 12px rgba(5, 62, 46, .12);
}

.parcel-marker.selected .marker-label[b-7bxp0721ur] {
    color: var(--theme-primary);
    border-color: rgba(10, 114, 87, .28);
    background: #fffdf7;
}

.gis-empty[b-7bxp0721ur] {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    color: #72837c;
}

.gis-empty strong[b-7bxp0721ur] {
    color: #40544b;
    font-size: .58rem;
}

.gis-empty small[b-7bxp0721ur] {
    font-size: .42rem;
}

.gis-footer[b-7bxp0721ur] {
    display: flex;
    min-height: 48px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 8px 12px;
    border-top: 1px solid rgba(10, 114, 87, .09);

    color: #72837c;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .39rem;
}

.gis-footer span:first-child[b-7bxp0721ur] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* =========================================================
   GOOGLE MAPS
   ========================================================= */

.google-map-tab[b-7bxp0721ur],
.landsmaps-tab[b-7bxp0721ur] {
    background: #fff;
}

.external-map-heading[b-7bxp0721ur] {
    display: flex;
    min-height: 70px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 12px 14px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .08),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.external-map-heading small[b-7bxp0721ur] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.external-map-heading h3[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.external-map-heading p[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: var(--theme-muted);
    font-size: .42rem;
}

.external-map-heading > span[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .40rem;
    font-weight: 700;
}

.google-map-tab iframe[b-7bxp0721ur] {
    display: block;
    width: 100%;
    min-height: 650px;

    border: 0;
    background: #edf2ef;
}

.map-tab-footer[b-7bxp0721ur] {
    display: flex;
    min-height: 50px;

    align-items: center;
    justify-content: flex-end;
    gap: 7px;

    padding: 8px 12px;
    border-top: 1px solid rgba(10, 114, 87, .08);

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.map-tab-footer button[b-7bxp0721ur],
.map-tab-footer a[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 700;
    text-decoration: none;
}

.map-tab-footer button[b-7bxp0721ur] {
    border: 1px solid rgba(10, 114, 87, .13);
    color: var(--theme-primary);
    background: #edf7f3;
    cursor: pointer;
}

.map-tab-footer a[b-7bxp0721ur] {
    border: 1px solid rgba(47, 120, 159, .14);
    color: #2f789f;
    background: #edf6fb;
}

.map-missing-state[b-7bxp0721ur] {
    display: flex;
    min-height: 650px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    color: #7b8c85;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.map-missing-state strong[b-7bxp0721ur] {
    color: #40544b;
    font-size: .59rem;
}

.map-missing-state small[b-7bxp0721ur] {
    font-size: .42rem;
}

/* =========================================================
   LANDSMAPS
   ========================================================= */

.landsmaps-helper[b-7bxp0721ur] {
    border-bottom: 1px solid rgba(10, 114, 87, .08);
}

.external-map-heading a[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(152, 118, 52, .14);
    border-radius: 9px;

    color: #987634;
    background: #fff7e8;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 700;
    text-decoration: none;
}

.landsmaps-search-data[b-7bxp0721ur] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 7px;
    padding: 11px 13px;
}

.landsmaps-search-data > div[b-7bxp0721ur] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(152, 118, 52, .09);
    border-radius: 10px;

    background: #fffbf3;
}

.landsmaps-search-data span[b-7bxp0721ur] {
    display: block;

    color: #987634;
    font-size: .39rem;
}

.landsmaps-search-data strong[b-7bxp0721ur] {
    display: block;
    margin-top: 5px;

    color: #4d5e56;
    font-size: .49rem;
}

.landsmaps-helper-actions[b-7bxp0721ur] {
    display: flex;
    gap: 7px;

    padding: 0 13px 11px;
}

.landsmaps-helper-actions a[b-7bxp0721ur],
.landsmaps-helper-actions button[b-7bxp0721ur] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 700;
    text-decoration: none;
}

.landsmaps-helper-actions a[b-7bxp0721ur] {
    color: #987634;
    border: 1px solid rgba(152, 118, 52, .14);
    background: #fff7e8;
}

.landsmaps-helper-actions button[b-7bxp0721ur] {
    color: var(--theme-primary);
    border: 1px solid rgba(10, 114, 87, .13);
    background: #edf7f3;
    cursor: pointer;
}

.landsmaps-note[b-7bxp0721ur] {
    margin: 0 13px 12px !important;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem !important;
    line-height: 1.65;
}

.landsmaps-frame-shell[b-7bxp0721ur] {
    min-height: 650px;
    background: #edf2ef;
}

.landsmaps-frame-shell iframe[b-7bxp0721ur] {
    display: block;
    width: 100%;
    min-height: 650px;

    border: 0;
    background: #fff;
}

.landsmaps-frame-footer[b-7bxp0721ur] {
    display: flex;
    min-height: 47px;

    align-items: center;
    gap: 7px;

    padding: 8px 12px;
    border-top: 1px solid rgba(181, 77, 67, .10);

    color: #8b665f;
    background: #fff9f7;

    font-size: .40rem;
}

/* =========================================================
   PARCEL DETAIL & GALLERY
   ========================================================= */

.parcel-detail-tab[b-7bxp0721ur] {
    padding: 14px;
    background: #f6f9f7;
}

.parcel-detail-summary[b-7bxp0721ur] {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);

    gap: 14px;
    overflow: hidden;

    padding: 13px;
    border: 1px solid rgba(10, 114, 87, .10);
    border-radius: 16px;

    background: #fff;

    box-shadow:
        0 12px 28px rgba(5, 62, 46, .06);
}

.detail-photo-cover[b-7bxp0721ur] {
    display: grid;
    min-height: 250px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.detail-photo-cover button[b-7bxp0721ur] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.detail-photo-cover img[b-7bxp0721ur] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-summary-content[b-7bxp0721ur] {
    min-width: 0;
}

.detail-summary-title[b-7bxp0721ur] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.detail-summary-title small[b-7bxp0721ur] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.detail-summary-title h3[b-7bxp0721ur] {
    margin: 4px 0 0;

    color: var(--theme-ink);
    font-size: .85rem;
}

.detail-summary-title p[b-7bxp0721ur] {
    margin: 4px 0 0;

    color: #75877f;
    font-size: .47rem;
}

.status-chip[b-7bxp0721ur] {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;

    align-items: center;
    gap: 5px;

    padding: 0 7px;
    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.status-chip i[b-7bxp0721ur] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.status-chip.active[b-7bxp0721ur] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.transfer-pending[b-7bxp0721ur] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.disputed[b-7bxp0721ur] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.leased[b-7bxp0721ur] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.mortgaged[b-7bxp0721ur] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.archived[b-7bxp0721ur] {
    color: #687872;
    background: #edf1ef;
}

.detail-metric-grid[b-7bxp0721ur] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 14px;
}

.detail-metric-grid > div[b-7bxp0721ur] {
    min-height: 70px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-metric-grid span[b-7bxp0721ur] {
    display: block;

    color: #87958f;
    font-size: .39rem;
}

.detail-metric-grid strong[b-7bxp0721ur] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
    line-height: 1.45;
}

.detail-address[b-7bxp0721ur] {
    display: flex;
    align-items: flex-start;
    gap: 6px;

    margin-top: 12px;
    padding: 10px;
    border: 1px solid rgba(47, 120, 159, .10);
    border-radius: 10px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .44rem;
    line-height: 1.55;
}

.parcel-gallery[b-7bxp0721ur] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;
    margin-top: 12px;
}

.gallery-card[b-7bxp0721ur] {
    position: relative;

    min-height: 185px;
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 13px;

    background: #fff;
    cursor: zoom-in;
}

.gallery-card img[b-7bxp0721ur] {
    width: 100%;
    height: 100%;
    min-height: 185px;

    object-fit: cover;
}

.gallery-card span[b-7bxp0721ur] {
    position: absolute;
    inset: auto 8px 8px 8px;

    display: inline-flex;
    min-height: 27px;

    align-items: center;
    justify-content: center;

    border-radius: 8px;

    color: #fff;
    background: rgba(5, 50, 40, .83);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;

    backdrop-filter: blur(7px);
}

.gallery-card.land span[b-7bxp0721ur] {
    background: rgba(77, 124, 69, .88);
}

.gallery-card.deed span[b-7bxp0721ur] {
    background: rgba(152, 118, 52, .89);
}

.gallery-card.map span[b-7bxp0721ur] {
    background: rgba(47, 120, 159, .89);
}

.gallery-card.document span[b-7bxp0721ur] {
    background: rgba(115, 86, 155, .89);
}

.gallery-empty[b-7bxp0721ur] {
    grid-column: 1 / -1;

    display: flex;
    min-height: 220px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(10, 114, 87, .18);
    border-radius: 13px;

    color: #7c8d86;
    background: #fff;
}

.gallery-empty strong[b-7bxp0721ur] {
    color: #40544b;
    font-size: .55rem;
}

/* =========================================================
   IMAGE PREVIEW
   ========================================================= */

.image-preview-backdrop[b-7bxp0721ur] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 18px;
    background: rgba(3, 20, 16, .74);

    backdrop-filter: blur(6px);
}

.image-preview-modal[b-7bxp0721ur] {
    width: min(1120px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 30px 80px rgba(0, 0, 0, .34);
}

.image-preview-header[b-7bxp0721ur] {
    display: flex;
    min-height: 64px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 10px 13px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.image-preview-header small[b-7bxp0721ur] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-7bxp0721ur] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.image-preview-body[b-7bxp0721ur] {
    display: grid;
    min-height: 420px;
    max-height: calc(100vh - 110px);
    overflow: auto;

    place-items: center;
    padding: 12px;

    background: #edf2ef;
}

.image-preview-body img[b-7bxp0721ur] {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;
    object-fit: contain;

    box-shadow:
        0 18px 40px rgba(5, 62, 46, .16);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1280px) {
    .map-workspace[b-7bxp0721ur] {
        grid-template-columns: 290px minmax(0, 1fr);
    }

    .landsMaps-search-data[b-7bxp0721ur],
    .landsmaps-search-data[b-7bxp0721ur] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .parcel-gallery[b-7bxp0721ur] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .map-hero[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-7bxp0721ur] {
        display: grid;
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .hero-status[b-7bxp0721ur] {
        grid-column: 1 / -1;
    }

    .map-workspace[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .parcel-list-panel[b-7bxp0721ur] {
        max-height: none;
    }

    .parcel-scroll-list[b-7bxp0721ur] {
        display: grid;
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        max-height: 440px;
    }

    .gis-canvas[b-7bxp0721ur],
    .google-map-tab iframe[b-7bxp0721ur],
    .landsmaps-frame-shell[b-7bxp0721ur],
    .landsmaps-frame-shell iframe[b-7bxp0721ur],
    .map-missing-state[b-7bxp0721ur] {
        min-height: 560px;
    }

    .parcel-detail-summary[b-7bxp0721ur] {
        grid-template-columns: 220px minmax(0, 1fr);
    }
}

@media (max-width: 780px) {
    .land-map-page[b-7bxp0721ur] {
        padding-top: 10px;
    }

    .land-map-container[b-7bxp0721ur] {
        padding-inline: 10px !important;
    }

    .map-hero[b-7bxp0721ur] {
        padding: 18px 15px;
        border-radius: 17px;
    }

    .filter-heading[b-7bxp0721ur],
    .map-main-header[b-7bxp0721ur],
    .external-map-heading[b-7bxp0721ur] {
        align-items: flex-start;
        flex-direction: column;
    }

    .filter-actions[b-7bxp0721ur],
    .selected-actions[b-7bxp0721ur] {
        width: 100%;
        justify-content: flex-start;
    }

    .hero-action-panel[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-status[b-7bxp0721ur] {
        grid-column: auto;
    }

    .parcel-scroll-list[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .gis-toolbar[b-7bxp0721ur],
    .gis-footer[b-7bxp0721ur],
    .map-tab-footer[b-7bxp0721ur] {
        align-items: flex-start;
        flex-direction: column;
    }

    .gis-canvas[b-7bxp0721ur],
    .google-map-tab iframe[b-7bxp0721ur],
    .landsmaps-frame-shell[b-7bxp0721ur],
    .landsmaps-frame-shell iframe[b-7bxp0721ur],
    .map-missing-state[b-7bxp0721ur] {
        min-height: 500px;
    }

    .landsmaps-search-data[b-7bxp0721ur] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .parcel-detail-summary[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .detail-photo-cover[b-7bxp0721ur] {
        max-height: 320px;
    }

    .detail-metric-grid[b-7bxp0721ur] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .parcel-gallery[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 560px) {
    .summary-card[b-7bxp0721ur] {
        grid-template-columns: 50px minmax(0, 1fr);
        min-height: 105px;
    }

    .summary-icon[b-7bxp0721ur] {
        width: 50px;
        height: 50px;
    }

    .map-legend[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .parcel-list-card[b-7bxp0721ur] {
        grid-template-columns: 58px minmax(0, 1fr);
    }

    .parcel-card-photo[b-7bxp0721ur] {
        width: 58px;
        height: 70px;
    }

    .marker-label[b-7bxp0721ur] {
        display: none;
    }

    .gis-canvas[b-7bxp0721ur],
    .google-map-tab iframe[b-7bxp0721ur],
    .landsmaps-frame-shell[b-7bxp0721ur],
    .landsmaps-frame-shell iframe[b-7bxp0721ur],
    .map-missing-state[b-7bxp0721ur] {
        min-height: 440px;
    }

    .landsmaps-search-data[b-7bxp0721ur],
    .detail-metric-grid[b-7bxp0721ur] {
        grid-template-columns: minmax(0, 1fr);
    }

    .landsmaps-helper-actions[b-7bxp0721ur] {
        flex-direction: column;
    }

    .landsmaps-helper-actions a[b-7bxp0721ur],
    .landsmaps-helper-actions button[b-7bxp0721ur] {
        width: 100%;
    }

    .image-preview-backdrop[b-7bxp0721ur] {
        padding: 8px;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/LandParcels.razor.rz.scp.css */
.land-page[b-og8qr2v7ok] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.land-page[b-og8qr2v7ok]  .land-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.land-hero[b-og8qr2v7ok] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-og8qr2v7ok] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-og8qr2v7ok] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-og8qr2v7ok] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-og8qr2v7ok] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-og8qr2v7ok] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-og8qr2v7ok] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-og8qr2v7ok] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-og8qr2v7ok] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-og8qr2v7ok] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-og8qr2v7ok] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-og8qr2v7ok] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-og8qr2v7ok] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.land-page[b-og8qr2v7ok]  .hero-add-button,
.land-page[b-og8qr2v7ok]  .search-button,
.land-page[b-og8qr2v7ok]  .toolbar-add-button,
.land-page[b-og8qr2v7ok]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.land-page[b-og8qr2v7ok]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-og8qr2v7ok] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-og8qr2v7ok] {
    opacity: .55;
    cursor: not-allowed;
}

.land-page[b-og8qr2v7ok]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.land-page[b-og8qr2v7ok]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-og8qr2v7ok] {
    margin-top: 7px;
}

.summary-card[b-og8qr2v7ok] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-og8qr2v7ok] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-og8qr2v7ok] {
    color: #2c7da8;
}

.summary-card.approved[b-og8qr2v7ok] {
    color: #7658a7;
}

.summary-card.incomplete[b-og8qr2v7ok] {
    color: #c05b4e;
}

.summary-line[b-og8qr2v7ok] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-og8qr2v7ok] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-og8qr2v7ok] {
    min-width: 0;
}

.summary-card small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-og8qr2v7ok] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-og8qr2v7ok] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-og8qr2v7ok] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-og8qr2v7ok],
.land-list-panel[b-og8qr2v7ok] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-og8qr2v7ok],
.list-toolbar[b-og8qr2v7ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-og8qr2v7ok],
.panel-kicker[b-og8qr2v7ok] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-og8qr2v7ok],
.list-toolbar h2[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-og8qr2v7ok],
.list-toolbar p[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-og8qr2v7ok] {
    align-items: center;
}

.land-page[b-og8qr2v7ok]  .premium-field,
.land-page[b-og8qr2v7ok]  .form-field {
    width: 100%;
}

.land-page[b-og8qr2v7ok]  .premium-field .mud-input-outlined-border,
.land-page[b-og8qr2v7ok]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.land-page[b-og8qr2v7ok]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.land-page[b-og8qr2v7ok]  .sort-select {
    width: 160px;
}

.land-page[b-og8qr2v7ok]  .toolbar-add-button {
    min-height: 42px;
}

.land-page[b-og8qr2v7ok]  .land-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.land-page[b-og8qr2v7ok]  .land-table .mud-table-head {
    background: #eef6f2;
}

.land-page[b-og8qr2v7ok]  .land-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-og8qr2v7ok] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-og8qr2v7ok],
.view-avatar[b-og8qr2v7ok] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-og8qr2v7ok],
.view-avatar.female[b-og8qr2v7ok] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-og8qr2v7ok],
.view-avatar.other[b-og8qr2v7ok] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-og8qr2v7ok] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-og8qr2v7ok],
.person-name small[b-og8qr2v7ok] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-og8qr2v7ok] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-og8qr2v7ok] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-og8qr2v7ok] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-og8qr2v7ok] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-og8qr2v7ok],
.area-cell[b-og8qr2v7ok],
.date-cell[b-og8qr2v7ok] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-og8qr2v7ok] {
    gap: 3px;
}

.contact-cell span[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-og8qr2v7ok],
.date-cell strong[b-og8qr2v7ok] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-og8qr2v7ok],
.date-cell small[b-og8qr2v7ok] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-og8qr2v7ok],
.document-chip[b-og8qr2v7ok],
.status-chip[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-og8qr2v7ok] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-og8qr2v7ok] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-og8qr2v7ok] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-og8qr2v7ok] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-og8qr2v7ok] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-og8qr2v7ok] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-og8qr2v7ok] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-og8qr2v7ok] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-og8qr2v7ok] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.land-page[b-og8qr2v7ok]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.land-page[b-og8qr2v7ok]  .row-action.view {
    color: #2d79a2;
}

.land-page[b-og8qr2v7ok]  .row-action.edit {
    color: var(--theme-primary);
}

.land-page[b-og8qr2v7ok]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.land-page[b-og8qr2v7ok]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-og8qr2v7ok] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-og8qr2v7ok] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-og8qr2v7ok] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-og8qr2v7ok] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-og8qr2v7ok] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.land-form-modal[b-og8qr2v7ok],
.land-view-modal[b-og8qr2v7ok],
.delete-modal[b-og8qr2v7ok] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-og8qr2v7ok .22s ease-out;
}

@keyframes modalAppear-b-og8qr2v7ok {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.land-form-modal[b-og8qr2v7ok] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-og8qr2v7ok] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-og8qr2v7ok] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-og8qr2v7ok] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-og8qr2v7ok] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-og8qr2v7ok] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-og8qr2v7ok] {
    margin-top: 24px;
}

.form-section-title > span[b-og8qr2v7ok] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-og8qr2v7ok] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-og8qr2v7ok] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-og8qr2v7ok] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-og8qr2v7ok] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-og8qr2v7ok] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.land-page[b-og8qr2v7ok]  .cancel-button,
.land-page[b-og8qr2v7ok]  .save-button,
.land-page[b-og8qr2v7ok]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.land-page[b-og8qr2v7ok]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.land-page[b-og8qr2v7ok]  .save-button {
    min-width: 170px;
}

.land-view-modal[b-og8qr2v7ok] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-og8qr2v7ok] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-og8qr2v7ok] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-og8qr2v7ok] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-og8qr2v7ok] {
    padding: 61px 24px 25px;
}

.view-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-og8qr2v7ok] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-og8qr2v7ok] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-og8qr2v7ok] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-og8qr2v7ok] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-og8qr2v7ok],
.view-address small[b-og8qr2v7ok],
.view-note small[b-og8qr2v7ok] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-og8qr2v7ok] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-og8qr2v7ok] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-og8qr2v7ok] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-og8qr2v7ok] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-og8qr2v7ok] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-og8qr2v7ok] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-og8qr2v7ok] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-og8qr2v7ok] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-og8qr2v7ok] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-og8qr2v7ok] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-og8qr2v7ok] {
    color: #963b36;
}

.delete-warning[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.land-page[b-og8qr2v7ok]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .land-hero[b-og8qr2v7ok] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-og8qr2v7ok] {
        max-width: 570px;
    }

    .list-toolbar[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-og8qr2v7ok] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .land-page[b-og8qr2v7ok] {
        padding: 15px 12px 30px;
    }

    .land-hero[b-og8qr2v7ok] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-og8qr2v7ok] {
        font-size: 2.3rem;
    }

    .hero-meta[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-og8qr2v7ok] {
        width: 100%;
    }

    .filter-heading[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }

    .land-page[b-og8qr2v7ok]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-og8qr2v7ok] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-og8qr2v7ok] {
        align-items: end;
        padding: 0;
    }

    .land-form-modal[b-og8qr2v7ok],
    .land-view-modal[b-og8qr2v7ok] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-og8qr2v7ok] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-og8qr2v7ok] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-og8qr2v7ok],
    .land-list-panel[b-og8qr2v7ok] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-og8qr2v7ok] {
        align-items: flex-start;
    }

    .modal-icon[b-og8qr2v7ok] {
        display: none;
    }

    .modal-footer[b-og8qr2v7ok] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .land-page[b-og8qr2v7ok]  .save-button {
        min-width: 0;
    }

    .view-heading[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-og8qr2v7ok],
    .land-form-modal[b-og8qr2v7ok],
    .land-view-modal[b-og8qr2v7ok],
    .delete-modal[b-og8qr2v7ok] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.land-page[b-og8qr2v7ok] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.land-hero[b-og8qr2v7ok] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.land-page[b-og8qr2v7ok]  .hero-add-button,
.land-page[b-og8qr2v7ok]  .toolbar-add-button,
.land-page[b-og8qr2v7ok]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-og8qr2v7ok] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-og8qr2v7ok] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-og8qr2v7ok] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-og8qr2v7ok] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.land-page[b-og8qr2v7ok]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-og8qr2v7ok] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-og8qr2v7ok] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-og8qr2v7ok] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-og8qr2v7ok] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-og8qr2v7ok] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-og8qr2v7ok] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-og8qr2v7ok] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-og8qr2v7ok] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-og8qr2v7ok] {
    background: #b54d43;
}

.status-overview-card div[b-og8qr2v7ok] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-og8qr2v7ok] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.parcel-code-photo-cell[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.parcel-photo-mini[b-og8qr2v7ok] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.parcel-photo-mini button[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.parcel-photo-mini img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.parcel-code-photo-cell strong[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.parcel-code-photo-cell small[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-og8qr2v7ok],
.applicant-cell[b-og8qr2v7ok],
.status-document-cell[b-og8qr2v7ok],
.officer-cell[b-og8qr2v7ok],
.fee-cell[b-og8qr2v7ok],
.due-cell[b-og8qr2v7ok] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-og8qr2v7ok] {
    min-width: 190px;
}

.project-cell strong[b-og8qr2v7ok],
.applicant-cell strong[b-og8qr2v7ok],
.officer-cell strong[b-og8qr2v7ok],
.fee-cell strong[b-og8qr2v7ok],
.due-cell strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-og8qr2v7ok],
.applicant-cell small[b-og8qr2v7ok],
.officer-cell small[b-og8qr2v7ok],
.due-cell small[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-og8qr2v7ok] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-og8qr2v7ok],
.due-cell.due-soon small[b-og8qr2v7ok] {
    color: #b14a40;
}

.permit-type-chip[b-og8qr2v7ok],
.priority-chip[b-og8qr2v7ok],
.document-chip[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-og8qr2v7ok],
.permit-type-chip.occupancy[b-og8qr2v7ok] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-og8qr2v7ok] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-og8qr2v7ok],
.permit-type-chip.factory[b-og8qr2v7ok] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-og8qr2v7ok],
.permit-type-chip.market[b-og8qr2v7ok] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-og8qr2v7ok] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-og8qr2v7ok] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-og8qr2v7ok],
.permit-type-chip.event[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-og8qr2v7ok] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-og8qr2v7ok] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-og8qr2v7ok] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-og8qr2v7ok] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-og8qr2v7ok] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-og8qr2v7ok] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-og8qr2v7ok],
.status-chip.inspection[b-og8qr2v7ok],
.status-chip.reviewing[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-og8qr2v7ok] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-og8qr2v7ok] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-og8qr2v7ok] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.land-photo-upload-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-og8qr2v7ok] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-og8qr2v7ok] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-og8qr2v7ok] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-og8qr2v7ok] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-og8qr2v7ok] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-og8qr2v7ok] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-og8qr2v7ok] {
    font-size: 1.8rem;
}

.photo-empty strong[b-og8qr2v7ok] {
    font-size: .48rem;
}

.photo-empty small[b-og8qr2v7ok] {
    font-size: .38rem;
}

.photo-upload-actions[b-og8qr2v7ok] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-og8qr2v7ok],
.remove-photo-button[b-og8qr2v7ok] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-og8qr2v7ok] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-og8qr2v7ok] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-og8qr2v7ok] {
    margin-top: 12px;
}

.land-form-modal[b-og8qr2v7ok] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.land-view-modal[b-og8qr2v7ok] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.land-identity-banner[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.land-identity-banner > div[b-og8qr2v7ok] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.land-banner-icon .mud-icon-root[b-og8qr2v7ok] {
    font-size: 1.7rem;
}

.land-identity-banner small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.land-identity-banner strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-og8qr2v7ok] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-og8qr2v7ok] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-og8qr2v7ok] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-og8qr2v7ok] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-og8qr2v7ok] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-og8qr2v7ok] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-og8qr2v7ok] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-og8qr2v7ok] {
    font-style: normal;
}

.approval-location-panel b[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-og8qr2v7ok] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-og8qr2v7ok] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-og8qr2v7ok] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-og8qr2v7ok] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-og8qr2v7ok] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-og8qr2v7ok] {
    display: grid;
    gap: 10px;
}

.three-columns[b-og8qr2v7ok] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-og8qr2v7ok] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-og8qr2v7ok] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-og8qr2v7ok] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-og8qr2v7ok] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-og8qr2v7ok] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-og8qr2v7ok] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-og8qr2v7ok] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-og8qr2v7ok] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-og8qr2v7ok] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-og8qr2v7ok] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-og8qr2v7ok] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-og8qr2v7ok] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .land-photo-upload-grid[b-og8qr2v7ok],
    .three-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .land-photo-upload-grid[b-og8qr2v7ok],
    .project-summary-grid[b-og8qr2v7ok],
    .inspection-note-grid[b-og8qr2v7ok],
    .three-columns[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-og8qr2v7ok] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-og8qr2v7ok] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-og8qr2v7ok] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-og8qr2v7ok] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-og8qr2v7ok],
    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
        min-height: 72px;
    }

    .view-toolbar[b-og8qr2v7ok] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-og8qr2v7ok] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-og8qr2v7ok],
    .land-page[b-og8qr2v7ok]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.land-page[b-og8qr2v7ok] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.land-hero[b-og8qr2v7ok] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-og8qr2v7ok] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-og8qr2v7ok] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-og8qr2v7ok] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-og8qr2v7ok] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.land-page[b-og8qr2v7ok]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-og8qr2v7ok] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-og8qr2v7ok] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-og8qr2v7ok] {
    background: #73569b;
}

.status-overview-card.completed > span[b-og8qr2v7ok] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-og8qr2v7ok] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-og8qr2v7ok] {
    background: #b54d43;
}

.parcel-code-photo-cell[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.parcel-photo-mini[b-og8qr2v7ok] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.parcel-photo-mini button[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.parcel-photo-mini img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.parcel-code-photo-cell strong[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.parcel-code-photo-cell small[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-og8qr2v7ok],
.appointment-cell[b-og8qr2v7ok],
.team-cell[b-og8qr2v7ok],
.status-result-cell[b-og8qr2v7ok],
.applicant-cell[b-og8qr2v7ok],
.notification-cell[b-og8qr2v7ok] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-og8qr2v7ok] {
    min-width: 190px;
}

.project-cell strong[b-og8qr2v7ok],
.appointment-cell strong[b-og8qr2v7ok],
.team-cell strong[b-og8qr2v7ok],
.applicant-cell strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-og8qr2v7ok],
.appointment-cell small[b-og8qr2v7ok],
.team-cell small[b-og8qr2v7ok],
.applicant-cell small[b-og8qr2v7ok],
.notification-cell small[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-og8qr2v7ok],
.team-cell em[b-og8qr2v7ok],
.applicant-cell em[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-og8qr2v7ok],
.appointment-cell.overdue small[b-og8qr2v7ok] {
    color: #b0443b;
}

.status-result-cell[b-og8qr2v7ok] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-og8qr2v7ok] {
    align-items: flex-start;
}

.notification-cell > span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-og8qr2v7ok] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-og8qr2v7ok] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-og8qr2v7ok] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-og8qr2v7ok] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-og8qr2v7ok] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-og8qr2v7ok] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-og8qr2v7ok] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-og8qr2v7ok] {
    font-size: 2rem;
}

.source-priority[b-og8qr2v7ok] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-og8qr2v7ok] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-og8qr2v7ok] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-og8qr2v7ok] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-og8qr2v7ok] {
    padding: 10px;
}

.source-picker-content > small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-og8qr2v7ok] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-og8qr2v7ok] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-og8qr2v7ok] {
    margin-bottom: 16px;
}

.locked-application-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-og8qr2v7ok] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-og8qr2v7ok] {
    font-size: 2.4rem;
}

.locked-application-content[b-og8qr2v7ok] {
    min-width: 0;
}

.locked-application-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-og8qr2v7ok] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-og8qr2v7ok] {
    grid-column: span 2;
}

.locked-application-grid span[b-og8qr2v7ok] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-og8qr2v7ok],
.source-panel-actions button[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-og8qr2v7ok] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.land-photo-upload-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.land-form-modal[b-og8qr2v7ok] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.land-view-modal[b-og8qr2v7ok] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.land-identity-banner[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.land-identity-banner > div[b-og8qr2v7ok] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.land-banner-icon .mud-icon-root[b-og8qr2v7ok] {
    font-size: 1.7rem;
}

.land-identity-banner small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.land-identity-banner strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-og8qr2v7ok] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-og8qr2v7ok] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-og8qr2v7ok] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-og8qr2v7ok] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-og8qr2v7ok] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-og8qr2v7ok] {
    font-style: normal;
}

.approval-location-panel b[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-og8qr2v7ok] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-og8qr2v7ok] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-og8qr2v7ok] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-og8qr2v7ok] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-og8qr2v7ok] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-og8qr2v7ok] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-og8qr2v7ok] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-og8qr2v7ok] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-og8qr2v7ok] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-og8qr2v7ok] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-og8qr2v7ok] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-og8qr2v7ok] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-og8qr2v7ok] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-og8qr2v7ok] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-og8qr2v7ok] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-og8qr2v7ok],
    .five-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-og8qr2v7ok] {
        max-height: 310px;
    }

    .locked-application-grid[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-og8qr2v7ok],
    .five-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-og8qr2v7ok],
    .land-photo-upload-grid[b-og8qr2v7ok],
    .inspection-note-grid[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-og8qr2v7ok],
    .five-columns[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-og8qr2v7ok] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-og8qr2v7ok] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .land-identity-banner[b-og8qr2v7ok],
    .locked-application-grid[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-og8qr2v7ok] {
        grid-column: auto;
    }

    .locked-application-heading[b-og8qr2v7ok] {
        flex-direction: column;
    }

    .locked-application-badges[b-og8qr2v7ok] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.land-page[b-og8qr2v7ok] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.land-hero[b-og8qr2v7ok] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-og8qr2v7ok] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-og8qr2v7ok] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-og8qr2v7ok] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-og8qr2v7ok] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-og8qr2v7ok] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-og8qr2v7ok] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-og8qr2v7ok] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.land-page[b-og8qr2v7ok]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-og8qr2v7ok] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-og8qr2v7ok] {
    background: #73569b;
}

.status-overview-card.revision > span[b-og8qr2v7ok] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-og8qr2v7ok] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-og8qr2v7ok] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-og8qr2v7ok] {
    background: #9f4139;
}

.source-note[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.parcel-code-photo-cell[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.parcel-photo-mini[b-og8qr2v7ok] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.parcel-photo-mini button[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.parcel-photo-mini img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.parcel-code-photo-cell strong[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.parcel-code-photo-cell small[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-og8qr2v7ok],
.inspection-result-cell[b-og8qr2v7ok],
.status-recommendation-cell[b-og8qr2v7ok],
.reviewer-cell[b-og8qr2v7ok],
.decision-cell[b-og8qr2v7ok],
.permit-fee-cell[b-og8qr2v7ok] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-og8qr2v7ok] {
    min-width: 190px;
}

.project-cell strong[b-og8qr2v7ok],
.inspection-result-cell strong[b-og8qr2v7ok],
.reviewer-cell strong[b-og8qr2v7ok],
.decision-cell strong[b-og8qr2v7ok],
.permit-fee-cell strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-og8qr2v7ok],
.inspection-result-cell small[b-og8qr2v7ok],
.reviewer-cell small[b-og8qr2v7ok],
.decision-cell small[b-og8qr2v7ok],
.permit-fee-cell small[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-og8qr2v7ok] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-og8qr2v7ok] {
    gap: 4px;
}

.decision-cell.overdue strong[b-og8qr2v7ok],
.decision-cell.overdue small[b-og8qr2v7ok] {
    color: #ad4037;
}

.permit-fee-cell > span[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-og8qr2v7ok],
.recommendation-chip[b-og8qr2v7ok],
.final-decision-chip[b-og8qr2v7ok],
.inspection-result-chip[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-og8qr2v7ok] {
    gap: 5px;
}

.review-status-chip > i[b-og8qr2v7ok] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-og8qr2v7ok] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-og8qr2v7ok] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-og8qr2v7ok] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-og8qr2v7ok] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-og8qr2v7ok] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-og8qr2v7ok] {
    font-size: 2.4rem;
}

.locked-source-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-og8qr2v7ok] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-og8qr2v7ok] {
    grid-column: span 2;
}

.locked-source-grid span[b-og8qr2v7ok] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.land-photo-upload-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.land-form-modal[b-og8qr2v7ok] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.land-view-modal[b-og8qr2v7ok] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.land-identity-banner[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.land-identity-banner > div[b-og8qr2v7ok] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.land-banner-icon .mud-icon-root[b-og8qr2v7ok] {
    font-size: 1.7rem;
}

.land-identity-banner small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.land-identity-banner strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-og8qr2v7ok] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-og8qr2v7ok] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-og8qr2v7ok] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-og8qr2v7ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-og8qr2v7ok] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-og8qr2v7ok] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-og8qr2v7ok] {
    font-style: normal;
}

.approval-location-panel b[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-og8qr2v7ok] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-og8qr2v7ok] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-og8qr2v7ok] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-og8qr2v7ok] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-og8qr2v7ok],
.condition-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-og8qr2v7ok],
.condition-grid > div[b-og8qr2v7ok] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-og8qr2v7ok] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-og8qr2v7ok] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-og8qr2v7ok] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-og8qr2v7ok] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-og8qr2v7ok] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-og8qr2v7ok] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-og8qr2v7ok] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-og8qr2v7ok],
.condition-grid small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-og8qr2v7ok],
.condition-grid p[b-og8qr2v7ok] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-og8qr2v7ok] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-og8qr2v7ok] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-og8qr2v7ok] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-og8qr2v7ok] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-og8qr2v7ok] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-og8qr2v7ok],
    .six-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-og8qr2v7ok] {
        max-height: 320px;
    }

    .locked-source-grid[b-og8qr2v7ok],
    .decision-summary-grid[b-og8qr2v7ok],
    .six-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .land-photo-upload-grid[b-og8qr2v7ok],
    .opinion-grid[b-og8qr2v7ok],
    .condition-grid[b-og8qr2v7ok],
    .decision-summary-grid[b-og8qr2v7ok],
    .six-columns[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-og8qr2v7ok] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-og8qr2v7ok] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .land-identity-banner[b-og8qr2v7ok],
    .locked-source-grid[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-og8qr2v7ok] {
        grid-column: auto;
    }

    .locked-source-heading[b-og8qr2v7ok] {
        flex-direction: column;
    }

    .locked-source-badges[b-og8qr2v7ok] {
        justify-content: flex-start;
    }
}


/* =========================================================
   LAND PARCEL REGISTRY PREMIUM EXTENSIONS
   ========================================================= */

.land-page[b-og8qr2v7ok] {
    --land-green: var(--theme-primary);
    --land-deep: var(--theme-dark);
    --land-gold: var(--theme-accent);
    --land-blue: #2f789f;
    --land-purple: #73569b;
    --land-red: #b54d43;
}

.land-hero[b-og8qr2v7ok] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .27),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.summary-card.total[b-og8qr2v7ok] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.area[b-og8qr2v7ok] {
    --summary-accent: #4d7c45;
    --summary-soft: #edf6e9;
    --summary-border: rgba(77, 124, 69, .20);
}

.summary-card.value[b-og8qr2v7ok] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.coordinate[b-og8qr2v7ok] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.land-page[b-og8qr2v7ok]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-og8qr2v7ok] {
    background: #397a4c;
}

.status-overview-card.transfer > span[b-og8qr2v7ok] {
    background: #b27a25;
}

.status-overview-card.disputed > span[b-og8qr2v7ok] {
    background: #b54d43;
}

.status-overview-card.coordinate > span[b-og8qr2v7ok] {
    background: #2f789f;
}

.status-overview-card.missing > span[b-og8qr2v7ok] {
    background: #7d665f;
}

.status-overview-card.review > span[b-og8qr2v7ok] {
    background: #73569b;
}

.parcel-code-photo-cell[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 150px;
    align-items: center;
    gap: 8px;
}

.parcel-photo-mini[b-og8qr2v7ok] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.parcel-photo-mini button[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.parcel-photo-mini img[b-og8qr2v7ok] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.parcel-code-photo-cell strong[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.parcel-code-photo-cell small[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .40rem;
    font-weight: 650;
}

.owner-cell[b-og8qr2v7ok],
.area-cell[b-og8qr2v7ok],
.location-cell[b-og8qr2v7ok],
.value-cell[b-og8qr2v7ok],
.status-review-cell[b-og8qr2v7ok] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.owner-cell[b-og8qr2v7ok],
.location-cell[b-og8qr2v7ok] {
    min-width: 180px;
}

.owner-cell strong[b-og8qr2v7ok],
.area-cell strong[b-og8qr2v7ok],
.location-cell strong[b-og8qr2v7ok],
.value-cell strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.owner-cell small[b-og8qr2v7ok],
.area-cell small[b-og8qr2v7ok],
.location-cell small[b-og8qr2v7ok],
.value-cell small[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.owner-cell em[b-og8qr2v7ok],
.value-cell em[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.location-cell a[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;

    align-items: center;
    gap: 4px;

    margin-top: 6px;
    padding: 0 7px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 999px;

    color: #2f789f;
    background: #edf6fb;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.missing-coordinate[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 6px;
    padding: 0 7px;

    border-radius: 999px;

    color: #775f59;
    background: #f0e9e7;

    font-size: .38rem;
    font-style: normal;
    font-weight: 700;
}

.status-review-cell[b-og8qr2v7ok] {
    align-items: flex-start;
    gap: 5px;
}

.owner-type-chip[b-og8qr2v7ok],
.usage-chip[b-og8qr2v7ok],
.land-type-chip[b-og8qr2v7ok],
.coordinate-ready-chip[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    gap: 4px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.owner-type-chip.person[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-type-chip.company[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.owner-type-chip.government[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.owner-type-chip.community[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.residential[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-og8qr2v7ok] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.land-type-chip.chanote[b-og8qr2v7ok] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.land-type-chip.ns3k[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.land-type-chip.ns3[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.land-type-chip.sk1[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.land-type-chip.other[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.active[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.transfer-pending[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.disputed[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.leased[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.mortgaged[b-og8qr2v7ok] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.archived[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.review-badge[b-og8qr2v7ok] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.review-badge.normal[b-og8qr2v7ok] {
    color: #34734b;
    background: #e7f5ec;
}

.review-badge.due[b-og8qr2v7ok] {
    color: #9d671c;
    background: #fff0d8;
}

.review-badge.overdue[b-og8qr2v7ok] {
    color: #ad4037;
    background: #fff0ee;
}

.review-badge.none[b-og8qr2v7ok] {
    color: #687872;
    background: #edf1ef;
}

.row-map-action[b-og8qr2v7ok] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

.coordinate-form-panel[b-og8qr2v7ok] {
    overflow: hidden;

    margin-bottom: 16px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .09),
            transparent 18rem),
        #f5fafc;
}

.coordinate-action-card[b-og8qr2v7ok] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: center;

    border: 1px solid rgba(47, 120, 159, .10);
    border-radius: 12px;

    background: #fff;
}

.coordinate-action-card a[b-og8qr2v7ok],
.coordinate-action-card span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.coordinate-action-card a[b-og8qr2v7ok] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-action-card span[b-og8qr2v7ok] {
    color: #75867f;
    background: #edf2ef;
}

.map-preview[b-og8qr2v7ok],
.google-map-panel[b-og8qr2v7ok] {
    overflow: hidden;

    margin-top: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 15px;

    background: #fff;
}

.map-preview iframe[b-og8qr2v7ok] {
    display: block;
    width: 100%;
    height: 300px;

    border: 0;
}

.map-empty[b-og8qr2v7ok] {
    display: flex;
    min-height: 220px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    margin-top: 12px;
    border: 1px dashed rgba(47, 120, 159, .22);
    border-radius: 15px;

    color: #2f789f;
    background: rgba(255, 255, 255, .65);
}

.map-empty strong[b-og8qr2v7ok] {
    color: #40554c;
    font-size: .55rem;
}

.map-empty small[b-og8qr2v7ok] {
    color: #7e8d87;
    font-size: .42rem;
}

.area-summary-card[b-og8qr2v7ok] {
    display: flex;
    min-height: 58px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 0 13px;
    border: 1px solid rgba(77, 124, 69, .12);
    border-radius: 12px;

    background: #f2f8ef;
}

.area-summary-card span[b-og8qr2v7ok] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #43763d;
    font-size: .44rem;
    font-weight: 700;
}

.area-summary-card strong[b-og8qr2v7ok] {
    color: #355047;
    font-size: .54rem;
}

.land-photo-upload-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;
}

.land-form-modal[b-og8qr2v7ok] {
    width: min(1220px, calc(100vw - 28px)) !important;
}

.land-view-modal[b-og8qr2v7ok] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.land-identity-banner[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.land-identity-banner > div[b-og8qr2v7ok] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.land-banner-icon .mud-icon-root[b-og8qr2v7ok] {
    font-size: 1.7rem;
}

.land-identity-banner small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.land-identity-banner strong[b-og8qr2v7ok] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.coordinate-ready-chip[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-summary-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(10, 114, 87, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.owner-summary-icon[b-og8qr2v7ok] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.owner-summary-panel small[b-og8qr2v7ok] {
    color: var(--theme-primary);
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-summary-panel h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.owner-summary-panel p[b-og8qr2v7ok] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
}

.owner-summary-panel em[b-og8qr2v7ok] {
    display: block;
    margin-top: 5px;

    color: #987634;
    font-size: .43rem;
    font-style: normal;
}

.area-value-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.area-value-grid article[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);

    min-height: 82px;
    align-items: center;
    gap: 9px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 13px;

    background: #fff;
}

.area-value-grid article > span[b-og8qr2v7ok] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #4d7c45;
    background: #edf6e9;
}

.area-value-grid article:nth-child(2) > span[b-og8qr2v7ok] {
    color: #987634;
    background: #fff4df;
}

.area-value-grid article:nth-child(3) > span[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.area-value-grid article:nth-child(4) > span[b-og8qr2v7ok] {
    color: #73569b;
    background: #f0eafb;
}

.area-value-grid div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.area-value-grid small[b-og8qr2v7ok] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.area-value-grid strong[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #34483f;
    font-size: .62rem;
}

.area-value-grid em[b-og8qr2v7ok] {
    color: #72837c;
    font-size: .38rem;
    font-style: normal;
}

.land-location-panel[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.land-location-panel > span[b-og8qr2v7ok] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.land-location-panel small[b-og8qr2v7ok] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.land-location-panel h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .66rem;
}

.land-location-panel p[b-og8qr2v7ok] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.55;
}

.land-location-panel b[b-og8qr2v7ok] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.land-location-panel a[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-og8qr2v7ok] {
    margin-top: 13px;
    padding: 0;
}

.map-heading[b-og8qr2v7ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 12px 13px;
}

.map-heading small[b-og8qr2v7ok] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-og8qr2v7ok] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.map-heading > span[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .40rem;
    font-weight: 700;
}

.google-map-panel iframe[b-og8qr2v7ok] {
    display: block;
    width: 100%;
    height: 360px;

    border: 0;
}

.map-not-available[b-og8qr2v7ok] {
    display: flex;
    min-height: 110px;

    align-items: center;
    justify-content: center;
    gap: 10px;

    margin-top: 13px;
    padding: 15px;

    border: 1px dashed rgba(181, 77, 67, .22);
    border-radius: 15px;

    color: #ad4037;
    background: #fff8f6;
}

.map-not-available div[b-og8qr2v7ok] {
    display: flex;
    flex-direction: column;
}

.map-not-available strong[b-og8qr2v7ok] {
    color: #6e4944;
    font-size: .54rem;
}

.map-not-available small[b-og8qr2v7ok] {
    margin-top: 3px;

    color: #967c77;
    font-size: .42rem;
}

.boundary-panel[b-og8qr2v7ok] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(77, 124, 69, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(77, 124, 69, .09),
            transparent 18rem),
        #f8fbf7;
}

.boundary-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.boundary-grid > div[b-og8qr2v7ok],
.access-grid > div[b-og8qr2v7ok] {
    min-height: 76px;
    padding: 10px;

    border: 1px solid rgba(77, 124, 69, .08);
    border-radius: 11px;

    background: #fff;
}

.boundary-grid span[b-og8qr2v7ok],
.access-grid span[b-og8qr2v7ok] {
    color: #4d7c45;
    font-size: .41rem;
    font-weight: 700;
}

.boundary-grid strong[b-og8qr2v7ok],
.access-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 6px;

    color: #45564f;
    font-size: .49rem;
    line-height: 1.55;
}

.boundary-grid .north[b-og8qr2v7ok] {
    border-top: 3px solid #2f789f;
}

.boundary-grid .east[b-og8qr2v7ok] {
    border-top: 3px solid #987634;
}

.boundary-grid .south[b-og8qr2v7ok] {
    border-top: 3px solid #4d7c45;
}

.boundary-grid .west[b-og8qr2v7ok] {
    border-top: 3px solid #73569b;
}

.access-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 8px;
}

.land-info-grid[b-og8qr2v7ok] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.land-info-grid > div[b-og8qr2v7ok] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.land-info-grid span[b-og8qr2v7ok] {
    display: block;

    color: #87958f;
    font-size: .40rem;
}

.land-info-grid strong[b-og8qr2v7ok] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
}

.remark-panel[b-og8qr2v7ok] {
    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(199, 163, 93, .12);
    border-radius: 12px;

    background: #fffbf2;
}

.remark-panel small[b-og8qr2v7ok] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.remark-panel p[b-og8qr2v7ok] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.four-columns[b-og8qr2v7ok] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-og8qr2v7ok] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-og8qr2v7ok] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-og8qr2v7ok] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.document > span[b-og8qr2v7ok] {
    color: #73569b;
    background: #f0eafb;
}

@media (max-width: 1380px) {
    .land-photo-upload-grid[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .area-value-grid[b-og8qr2v7ok],
    .boundary-grid[b-og8qr2v7ok],
    .land-info-grid[b-og8qr2v7ok],
    .four-columns[b-og8qr2v7ok] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .google-map-panel iframe[b-og8qr2v7ok],
    .map-preview iframe[b-og8qr2v7ok] {
        height: 300px;
    }
}

@media (max-width: 780px) {
    .land-photo-upload-grid[b-og8qr2v7ok],
    .area-value-grid[b-og8qr2v7ok],
    .boundary-grid[b-og8qr2v7ok],
    .access-grid[b-og8qr2v7ok],
    .land-info-grid[b-og8qr2v7ok],
    .four-columns[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .land-location-panel[b-og8qr2v7ok] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .land-location-panel a[b-og8qr2v7ok] {
        grid-column: 1 / -1;
    }

    .area-summary-card[b-og8qr2v7ok] {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .land-identity-banner[b-og8qr2v7ok] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .land-identity-banner .land-banner-icon[b-og8qr2v7ok] {
        min-height: 72px;
    }

    .map-heading[b-og8qr2v7ok] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-og8qr2v7ok],
    .map-preview iframe[b-og8qr2v7ok] {
        height: 260px;
    }
}


/* =========================================================
   LANDSMAPS INTERNAL LOOKUP INTEGRATION
   ========================================================= */

.hero-landsmaps-button[b-og8qr2v7ok] {
    min-height: 40px !important;

    border-color: rgba(242, 217, 153, .27) !important;
    border-radius: 11px !important;

    color: #f4dda6 !important;
    background: rgba(242, 217, 153, .08) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .45rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.hero-landsmaps-button:hover[b-og8qr2v7ok] {
    border-color: rgba(242, 217, 153, .46) !important;
    background: rgba(242, 217, 153, .15) !important;
}

.row-landsmaps-action[b-og8qr2v7ok] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(152, 118, 52, .15);
    border-radius: 9px;

    color: #987634;
    background: #fff7e8;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}

.row-landsmaps-action:hover[b-og8qr2v7ok] {
    transform: translateY(-1px);
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

.view-landsmaps-button[b-og8qr2v7ok] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .18);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.view-landsmaps-button:hover[b-og8qr2v7ok] {
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

@media (max-width: 650px) {
    .view-landsmaps-button[b-og8qr2v7ok] {
        width: 100%;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/LandsMapsLookup.razor.rz.scp.css */
:root[b-xn8eubgpu5] {
    --lm-green: var(--theme-primary);
    --lm-deep: var(--theme-dark);
    --lm-gold: var(--theme-accent);
    --lm-blue: #2f789f;
}

.landsmaps-page[b-xn8eubgpu5] {
    min-height: 100vh;
    padding: 18px 0 30px;

    color: #32483f;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(10, 114, 87, .08),
            transparent 28rem),
        var(--theme-bg);

    font-family: 'Kanit', sans-serif;
}

.landsmaps-container[b-xn8eubgpu5] {
    width: 100%;
    padding-inline: 18px !important;
}

.lookup-hero[b-xn8eubgpu5] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;

    gap: 18px;
    overflow: hidden;

    padding: 24px;
    border-radius: 22px;

    color: #fff;
    background:
        radial-gradient(
            circle at 88% 5%,
            rgba(199, 163, 93, .28),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%);

    box-shadow:
        0 20px 50px rgba(5, 62, 46, .18);
}

.hero-pattern[b-xn8eubgpu5] {
    position: absolute;
    inset: 0;

    opacity: .22;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .045) 1px,
            transparent 1px),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .045) 1px,
            transparent 1px);

    background-size: 28px 28px;
}

.hero-gold-line[b-xn8eubgpu5] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;

    background:
        linear-gradient(
            #f1d89b,
            #a87c32,
            #f1d89b);
}

.lookup-hero-content[b-xn8eubgpu5],
.lookup-hero-actions[b-xn8eubgpu5] {
    position: relative;
    z-index: 1;
}

.lookup-badge[b-xn8eubgpu5] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);

    align-items: center;
    gap: 10px;

    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 14px;

    background: rgba(255, 255, 255, .07);
}

.lookup-badge > span[b-xn8eubgpu5] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.lookup-badge div[b-xn8eubgpu5] {
    display: flex;
    flex-direction: column;
}

.lookup-badge small[b-xn8eubgpu5] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.lookup-badge strong[b-xn8eubgpu5] {
    margin-top: 3px;

    font-size: .58rem;
}

.lookup-hero h1[b-xn8eubgpu5] {
    margin: 17px 0 0;

    font-size: clamp(1.4rem, 3vw, 2.25rem);
    line-height: 1.2;
}

.lookup-hero p[b-xn8eubgpu5] {
    max-width: 820px;
    margin: 10px 0 0;

    color: rgba(255, 255, 255, .78);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-xn8eubgpu5] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    margin-top: 15px;
}

.hero-meta span[b-xn8eubgpu5] {
    display: inline-flex;
    min-height: 29px;

    align-items: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 999px;

    color: rgba(255, 255, 255, .83);
    background: rgba(255, 255, 255, .06);

    font-size: .43rem;
    font-weight: 650;
}

.lookup-hero-actions[b-xn8eubgpu5] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.external-open-button[b-xn8eubgpu5],
.back-registry-button[b-xn8eubgpu5] {
    display: inline-flex;
    min-height: 43px;

    align-items: center;
    justify-content: center;
    gap: 7px;

    padding: 0 12px;
    border-radius: 12px;

    font-family: 'Kanit', sans-serif;
    font-size: .48rem;
    font-weight: 700;
    text-decoration: none;
}

.external-open-button[b-xn8eubgpu5] {
    color: #fff;
    border: 1px solid rgba(242, 217, 153, .25);
    background:
        linear-gradient(
            145deg,
            var(--theme-accent),
            #987634);
}

.back-registry-button[b-xn8eubgpu5] {
    color: rgba(255, 255, 255, .88);
    border: 1px solid rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .07);
}

.lookup-workspace[b-xn8eubgpu5] {
    display: grid;
    grid-template-columns: 330px minmax(0, 1fr);

    gap: 14px;
    margin-top: 15px;
}

.lookup-helper-panel[b-xn8eubgpu5],
.official-site-panel[b-xn8eubgpu5] {
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 14px 35px rgba(5, 62, 46, .07);
}

.lookup-helper-panel[b-xn8eubgpu5] {
    align-self: start;
    padding: 15px;
}

.panel-heading[b-xn8eubgpu5] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    align-items: center;
    gap: 10px;

    margin-bottom: 13px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);
}

.panel-heading > span[b-xn8eubgpu5] {
    display: grid;
    width: 50px;
    height: 50px;

    place-items: center;
    border-radius: 14px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.panel-heading small[b-xn8eubgpu5],
.official-site-header small[b-xn8eubgpu5] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.panel-heading h2[b-xn8eubgpu5],
.official-site-header h2[b-xn8eubgpu5] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.panel-heading p[b-xn8eubgpu5] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .42rem;
}

.lookup-field[b-xn8eubgpu5] {
    margin-top: 8px !important;
}

.search-summary-card[b-xn8eubgpu5] {
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    margin-top: 12px;
    padding: 10px;

    border: 1px solid rgba(199, 163, 93, .13);
    border-radius: 12px;

    background: #fffbf2;
}

.search-summary-card > span[b-xn8eubgpu5] {
    display: grid;
    width: 43px;
    height: 43px;

    place-items: center;
    border-radius: 12px;

    color: #987634;
    background: #fff1d4;
}

.search-summary-card div[b-xn8eubgpu5] {
    display: flex;
    min-width: 0;

    flex-direction: column;
}

.search-summary-card small[b-xn8eubgpu5] {
    color: #987634;
    font-size: .40rem;
}

.search-summary-card strong[b-xn8eubgpu5] {
    margin-top: 3px;

    color: #4c5e56;
    font-size: .47rem;
    line-height: 1.55;
}

.lookup-note[b-xn8eubgpu5],
.lookup-warning[b-xn8eubgpu5] {
    margin-top: 11px !important;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem !important;
    line-height: 1.65;
}

.reload-frame-button[b-xn8eubgpu5] {
    display: inline-flex;
    width: 100%;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 11px;
    border: 0;
    border-radius: 11px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    font-family: 'Kanit', sans-serif;
    font-size: .46rem;
    font-weight: 700;
    cursor: pointer;
}

.official-site-panel[b-xn8eubgpu5] {
    min-width: 0;
    overflow: hidden;
}

.official-site-header[b-xn8eubgpu5] {
    display: flex;
    min-height: 67px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 10px 13px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.official-site-header > div[b-xn8eubgpu5] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.official-dot[b-xn8eubgpu5] {
    display: inline-block;
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: #26b477;

    box-shadow:
        0 0 0 5px rgba(38, 180, 119, .12);
}

.official-site-header a[b-xn8eubgpu5] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.iframe-shell[b-xn8eubgpu5] {
    min-height: 760px;
    background: #edf2ef;
}

.iframe-shell iframe[b-xn8eubgpu5] {
    display: block;
    width: 100%;
    min-height: 760px;

    border: 0;
    background: #fff;
}

.official-site-footer[b-xn8eubgpu5] {
    display: flex;
    min-height: 46px;

    align-items: center;
    gap: 7px;

    padding: 8px 12px;
    border-top: 1px solid rgba(10, 114, 87, .08);

    color: #72837c;
    background: #fafcfb;

    font-size: .41rem;
    line-height: 1.6;
}

@media (max-width: 1050px) {
    .lookup-hero[b-xn8eubgpu5] {
        grid-template-columns: minmax(0, 1fr);
    }

    .lookup-hero-actions[b-xn8eubgpu5] {
        flex-direction: row;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .lookup-workspace[b-xn8eubgpu5] {
        grid-template-columns: minmax(0, 1fr);
    }

    .lookup-helper-panel[b-xn8eubgpu5] {
        position: static;
    }

    .iframe-shell[b-xn8eubgpu5],
    .iframe-shell iframe[b-xn8eubgpu5] {
        min-height: 680px;
    }
}

@media (max-width: 650px) {
    .landsmaps-page[b-xn8eubgpu5] {
        padding-top: 9px;
    }

    .landsmaps-container[b-xn8eubgpu5] {
        padding-inline: 9px !important;
    }

    .lookup-hero[b-xn8eubgpu5] {
        padding: 18px 15px;
        border-radius: 16px;
    }

    .lookup-badge[b-xn8eubgpu5] {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .lookup-badge > span[b-xn8eubgpu5] {
        width: 40px;
        height: 40px;
    }

    .lookup-hero-actions[b-xn8eubgpu5] {
        flex-direction: column;
    }

    .official-site-header[b-xn8eubgpu5] {
        align-items: flex-start;
        flex-direction: column;
    }

    .iframe-shell[b-xn8eubgpu5],
    .iframe-shell iframe[b-xn8eubgpu5] {
        min-height: 620px;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/PropertyValuations.razor.rz.scp.css */
.valuation-page[b-pycjyidc4f] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.valuation-page[b-pycjyidc4f]  .valuation-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.valuation-hero[b-pycjyidc4f] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-pycjyidc4f] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-pycjyidc4f] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-pycjyidc4f] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-pycjyidc4f] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-pycjyidc4f] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-pycjyidc4f] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-pycjyidc4f] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-pycjyidc4f] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-pycjyidc4f] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-pycjyidc4f] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-pycjyidc4f] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-pycjyidc4f] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.valuation-page[b-pycjyidc4f]  .hero-add-button,
.valuation-page[b-pycjyidc4f]  .search-button,
.valuation-page[b-pycjyidc4f]  .toolbar-add-button,
.valuation-page[b-pycjyidc4f]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.valuation-page[b-pycjyidc4f]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-pycjyidc4f] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-pycjyidc4f] {
    opacity: .55;
    cursor: not-allowed;
}

.valuation-page[b-pycjyidc4f]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.valuation-page[b-pycjyidc4f]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-pycjyidc4f] {
    margin-top: 7px;
}

.summary-card[b-pycjyidc4f] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-pycjyidc4f] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-pycjyidc4f] {
    color: #2c7da8;
}

.summary-card.approved[b-pycjyidc4f] {
    color: #7658a7;
}

.summary-card.incomplete[b-pycjyidc4f] {
    color: #c05b4e;
}

.summary-line[b-pycjyidc4f] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-pycjyidc4f] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-pycjyidc4f] {
    min-width: 0;
}

.summary-card small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-pycjyidc4f] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-pycjyidc4f] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-pycjyidc4f] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-pycjyidc4f],
.valuation-list-panel[b-pycjyidc4f] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-pycjyidc4f],
.list-toolbar[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-pycjyidc4f],
.panel-kicker[b-pycjyidc4f] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-pycjyidc4f],
.list-toolbar h2[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-pycjyidc4f],
.list-toolbar p[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-pycjyidc4f] {
    align-items: center;
}

.valuation-page[b-pycjyidc4f]  .premium-field,
.valuation-page[b-pycjyidc4f]  .form-field {
    width: 100%;
}

.valuation-page[b-pycjyidc4f]  .premium-field .mud-input-outlined-border,
.valuation-page[b-pycjyidc4f]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.valuation-page[b-pycjyidc4f]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.valuation-page[b-pycjyidc4f]  .sort-select {
    width: 160px;
}

.valuation-page[b-pycjyidc4f]  .toolbar-add-button {
    min-height: 42px;
}

.valuation-page[b-pycjyidc4f]  .valuation-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.valuation-page[b-pycjyidc4f]  .valuation-table .mud-table-head {
    background: #eef6f2;
}

.valuation-page[b-pycjyidc4f]  .valuation-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-pycjyidc4f] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-pycjyidc4f],
.view-avatar[b-pycjyidc4f] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-pycjyidc4f],
.view-avatar.female[b-pycjyidc4f] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-pycjyidc4f],
.view-avatar.other[b-pycjyidc4f] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-pycjyidc4f] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-pycjyidc4f],
.person-name small[b-pycjyidc4f] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-pycjyidc4f] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-pycjyidc4f] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-pycjyidc4f] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-pycjyidc4f] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-pycjyidc4f],
.area-cell[b-pycjyidc4f],
.date-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-pycjyidc4f] {
    gap: 3px;
}

.contact-cell span[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-pycjyidc4f],
.date-cell strong[b-pycjyidc4f] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-pycjyidc4f],
.date-cell small[b-pycjyidc4f] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-pycjyidc4f],
.document-chip[b-pycjyidc4f],
.status-chip[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-pycjyidc4f] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-pycjyidc4f] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-pycjyidc4f] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-pycjyidc4f] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-pycjyidc4f] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-pycjyidc4f] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-pycjyidc4f] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-pycjyidc4f] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-pycjyidc4f] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.valuation-page[b-pycjyidc4f]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.valuation-page[b-pycjyidc4f]  .row-action.view {
    color: #2d79a2;
}

.valuation-page[b-pycjyidc4f]  .row-action.edit {
    color: var(--theme-primary);
}

.valuation-page[b-pycjyidc4f]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.valuation-page[b-pycjyidc4f]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-pycjyidc4f] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-pycjyidc4f] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-pycjyidc4f] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-pycjyidc4f] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-pycjyidc4f] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.valuation-form-modal[b-pycjyidc4f],
.valuation-view-modal[b-pycjyidc4f],
.delete-modal[b-pycjyidc4f] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-pycjyidc4f .22s ease-out;
}

@keyframes modalAppear-b-pycjyidc4f {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.valuation-form-modal[b-pycjyidc4f] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-pycjyidc4f] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-pycjyidc4f] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-pycjyidc4f] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-pycjyidc4f] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-pycjyidc4f] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-pycjyidc4f] {
    margin-top: 24px;
}

.form-section-title > span[b-pycjyidc4f] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-pycjyidc4f] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-pycjyidc4f] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-pycjyidc4f] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-pycjyidc4f] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-pycjyidc4f] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.valuation-page[b-pycjyidc4f]  .cancel-button,
.valuation-page[b-pycjyidc4f]  .save-button,
.valuation-page[b-pycjyidc4f]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.valuation-page[b-pycjyidc4f]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.valuation-page[b-pycjyidc4f]  .save-button {
    min-width: 170px;
}

.valuation-view-modal[b-pycjyidc4f] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-pycjyidc4f] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-pycjyidc4f] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-pycjyidc4f] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-pycjyidc4f] {
    padding: 61px 24px 25px;
}

.view-heading[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-pycjyidc4f] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-pycjyidc4f] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-pycjyidc4f] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-pycjyidc4f] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-pycjyidc4f],
.view-address small[b-pycjyidc4f],
.view-note small[b-pycjyidc4f] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-pycjyidc4f] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-pycjyidc4f] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-pycjyidc4f] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-pycjyidc4f] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-pycjyidc4f] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-pycjyidc4f] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-pycjyidc4f] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-pycjyidc4f] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-pycjyidc4f] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-pycjyidc4f] {
    color: #963b36;
}

.delete-warning[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.valuation-page[b-pycjyidc4f]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .valuation-hero[b-pycjyidc4f] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-pycjyidc4f] {
        max-width: 570px;
    }

    .list-toolbar[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pycjyidc4f] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .valuation-page[b-pycjyidc4f] {
        padding: 15px 12px 30px;
    }

    .valuation-hero[b-pycjyidc4f] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-pycjyidc4f] {
        font-size: 2.3rem;
    }

    .hero-meta[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-pycjyidc4f] {
        width: 100%;
    }

    .filter-heading[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }

    .valuation-page[b-pycjyidc4f]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-pycjyidc4f] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-pycjyidc4f] {
        align-items: end;
        padding: 0;
    }

    .valuation-form-modal[b-pycjyidc4f],
    .valuation-view-modal[b-pycjyidc4f] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-pycjyidc4f] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-pycjyidc4f] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-pycjyidc4f],
    .valuation-list-panel[b-pycjyidc4f] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-pycjyidc4f] {
        align-items: flex-start;
    }

    .modal-icon[b-pycjyidc4f] {
        display: none;
    }

    .modal-footer[b-pycjyidc4f] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .valuation-page[b-pycjyidc4f]  .save-button {
        min-width: 0;
    }

    .view-heading[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-pycjyidc4f],
    .valuation-form-modal[b-pycjyidc4f],
    .valuation-view-modal[b-pycjyidc4f],
    .delete-modal[b-pycjyidc4f] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.valuation-page[b-pycjyidc4f] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.valuation-hero[b-pycjyidc4f] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.valuation-page[b-pycjyidc4f]  .hero-add-button,
.valuation-page[b-pycjyidc4f]  .toolbar-add-button,
.valuation-page[b-pycjyidc4f]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-pycjyidc4f] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-pycjyidc4f] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-pycjyidc4f] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-pycjyidc4f] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.valuation-page[b-pycjyidc4f]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-pycjyidc4f] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-pycjyidc4f] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-pycjyidc4f] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-pycjyidc4f] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-pycjyidc4f] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-pycjyidc4f] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-pycjyidc4f] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-pycjyidc4f] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-pycjyidc4f] {
    background: #b54d43;
}

.status-overview-card div[b-pycjyidc4f] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-pycjyidc4f] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-pycjyidc4f] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.valuation-code-photo-cell[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.valuation-photo-mini[b-pycjyidc4f] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.valuation-photo-mini button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.valuation-photo-mini img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.valuation-code-photo-cell strong[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.valuation-code-photo-cell small[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-pycjyidc4f],
.applicant-cell[b-pycjyidc4f],
.status-document-cell[b-pycjyidc4f],
.officer-cell[b-pycjyidc4f],
.fee-cell[b-pycjyidc4f],
.due-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-pycjyidc4f] {
    min-width: 190px;
}

.project-cell strong[b-pycjyidc4f],
.applicant-cell strong[b-pycjyidc4f],
.officer-cell strong[b-pycjyidc4f],
.fee-cell strong[b-pycjyidc4f],
.due-cell strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-pycjyidc4f],
.applicant-cell small[b-pycjyidc4f],
.officer-cell small[b-pycjyidc4f],
.due-cell small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-pycjyidc4f] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-pycjyidc4f],
.due-cell.due-soon small[b-pycjyidc4f] {
    color: #b14a40;
}

.permit-type-chip[b-pycjyidc4f],
.priority-chip[b-pycjyidc4f],
.document-chip[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-pycjyidc4f],
.permit-type-chip.occupancy[b-pycjyidc4f] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-pycjyidc4f] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-pycjyidc4f],
.permit-type-chip.factory[b-pycjyidc4f] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-pycjyidc4f],
.permit-type-chip.market[b-pycjyidc4f] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-pycjyidc4f] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-pycjyidc4f] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-pycjyidc4f],
.permit-type-chip.event[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-pycjyidc4f] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-pycjyidc4f] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-pycjyidc4f] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-pycjyidc4f] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-pycjyidc4f] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-pycjyidc4f] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-pycjyidc4f],
.status-chip.inspection[b-pycjyidc4f],
.status-chip.reviewing[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-pycjyidc4f] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-pycjyidc4f] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-pycjyidc4f] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-pycjyidc4f] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.valuation-photo-upload-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-pycjyidc4f] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-pycjyidc4f] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-pycjyidc4f] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-pycjyidc4f] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-pycjyidc4f] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-pycjyidc4f] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.8rem;
}

.photo-empty strong[b-pycjyidc4f] {
    font-size: .48rem;
}

.photo-empty small[b-pycjyidc4f] {
    font-size: .38rem;
}

.photo-upload-actions[b-pycjyidc4f] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-pycjyidc4f],
.remove-photo-button[b-pycjyidc4f] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-pycjyidc4f] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-pycjyidc4f] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-pycjyidc4f] {
    margin-top: 12px;
}

.valuation-form-modal[b-pycjyidc4f] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.valuation-view-modal[b-pycjyidc4f] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.valuation-identity-banner[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-pycjyidc4f] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-pycjyidc4f] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-pycjyidc4f] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-pycjyidc4f] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-pycjyidc4f] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-pycjyidc4f] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-pycjyidc4f] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-pycjyidc4f] {
    font-style: normal;
}

.approval-location-panel b[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-pycjyidc4f] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-pycjyidc4f] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-pycjyidc4f] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-pycjyidc4f] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-pycjyidc4f] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-pycjyidc4f] {
    display: grid;
    gap: 10px;
}

.three-columns[b-pycjyidc4f] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-pycjyidc4f] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-pycjyidc4f] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-pycjyidc4f] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-pycjyidc4f] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-pycjyidc4f] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-pycjyidc4f] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-pycjyidc4f] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-pycjyidc4f] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-pycjyidc4f] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-pycjyidc4f] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-pycjyidc4f] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-pycjyidc4f] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-pycjyidc4f] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .valuation-photo-upload-grid[b-pycjyidc4f],
    .three-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-photo-upload-grid[b-pycjyidc4f],
    .project-summary-grid[b-pycjyidc4f],
    .inspection-note-grid[b-pycjyidc4f],
    .three-columns[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-pycjyidc4f] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-pycjyidc4f] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-pycjyidc4f],
    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
        min-height: 72px;
    }

    .view-toolbar[b-pycjyidc4f] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-pycjyidc4f] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-pycjyidc4f],
    .valuation-page[b-pycjyidc4f]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.valuation-page[b-pycjyidc4f] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.valuation-hero[b-pycjyidc4f] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-pycjyidc4f] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-pycjyidc4f] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-pycjyidc4f] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-pycjyidc4f] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.valuation-page[b-pycjyidc4f]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-pycjyidc4f] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-pycjyidc4f] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-pycjyidc4f] {
    background: #73569b;
}

.status-overview-card.completed > span[b-pycjyidc4f] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-pycjyidc4f] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-pycjyidc4f] {
    background: #b54d43;
}

.valuation-code-photo-cell[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.valuation-photo-mini[b-pycjyidc4f] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.valuation-photo-mini button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.valuation-photo-mini img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.valuation-code-photo-cell strong[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.valuation-code-photo-cell small[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-pycjyidc4f],
.appointment-cell[b-pycjyidc4f],
.team-cell[b-pycjyidc4f],
.status-result-cell[b-pycjyidc4f],
.applicant-cell[b-pycjyidc4f],
.notification-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-pycjyidc4f] {
    min-width: 190px;
}

.project-cell strong[b-pycjyidc4f],
.appointment-cell strong[b-pycjyidc4f],
.team-cell strong[b-pycjyidc4f],
.applicant-cell strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-pycjyidc4f],
.appointment-cell small[b-pycjyidc4f],
.team-cell small[b-pycjyidc4f],
.applicant-cell small[b-pycjyidc4f],
.notification-cell small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-pycjyidc4f],
.team-cell em[b-pycjyidc4f],
.applicant-cell em[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-pycjyidc4f],
.appointment-cell.overdue small[b-pycjyidc4f] {
    color: #b0443b;
}

.status-result-cell[b-pycjyidc4f] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-pycjyidc4f] {
    align-items: flex-start;
}

.notification-cell > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-pycjyidc4f] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-pycjyidc4f] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-pycjyidc4f] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-pycjyidc4f] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-pycjyidc4f] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-pycjyidc4f] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-pycjyidc4f] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-pycjyidc4f] {
    font-size: 2rem;
}

.source-priority[b-pycjyidc4f] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-pycjyidc4f] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-pycjyidc4f] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-pycjyidc4f] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-pycjyidc4f] {
    padding: 10px;
}

.source-picker-content > small[b-pycjyidc4f] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-pycjyidc4f] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-pycjyidc4f] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-pycjyidc4f] {
    margin-bottom: 16px;
}

.locked-application-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-pycjyidc4f] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-pycjyidc4f] {
    font-size: 2.4rem;
}

.locked-application-content[b-pycjyidc4f] {
    min-width: 0;
}

.locked-application-heading[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-pycjyidc4f] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-pycjyidc4f] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-pycjyidc4f] {
    grid-column: span 2;
}

.locked-application-grid span[b-pycjyidc4f] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-pycjyidc4f],
.source-panel-actions button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-pycjyidc4f] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.valuation-photo-upload-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.valuation-form-modal[b-pycjyidc4f] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.valuation-view-modal[b-pycjyidc4f] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-pycjyidc4f] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-pycjyidc4f] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-pycjyidc4f] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-pycjyidc4f] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-pycjyidc4f] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-pycjyidc4f] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-pycjyidc4f] {
    font-style: normal;
}

.approval-location-panel b[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-pycjyidc4f] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-pycjyidc4f] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-pycjyidc4f] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-pycjyidc4f] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-pycjyidc4f] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-pycjyidc4f] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-pycjyidc4f] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-pycjyidc4f] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-pycjyidc4f] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-pycjyidc4f] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-pycjyidc4f] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-pycjyidc4f] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-pycjyidc4f] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-pycjyidc4f] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-pycjyidc4f] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-pycjyidc4f],
    .five-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-pycjyidc4f] {
        max-height: 310px;
    }

    .locked-application-grid[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-pycjyidc4f],
    .five-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-pycjyidc4f],
    .valuation-photo-upload-grid[b-pycjyidc4f],
    .inspection-note-grid[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-pycjyidc4f],
    .five-columns[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-pycjyidc4f] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-pycjyidc4f],
    .locked-application-grid[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-pycjyidc4f] {
        grid-column: auto;
    }

    .locked-application-heading[b-pycjyidc4f] {
        flex-direction: column;
    }

    .locked-application-badges[b-pycjyidc4f] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.valuation-page[b-pycjyidc4f] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.valuation-hero[b-pycjyidc4f] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-pycjyidc4f] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-pycjyidc4f] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-pycjyidc4f] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-pycjyidc4f] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-pycjyidc4f] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-pycjyidc4f] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-pycjyidc4f] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.valuation-page[b-pycjyidc4f]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-pycjyidc4f] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-pycjyidc4f] {
    background: #73569b;
}

.status-overview-card.revision > span[b-pycjyidc4f] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-pycjyidc4f] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-pycjyidc4f] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-pycjyidc4f] {
    background: #9f4139;
}

.source-note[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.valuation-code-photo-cell[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.valuation-photo-mini[b-pycjyidc4f] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.valuation-photo-mini button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.valuation-photo-mini img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.valuation-code-photo-cell strong[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.valuation-code-photo-cell small[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-pycjyidc4f],
.inspection-result-cell[b-pycjyidc4f],
.status-recommendation-cell[b-pycjyidc4f],
.reviewer-cell[b-pycjyidc4f],
.decision-cell[b-pycjyidc4f],
.permit-fee-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-pycjyidc4f] {
    min-width: 190px;
}

.project-cell strong[b-pycjyidc4f],
.inspection-result-cell strong[b-pycjyidc4f],
.reviewer-cell strong[b-pycjyidc4f],
.decision-cell strong[b-pycjyidc4f],
.permit-fee-cell strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-pycjyidc4f],
.inspection-result-cell small[b-pycjyidc4f],
.reviewer-cell small[b-pycjyidc4f],
.decision-cell small[b-pycjyidc4f],
.permit-fee-cell small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-pycjyidc4f] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-pycjyidc4f] {
    gap: 4px;
}

.decision-cell.overdue strong[b-pycjyidc4f],
.decision-cell.overdue small[b-pycjyidc4f] {
    color: #ad4037;
}

.permit-fee-cell > span[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-pycjyidc4f],
.recommendation-chip[b-pycjyidc4f],
.final-decision-chip[b-pycjyidc4f],
.inspection-result-chip[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-pycjyidc4f] {
    gap: 5px;
}

.review-status-chip > i[b-pycjyidc4f] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-pycjyidc4f] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-pycjyidc4f] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-pycjyidc4f] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-pycjyidc4f] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-pycjyidc4f] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-pycjyidc4f] {
    font-size: 2.4rem;
}

.locked-source-heading[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-pycjyidc4f] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-pycjyidc4f] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-pycjyidc4f] {
    grid-column: span 2;
}

.locked-source-grid span[b-pycjyidc4f] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.valuation-photo-upload-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.valuation-form-modal[b-pycjyidc4f] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.valuation-view-modal[b-pycjyidc4f] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-pycjyidc4f] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-pycjyidc4f] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-pycjyidc4f] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-pycjyidc4f] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-pycjyidc4f] {
    font-style: normal;
}

.approval-location-panel b[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-pycjyidc4f] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-pycjyidc4f] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-pycjyidc4f] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-pycjyidc4f] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-pycjyidc4f],
.condition-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-pycjyidc4f],
.condition-grid > div[b-pycjyidc4f] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-pycjyidc4f] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-pycjyidc4f] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-pycjyidc4f] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-pycjyidc4f] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-pycjyidc4f] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-pycjyidc4f] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-pycjyidc4f] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-pycjyidc4f],
.condition-grid small[b-pycjyidc4f] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-pycjyidc4f],
.condition-grid p[b-pycjyidc4f] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-pycjyidc4f] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-pycjyidc4f] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-pycjyidc4f] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-pycjyidc4f] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-pycjyidc4f],
    .six-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-pycjyidc4f] {
        max-height: 320px;
    }

    .locked-source-grid[b-pycjyidc4f],
    .decision-summary-grid[b-pycjyidc4f],
    .six-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .valuation-photo-upload-grid[b-pycjyidc4f],
    .opinion-grid[b-pycjyidc4f],
    .condition-grid[b-pycjyidc4f],
    .decision-summary-grid[b-pycjyidc4f],
    .six-columns[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-pycjyidc4f] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-pycjyidc4f],
    .locked-source-grid[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-pycjyidc4f] {
        grid-column: auto;
    }

    .locked-source-heading[b-pycjyidc4f] {
        flex-direction: column;
    }

    .locked-source-badges[b-pycjyidc4f] {
        justify-content: flex-start;
    }
}


/* =========================================================
   LAND PARCEL REGISTRY PREMIUM EXTENSIONS
   ========================================================= */

.valuation-page[b-pycjyidc4f] {
    --land-green: var(--theme-primary);
    --land-deep: var(--theme-dark);
    --land-gold: var(--theme-accent);
    --land-blue: #2f789f;
    --land-purple: #73569b;
    --land-red: #b54d43;
}

.valuation-hero[b-pycjyidc4f] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .27),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.summary-card.total[b-pycjyidc4f] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.area[b-pycjyidc4f] {
    --summary-accent: #4d7c45;
    --summary-soft: #edf6e9;
    --summary-border: rgba(77, 124, 69, .20);
}

.summary-card.value[b-pycjyidc4f] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.coordinate[b-pycjyidc4f] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.valuation-page[b-pycjyidc4f]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-pycjyidc4f] {
    background: #397a4c;
}

.status-overview-card.transfer > span[b-pycjyidc4f] {
    background: #b27a25;
}

.status-overview-card.disputed > span[b-pycjyidc4f] {
    background: #b54d43;
}

.status-overview-card.coordinate > span[b-pycjyidc4f] {
    background: #2f789f;
}

.status-overview-card.missing > span[b-pycjyidc4f] {
    background: #7d665f;
}

.status-overview-card.review > span[b-pycjyidc4f] {
    background: #73569b;
}

.valuation-code-photo-cell[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 150px;
    align-items: center;
    gap: 8px;
}

.valuation-photo-mini[b-pycjyidc4f] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.valuation-photo-mini button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.valuation-photo-mini img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.valuation-code-photo-cell strong[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.valuation-code-photo-cell small[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .40rem;
    font-weight: 650;
}

.owner-cell[b-pycjyidc4f],
.area-cell[b-pycjyidc4f],
.location-cell[b-pycjyidc4f],
.value-cell[b-pycjyidc4f],
.status-review-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.owner-cell[b-pycjyidc4f],
.location-cell[b-pycjyidc4f] {
    min-width: 180px;
}

.owner-cell strong[b-pycjyidc4f],
.area-cell strong[b-pycjyidc4f],
.location-cell strong[b-pycjyidc4f],
.value-cell strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.owner-cell small[b-pycjyidc4f],
.area-cell small[b-pycjyidc4f],
.location-cell small[b-pycjyidc4f],
.value-cell small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.owner-cell em[b-pycjyidc4f],
.value-cell em[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.location-cell a[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;

    align-items: center;
    gap: 4px;

    margin-top: 6px;
    padding: 0 7px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 999px;

    color: #2f789f;
    background: #edf6fb;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.missing-coordinate[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 6px;
    padding: 0 7px;

    border-radius: 999px;

    color: #775f59;
    background: #f0e9e7;

    font-size: .38rem;
    font-style: normal;
    font-weight: 700;
}

.status-review-cell[b-pycjyidc4f] {
    align-items: flex-start;
    gap: 5px;
}

.owner-type-chip[b-pycjyidc4f],
.usage-chip[b-pycjyidc4f],
.land-type-chip[b-pycjyidc4f],
.coordinate-ready-chip[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    gap: 4px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.owner-type-chip.person[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-type-chip.company[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.owner-type-chip.government[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.owner-type-chip.community[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.residential[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-pycjyidc4f] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.land-type-chip.chanote[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.land-type-chip.ns3k[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.land-type-chip.ns3[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.land-type-chip.sk1[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.land-type-chip.other[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.active[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.transfer-pending[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.disputed[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.leased[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.mortgaged[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.archived[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.review-badge[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.review-badge.normal[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.review-badge.due[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.review-badge.overdue[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.review-badge.none[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.row-map-action[b-pycjyidc4f] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

.coordinate-form-panel[b-pycjyidc4f] {
    overflow: hidden;

    margin-bottom: 16px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .09),
            transparent 18rem),
        #f5fafc;
}

.coordinate-action-card[b-pycjyidc4f] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: center;

    border: 1px solid rgba(47, 120, 159, .10);
    border-radius: 12px;

    background: #fff;
}

.coordinate-action-card a[b-pycjyidc4f],
.coordinate-action-card span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.coordinate-action-card a[b-pycjyidc4f] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-action-card span[b-pycjyidc4f] {
    color: #75867f;
    background: #edf2ef;
}

.map-preview[b-pycjyidc4f],
.google-map-panel[b-pycjyidc4f] {
    overflow: hidden;

    margin-top: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 15px;

    background: #fff;
}

.map-preview iframe[b-pycjyidc4f] {
    display: block;
    width: 100%;
    height: 300px;

    border: 0;
}

.map-empty[b-pycjyidc4f] {
    display: flex;
    min-height: 220px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    margin-top: 12px;
    border: 1px dashed rgba(47, 120, 159, .22);
    border-radius: 15px;

    color: #2f789f;
    background: rgba(255, 255, 255, .65);
}

.map-empty strong[b-pycjyidc4f] {
    color: #40554c;
    font-size: .55rem;
}

.map-empty small[b-pycjyidc4f] {
    color: #7e8d87;
    font-size: .42rem;
}

.area-summary-card[b-pycjyidc4f] {
    display: flex;
    min-height: 58px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 0 13px;
    border: 1px solid rgba(77, 124, 69, .12);
    border-radius: 12px;

    background: #f2f8ef;
}

.area-summary-card span[b-pycjyidc4f] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #43763d;
    font-size: .44rem;
    font-weight: 700;
}

.area-summary-card strong[b-pycjyidc4f] {
    color: #355047;
    font-size: .54rem;
}

.valuation-photo-upload-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;
}

.valuation-form-modal[b-pycjyidc4f] {
    width: min(1220px, calc(100vw - 28px)) !important;
}

.valuation-view-modal[b-pycjyidc4f] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-pycjyidc4f] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.coordinate-ready-chip[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-summary-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(10, 114, 87, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.owner-summary-icon[b-pycjyidc4f] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.owner-summary-panel small[b-pycjyidc4f] {
    color: var(--theme-primary);
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-summary-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.owner-summary-panel p[b-pycjyidc4f] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
}

.owner-summary-panel em[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: #987634;
    font-size: .43rem;
    font-style: normal;
}

.area-value-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.area-value-grid article[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);

    min-height: 82px;
    align-items: center;
    gap: 9px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 13px;

    background: #fff;
}

.area-value-grid article > span[b-pycjyidc4f] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #4d7c45;
    background: #edf6e9;
}

.area-value-grid article:nth-child(2) > span[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.area-value-grid article:nth-child(3) > span[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.area-value-grid article:nth-child(4) > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

.area-value-grid div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.area-value-grid small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.area-value-grid strong[b-pycjyidc4f] {
    margin-top: 3px;

    color: #34483f;
    font-size: .62rem;
}

.area-value-grid em[b-pycjyidc4f] {
    color: #72837c;
    font-size: .38rem;
    font-style: normal;
}

.land-location-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.land-location-panel > span[b-pycjyidc4f] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.land-location-panel small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.land-location-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .66rem;
}

.land-location-panel p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.55;
}

.land-location-panel b[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.land-location-panel a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-pycjyidc4f] {
    margin-top: 13px;
    padding: 0;
}

.map-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 12px 13px;
}

.map-heading small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.map-heading > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .40rem;
    font-weight: 700;
}

.google-map-panel iframe[b-pycjyidc4f] {
    display: block;
    width: 100%;
    height: 360px;

    border: 0;
}

.map-not-available[b-pycjyidc4f] {
    display: flex;
    min-height: 110px;

    align-items: center;
    justify-content: center;
    gap: 10px;

    margin-top: 13px;
    padding: 15px;

    border: 1px dashed rgba(181, 77, 67, .22);
    border-radius: 15px;

    color: #ad4037;
    background: #fff8f6;
}

.map-not-available div[b-pycjyidc4f] {
    display: flex;
    flex-direction: column;
}

.map-not-available strong[b-pycjyidc4f] {
    color: #6e4944;
    font-size: .54rem;
}

.map-not-available small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #967c77;
    font-size: .42rem;
}

.boundary-panel[b-pycjyidc4f] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(77, 124, 69, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(77, 124, 69, .09),
            transparent 18rem),
        #f8fbf7;
}

.boundary-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.boundary-grid > div[b-pycjyidc4f],
.access-grid > div[b-pycjyidc4f] {
    min-height: 76px;
    padding: 10px;

    border: 1px solid rgba(77, 124, 69, .08);
    border-radius: 11px;

    background: #fff;
}

.boundary-grid span[b-pycjyidc4f],
.access-grid span[b-pycjyidc4f] {
    color: #4d7c45;
    font-size: .41rem;
    font-weight: 700;
}

.boundary-grid strong[b-pycjyidc4f],
.access-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 6px;

    color: #45564f;
    font-size: .49rem;
    line-height: 1.55;
}

.boundary-grid .north[b-pycjyidc4f] {
    border-top: 3px solid #2f789f;
}

.boundary-grid .east[b-pycjyidc4f] {
    border-top: 3px solid #987634;
}

.boundary-grid .south[b-pycjyidc4f] {
    border-top: 3px solid #4d7c45;
}

.boundary-grid .west[b-pycjyidc4f] {
    border-top: 3px solid #73569b;
}

.access-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 8px;
}

.land-info-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.land-info-grid > div[b-pycjyidc4f] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.land-info-grid span[b-pycjyidc4f] {
    display: block;

    color: #87958f;
    font-size: .40rem;
}

.land-info-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
}

.remark-panel[b-pycjyidc4f] {
    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(199, 163, 93, .12);
    border-radius: 12px;

    background: #fffbf2;
}

.remark-panel small[b-pycjyidc4f] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.remark-panel p[b-pycjyidc4f] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.four-columns[b-pycjyidc4f] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-pycjyidc4f] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.document > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

@media (max-width: 1380px) {
    .valuation-photo-upload-grid[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .area-value-grid[b-pycjyidc4f],
    .boundary-grid[b-pycjyidc4f],
    .land-info-grid[b-pycjyidc4f],
    .four-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .google-map-panel iframe[b-pycjyidc4f],
    .map-preview iframe[b-pycjyidc4f] {
        height: 300px;
    }
}

@media (max-width: 780px) {
    .valuation-photo-upload-grid[b-pycjyidc4f],
    .area-value-grid[b-pycjyidc4f],
    .boundary-grid[b-pycjyidc4f],
    .access-grid[b-pycjyidc4f],
    .land-info-grid[b-pycjyidc4f],
    .four-columns[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .land-location-panel[b-pycjyidc4f] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .land-location-panel a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }

    .area-summary-card[b-pycjyidc4f] {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
        min-height: 72px;
    }

    .map-heading[b-pycjyidc4f] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-pycjyidc4f],
    .map-preview iframe[b-pycjyidc4f] {
        height: 260px;
    }
}


/* =========================================================
   LANDSMAPS INTERNAL LOOKUP INTEGRATION
   ========================================================= */

.hero-landsmaps-button[b-pycjyidc4f] {
    min-height: 40px !important;

    border-color: rgba(242, 217, 153, .27) !important;
    border-radius: 11px !important;

    color: #f4dda6 !important;
    background: rgba(242, 217, 153, .08) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .45rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.hero-landsmaps-button:hover[b-pycjyidc4f] {
    border-color: rgba(242, 217, 153, .46) !important;
    background: rgba(242, 217, 153, .15) !important;
}

.row-landsmaps-action[b-pycjyidc4f] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(152, 118, 52, .15);
    border-radius: 9px;

    color: #987634;
    background: #fff7e8;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}

.row-landsmaps-action:hover[b-pycjyidc4f] {
    transform: translateY(-1px);
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

.view-landsmaps-button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .18);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.view-landsmaps-button:hover[b-pycjyidc4f] {
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

@media (max-width: 650px) {
    .view-landsmaps-button[b-pycjyidc4f] {
        width: 100%;
    }
}


/* =========================================================
   PROPERTY VALUATION PREMIUM EXTENSIONS
   ========================================================= */

.valuation-page[b-pycjyidc4f] {
    --valuation-green: var(--theme-primary);
    --valuation-deep: var(--theme-dark);
    --valuation-gold: var(--theme-accent);
    --valuation-blue: #2f789f;
    --valuation-purple: #73569b;
    --valuation-red: #b54d43;
}

.valuation-hero[b-pycjyidc4f] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .28),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(72, 166, 113, .24),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.hero-map-button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;

    color: #f4dda6;
    background: rgba(242, 217, 153, .08);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.total[b-pycjyidc4f] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.appraised[b-pycjyidc4f] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.market[b-pycjyidc4f] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.tax[b-pycjyidc4f] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.valuation-page[b-pycjyidc4f]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.draft > span[b-pycjyidc4f] {
    background: #718078;
}

.status-overview-card.review > span[b-pycjyidc4f] {
    background: #73569b;
}

.status-overview-card.approved > span[b-pycjyidc4f] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-pycjyidc4f] {
    background: #b54d43;
}

.status-overview-card.due > span[b-pycjyidc4f] {
    background: #b27a25;
}

.status-overview-card.building > span[b-pycjyidc4f] {
    background: #2f789f;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.valuation-insight-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(320px, .75fr);

    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-pycjyidc4f] {
    padding: 15px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 18rem),
        #fff;

    box-shadow:
        0 14px 35px rgba(5, 62, 46, .065);
}

.insight-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-pycjyidc4f] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;
    border-radius: 999px;

    color: var(--theme-primary);
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 700;
}

.factor-guide-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.factor-guide-grid > div[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);

    min-height: 74px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;

    background: #f9fbfa;
}

.factor-guide-grid > div > span[b-pycjyidc4f] {
    display: grid;
    width: 40px;
    height: 40px;

    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 11px;

    color: var(--theme-primary);
    background: #e7f5ef;
}

.factor-guide-grid strong[b-pycjyidc4f] {
    color: #3c5047;
    font-size: .49rem;
}

.factor-guide-grid small[b-pycjyidc4f] {
    color: #83918c;
    font-size: .39rem;
    line-height: 1.45;
}

.formula-list[b-pycjyidc4f] {
    display: grid;
    gap: 8px;

    margin-top: 13px;
}

.formula-list > div[b-pycjyidc4f] {
    min-height: 59px;
    padding: 9px 11px;

    border: 1px solid rgba(152, 118, 52, .10);
    border-radius: 10px;

    background: #fffbf3;
}

.formula-list small[b-pycjyidc4f] {
    display: block;

    color: #987634;
    font-size: .39rem;
}

.formula-list strong[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: #4c5e56;
    font-size: .47rem;
    line-height: 1.55;
}

/* =========================================================
   FILTER SUMMARY
   ========================================================= */

.filter-summary[b-pycjyidc4f] {
    display: flex;
    min-height: 56px;

    align-items: center;
    flex-wrap: wrap;
    gap: 7px;

    padding: 8px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 11px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 4px;

    padding: 0 8px;
    border-radius: 999px;

    color: #65766f;
    background: #fff;

    font-size: .40rem;
}

.filter-summary strong[b-pycjyidc4f] {
    color: var(--theme-primary);
}

/* =========================================================
   TABLE
   ========================================================= */

.valuation-code-photo-cell[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);

    min-width: 168px;
    align-items: center;
    gap: 8px;
}

.valuation-photo-mini[b-pycjyidc4f] {
    display: grid;
    width: 52px;
    height: 52px;

    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.valuation-photo-mini button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.valuation-photo-mini img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.valuation-code-photo-cell strong[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.valuation-code-photo-cell small[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #83918c;
    font-size: .39rem;
}

.parcel-owner-cell[b-pycjyidc4f],
.method-year-cell[b-pycjyidc4f],
.component-value-cell[b-pycjyidc4f],
.total-value-cell[b-pycjyidc4f],
.market-tax-cell[b-pycjyidc4f],
.status-review-cell[b-pycjyidc4f] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.parcel-owner-cell[b-pycjyidc4f] {
    min-width: 190px;
}

.parcel-owner-cell strong[b-pycjyidc4f],
.method-year-cell strong[b-pycjyidc4f],
.component-value-cell strong[b-pycjyidc4f],
.total-value-cell strong[b-pycjyidc4f],
.market-tax-cell strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .53rem;
    line-height: 1.48;
}

.parcel-owner-cell small[b-pycjyidc4f],
.method-year-cell small[b-pycjyidc4f],
.component-value-cell small[b-pycjyidc4f],
.total-value-cell small[b-pycjyidc4f],
.market-tax-cell small[b-pycjyidc4f] {
    margin-top: 3px;

    color: #84928d;
    font-size: .42rem;
    line-height: 1.5;
}

.parcel-owner-cell em[b-pycjyidc4f],
.component-value-cell em[b-pycjyidc4f],
.total-value-cell em[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .38rem;
    font-style: normal;
    font-weight: 650;
}

.total-value-cell strong[b-pycjyidc4f] {
    color: var(--theme-primary);
    font-size: .58rem;
}

.market-tax-cell strong[b-pycjyidc4f] {
    color: #987634;
}

.method-chip[b-pycjyidc4f],
.usage-chip[b-pycjyidc4f] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.method-chip.market-comparison[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.method-chip.official-reference[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.method-chip.cost[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.method-chip.income[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.method-chip.mass-appraisal[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.usage-chip.residential[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-pycjyidc4f] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-pycjyidc4f] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.draft[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.surveyed[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.calculated[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.status-chip.under-review[b-pycjyidc4f] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.approved[b-pycjyidc4f] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-pycjyidc4f] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-pycjyidc4f] {
    color: #687872;
    background: #edf1ef;
}

/* =========================================================
   SOURCE PARCEL & FORM
   ========================================================= */

.valuation-form-modal[b-pycjyidc4f] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-parcel-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 13px;
    overflow: hidden;

    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-parcel-photo[b-pycjyidc4f] {
    display: grid;
    min-height: 210px;
    overflow: hidden;

    place-items: center;
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-parcel-photo button[b-pycjyidc4f] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-parcel-photo img[b-pycjyidc4f] {
    width: 100%;
    height: 100%;
    min-height: 210px;

    object-fit: cover;
}

.source-parcel-content[b-pycjyidc4f] {
    min-width: 0;
}

.source-title-row[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-pycjyidc4f] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .45rem;
}

.source-data-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-pycjyidc4f] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.source-data-grid span[b-pycjyidc4f] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-pycjyidc4f] {
    display: flex;
    align-items: flex-start;
    gap: 5px;

    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-pycjyidc4f] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-actions a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 33px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-pycjyidc4f] {
    color: #987634;
    border-color: rgba(152, 118, 52, .14);
    background: #fff9ed;
}

.source-actions a:nth-child(3)[b-pycjyidc4f] {
    color: #2f789f;
    border-color: rgba(47, 120, 159, .14);
    background: #f4fafc;
}

.source-map-preview[b-pycjyidc4f] {
    overflow: hidden;

    margin: -4px 0 16px;
    border: 1px solid rgba(47, 120, 159, .11);
    border-radius: 14px;

    background: #edf2ef;
}

.source-map-preview iframe[b-pycjyidc4f] {
    display: block;
    width: 100%;
    height: 280px;

    border: 0;
}

.calculation-preview-panel[b-pycjyidc4f] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .12),
            transparent 18rem),
        #fffbf3;
}

.calculation-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.calculation-heading small[b-pycjyidc4f] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.calculation-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #405249;
    font-size: .69rem;
}

.calculation-heading > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #987634;
    background: #fff1d4;

    font-size: .40rem;
    font-weight: 700;
}

.calculation-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.calculation-grid > div[b-pycjyidc4f] {
    min-height: 82px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .08);
    border-radius: 11px;

    background: #fff;
}

.calculation-grid > div.highlight[b-pycjyidc4f] {
    color: #fff;
    border-color: transparent;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .16);
}

.calculation-grid span[b-pycjyidc4f] {
    display: block;

    color: #8b7b5b;
    font-size: .39rem;
}

.calculation-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 7px;

    color: #3f5249;
    font-size: .66rem;
}

.calculation-grid small[b-pycjyidc4f] {
    display: block;
    margin-top: 2px;

    color: #8a9791;
    font-size: .36rem;
}

.calculation-grid .highlight span[b-pycjyidc4f],
.calculation-grid .highlight strong[b-pycjyidc4f],
.calculation-grid .highlight small[b-pycjyidc4f] {
    color: #fff;
}

.valuation-photo-upload-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

/* =========================================================
   VIEW
   ========================================================= */

.valuation-view-modal[b-pycjyidc4f] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.view-landsmaps-button[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .16);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    text-decoration: none;
}

.valuation-identity-banner[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-pycjyidc4f] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-pycjyidc4f] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-pycjyidc4f] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-pycjyidc4f] {
    margin-top: 4px;

    color: #355047;
    font-size: .53rem;
    line-height: 1.45;
    text-align: center;
}

.owner-location-panel[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.owner-location-panel > span[b-pycjyidc4f] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.owner-location-panel small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-location-panel h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .67rem;
}

.owner-location-panel p[b-pycjyidc4f] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.55;
}

.owner-location-panel b[b-pycjyidc4f] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.owner-location-panel a[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-pycjyidc4f] {
    overflow: hidden;

    margin-top: 13px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 14px;

    background: #fff;
}

.map-heading[b-pycjyidc4f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 11px 13px;
}

.map-heading small[b-pycjyidc4f] {
    color: #2f789f;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-pycjyidc4f] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .69rem;
}

.map-heading > span[b-pycjyidc4f] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-weight: 700;
}

.google-map-panel iframe[b-pycjyidc4f] {
    display: block;
    width: 100%;
    height: 350px;

    border: 0;
}

.value-highlight-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.value-highlight-grid article[b-pycjyidc4f] {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);

    min-height: 88px;
    align-items: center;
    gap: 8px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 12px;

    background: #fff;
}

.value-highlight-grid article > span[b-pycjyidc4f] {
    display: grid;
    width: 44px;
    height: 44px;

    place-items: center;
    border-radius: 12px;
}

.value-highlight-grid .land-value > span[b-pycjyidc4f] {
    color: #4d7c45;
    background: #edf6e9;
}

.value-highlight-grid .building-value > span[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.value-highlight-grid .total-appraised > span[b-pycjyidc4f] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.value-highlight-grid .market-value > span[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.value-highlight-grid .tax-value > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

.value-highlight-grid div[b-pycjyidc4f] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.value-highlight-grid small[b-pycjyidc4f] {
    color: #87958f;
    font-size: .38rem;
}

.value-highlight-grid strong[b-pycjyidc4f] {
    margin-top: 4px;

    overflow: hidden;
    color: #354940;
    font-size: .58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value-highlight-grid em[b-pycjyidc4f] {
    color: #75867f;
    font-size: .36rem;
    font-style: normal;
}

.factor-detail-panel[b-pycjyidc4f],
.building-detail-panel[b-pycjyidc4f],
.comparable-panel[b-pycjyidc4f],
.workflow-panel[b-pycjyidc4f] {
    margin-top: 13px;
    padding: 14px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .06),
            transparent 18rem),
        #f9fbfa;
}

.factor-detail-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.factor-detail-grid > div[b-pycjyidc4f],
.building-detail-grid > div[b-pycjyidc4f],
.workflow-grid > div[b-pycjyidc4f] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.factor-detail-grid span[b-pycjyidc4f],
.building-detail-grid span[b-pycjyidc4f],
.workflow-grid span[b-pycjyidc4f] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.factor-detail-grid strong[b-pycjyidc4f],
.building-detail-grid strong[b-pycjyidc4f],
.workflow-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .48rem;
    line-height: 1.45;
}

.building-detail-grid[b-pycjyidc4f],
.workflow-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.comparable-grid[b-pycjyidc4f] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.comparable-grid > div[b-pycjyidc4f] {
    min-height: 90px;
    padding: 10px;
    border: 1px solid rgba(47, 120, 159, .08);
    border-radius: 10px;

    background: #fff;
}

.comparable-grid span[b-pycjyidc4f] {
    display: block;

    color: #2f789f;
    font-size: .39rem;
    font-weight: 700;
}

.comparable-grid strong[b-pycjyidc4f] {
    display: block;
    margin-top: 6px;

    color: #465951;
    font-size: .47rem;
    line-height: 1.58;
}

.comparable-empty[b-pycjyidc4f] {
    grid-column: 1 / -1;

    display: grid;
    min-height: 90px;

    place-items: center;

    color: #84928d;
}

.rejection-note[b-pycjyidc4f],
.internal-note[b-pycjyidc4f] {
    margin-top: 9px;
    padding: 10px;
    border-radius: 10px;
}

.rejection-note[b-pycjyidc4f] {
    border: 1px solid rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.internal-note[b-pycjyidc4f] {
    border: 1px solid rgba(152, 118, 52, .12);
    background: #fffbf3;
}

.rejection-note strong[b-pycjyidc4f] {
    color: #ad4037;
    font-size: .43rem;
}

.internal-note strong[b-pycjyidc4f] {
    color: #987634;
    font-size: .43rem;
}

.rejection-note p[b-pycjyidc4f],
.internal-note p[b-pycjyidc4f] {
    margin: 5px 0 0;

    color: #5f7169;
    font-size: .47rem;
    line-height: 1.65;
}

.five-columns[b-pycjyidc4f] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-pycjyidc4f] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-pycjyidc4f] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-pycjyidc4f] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.survey > span[b-pycjyidc4f] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.attachment-card.report > span[b-pycjyidc4f] {
    color: #73569b;
    background: #f0eafb;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .valuation-insight-grid[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-data-grid[b-pycjyidc4f],
    .calculation-grid[b-pycjyidc4f],
    .factor-detail-grid[b-pycjyidc4f],
    .building-detail-grid[b-pycjyidc4f],
    .workflow-grid[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .value-highlight-grid[b-pycjyidc4f] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .five-columns[b-pycjyidc4f] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }

    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .factor-guide-grid[b-pycjyidc4f] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .source-parcel-panel[b-pycjyidc4f] {
        grid-template-columns:
            190px minmax(0, 1fr);
    }

    .comparable-grid[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }
}

@media (max-width: 780px) {
    .factor-guide-grid[b-pycjyidc4f],
    .source-data-grid[b-pycjyidc4f],
    .calculation-grid[b-pycjyidc4f],
    .valuation-photo-upload-grid[b-pycjyidc4f],
    .factor-detail-grid[b-pycjyidc4f],
    .building-detail-grid[b-pycjyidc4f],
    .workflow-grid[b-pycjyidc4f],
    .value-highlight-grid[b-pycjyidc4f],
    .five-columns[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .source-parcel-panel[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-parcel-photo[b-pycjyidc4f] {
        max-height: 300px;
    }

    .owner-location-panel[b-pycjyidc4f] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .owner-location-panel a[b-pycjyidc4f] {
        grid-column: 1 / -1;
    }

    .source-title-row[b-pycjyidc4f],
    .calculation-heading[b-pycjyidc4f],
    .map-heading[b-pycjyidc4f] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-pycjyidc4f],
    .source-map-preview iframe[b-pycjyidc4f] {
        height: 280px;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-pycjyidc4f] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-pycjyidc4f] {
        min-height: 72px;
    }

    .factor-guide-grid > div[b-pycjyidc4f] {
        grid-template-columns:
            38px minmax(0, 1fr);
    }

    .source-actions[b-pycjyidc4f] {
        flex-direction: column;
    }

    .source-actions a[b-pycjyidc4f],
    .view-landsmaps-button[b-pycjyidc4f] {
        width: 100%;
    }

    .google-map-panel iframe[b-pycjyidc4f],
    .source-map-preview iframe[b-pycjyidc4f] {
        height: 250px;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/TaxArrears.razor.rz.scp.css */
:root[b-rb9adxx331] {
    --ar-green: var(--theme-primary);
    --ar-green-deep: var(--theme-dark);
    --ar-green-soft: #e7f5ef;
    --ar-gold: var(--theme-accent);
    --ar-blue: #2f789f;
    --ar-purple: #73569b;
    --ar-orange: #c46a2b;
    --ar-red: #b54d43;
    --ar-text: var(--theme-ink);
    --ar-muted: var(--theme-muted);
    --ar-border: rgba(10, 114, 87, .10);
    --ar-shadow: 0 14px 35px rgba(5, 62, 46, .07);
}

.arrear-page[b-rb9adxx331] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ar-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10, 114, 87, .07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199, 163, 93, .06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.arrear-page[b-rb9adxx331]  .arrear-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.arrear-hero[b-rb9adxx331] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199, 163, 93, .27), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(70, 158, 102, .23), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5, 62, 46, .19);
}

.hero-pattern[b-rb9adxx331] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-rb9adxx331] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-rb9adxx331],
.hero-action-panel[b-rb9adxx331] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-rb9adxx331] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-rb9adxx331] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-rb9adxx331] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-rb9adxx331] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-rb9adxx331] {
    margin-top: 3px;
    font-size: .58rem;
}

.arrear-hero h1[b-rb9adxx331] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.arrear-hero p[b-rb9adxx331] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-rb9adxx331] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-rb9adxx331] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-rb9adxx331] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-rb9adxx331] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-rb9adxx331] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-rb9adxx331] {
    font-size: .51rem;
}

.hero-status small[b-rb9adxx331] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.arrear-page[b-rb9adxx331]  .hero-add-button,
.arrear-page[b-rb9adxx331]  .toolbar-add-button,
.arrear-page[b-rb9adxx331]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg, var(--theme-accent), #987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .44rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.arrear-page[b-rb9adxx331]  .hero-add-button {
    min-height: 41px;
}

.hero-payment-button[b-rb9adxx331],
.hero-refresh-button[b-rb9adxx331] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-payment-button[b-rb9adxx331] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-rb9adxx331] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-rb9adxx331] {
    opacity: .55;
    cursor: wait;
}

.arrear-page[b-rb9adxx331]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.arrear-page[b-rb9adxx331]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
}

/* SUMMARY */

.summary-grid[b-rb9adxx331] {
    margin-top: 2px !important;
}

.summary-card[b-rb9adxx331] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ar-shadow);
}

.summary-card.accounts[b-rb9adxx331] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.outstanding[b-rb9adxx331] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.surcharge[b-rb9adxx331] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-card.recovery[b-rb9adxx331] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-line[b-rb9adxx331] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-rb9adxx331] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-rb9adxx331] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-rb9adxx331] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-rb9adxx331] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-rb9adxx331] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-rb9adxx331] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-rb9adxx331] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-rb9adxx331],
.status-overview-card.selected[b-rb9adxx331] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-rb9adxx331] {
    background: #f5faf7;
}

.status-overview-card > span[b-rb9adxx331] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.new > span[b-rb9adxx331] { background: var(--theme-primary); }
.status-overview-card.notice > span[b-rb9adxx331] { background: #b27a25; }
.status-overview-card.contacted > span[b-rb9adxx331] { background: #2f789f; }
.status-overview-card.installment > span[b-rb9adxx331] { background: #73569b; }
.status-overview-card.legal > span[b-rb9adxx331] { background: #7b5a36; }
.status-overview-card.critical > span[b-rb9adxx331] { background: #b54d43; }
.status-overview-card.next-due > span[b-rb9adxx331] { background: #c46a2b; }

.status-overview-card div[b-rb9adxx331] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-rb9adxx331] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-rb9adxx331] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHTS */

.arrear-insight-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-rb9adxx331] {
    padding: 15px;
    border: 1px solid var(--ar-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ar-shadow);
}

.insight-heading[b-rb9adxx331] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-rb9adxx331] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-rb9adxx331] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-rb9adxx331] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.aging-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.aging-card[b-rb9adxx331] {
    min-height: 90px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: #f9fbfa;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
}

.aging-card span[b-rb9adxx331],
.aging-card strong[b-rb9adxx331],
.aging-card small[b-rb9adxx331] {
    display: block;
}

.aging-card span[b-rb9adxx331] {
    color: var(--theme-muted);
    font-size: .37rem;
}

.aging-card strong[b-rb9adxx331] {
    margin-top: 7px;
    color: var(--theme-ink);
    font-size: .55rem;
}

.aging-card small[b-rb9adxx331] {
    margin-top: 4px;
    color: var(--theme-primary);
    font-size: .38rem;
}

.aging-card.age-over-365[b-rb9adxx331] {
    border-color: rgba(181,77,67,.16);
    background: #fff6f4;
}

.aging-card.age-over-365 small[b-rb9adxx331] { color: #b54d43; }
.aging-card.age-181-365[b-rb9adxx331] { background: #fff9ed; }
.aging-card.age-91-180[b-rb9adxx331] { background: #fffdf5; }
.aging-card.age-61-90[b-rb9adxx331] { background: #f9f6ff; }
.aging-card.age-31-60[b-rb9adxx331] { background: #f4fafc; }

.priority-list[b-rb9adxx331] {
    display: grid;
    gap: 7px;
    margin-top: 12px;
}

.priority-list > div[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    min-height: 67px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 11px;
    background: #f9fbfa;
}

.priority-list > div > span[b-rb9adxx331] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
}

.priority-list .critical > span[b-rb9adxx331] {
    color: #b54d43;
    background: #fff0ee;
}

.priority-list .high > span[b-rb9adxx331] {
    color: #c46a2b;
    background: #fff3e8;
}

.priority-list .action > span[b-rb9adxx331] {
    color: #73569b;
    background: #f0eafb;
}

.priority-list .promise > span[b-rb9adxx331] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.priority-list strong[b-rb9adxx331] {
    display: block;
    color: #3c5047;
    font-size: .47rem;
}

.priority-list small[b-rb9adxx331] {
    display: block;
    margin-top: 3px;
    color: #83918c;
    font-size: .37rem;
}

.priority-list b[b-rb9adxx331] {
    color: var(--theme-ink);
    font-size: .55rem;
}

/* FILTER / LIST */

.filter-panel[b-rb9adxx331],
.arrear-list-panel[b-rb9adxx331] {
    margin-top: 14px;
    border: 1px solid var(--ar-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ar-shadow);
}

.filter-panel[b-rb9adxx331] {
    padding: 15px;
}

.filter-heading[b-rb9adxx331],
.list-toolbar[b-rb9adxx331] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-rb9adxx331],
.panel-kicker[b-rb9adxx331] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-rb9adxx331],
.list-toolbar h2[b-rb9adxx331] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-rb9adxx331],
.list-toolbar p[b-rb9adxx331] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-rb9adxx331] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-rb9adxx331] {
    margin-top: 8px !important;
}

.arrear-page[b-rb9adxx331]  .premium-field,
.arrear-page[b-rb9adxx331]  .form-field {
    font-family: 'Kanit', sans-serif !important;
}

.arrear-page[b-rb9adxx331]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg, #178466, #0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-rb9adxx331] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-rb9adxx331] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-rb9adxx331] {
    color: var(--theme-primary);
}

.arrear-list-panel[b-rb9adxx331] {
    overflow: hidden;
}

.list-toolbar[b-rb9adxx331] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.arrear-page[b-rb9adxx331]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-rb9adxx331] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-rb9adxx331] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-rb9adxx331] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-rb9adxx331] {
    margin: 0;
    font-size: .43rem;
}

.arrear-page[b-rb9adxx331]  .arrear-table {
    font-family: 'Kanit', sans-serif;
}

.arrear-page[b-rb9adxx331]  .arrear-table .mud-table-head {
    background: #f1f7f4;
}

.arrear-page[b-rb9adxx331]  .arrear-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

/* TABLE CELLS */

.arrear-code-photo-cell[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    min-width: 175px;
    align-items: center;
    gap: 8px;
}

.arrear-photo-mini[b-rb9adxx331] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: #b54d43;
    background: #fff0ee;
}

.arrear-photo-mini button[b-rb9adxx331] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.arrear-photo-mini img[b-rb9adxx331] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.arrear-code-photo-cell strong[b-rb9adxx331] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(181,77,67,.12);
    border-radius: 8px;
    color: #ad4037;
    background: #fff5f3;
    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.arrear-code-photo-cell small[b-rb9adxx331] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .39rem;
}

.taxpayer-parcel-cell[b-rb9adxx331],
.year-aging-cell[b-rb9adxx331],
.assessment-paid-cell[b-rb9adxx331],
.principal-surcharge-cell[b-rb9adxx331],
.outstanding-total-cell[b-rb9adxx331],
.risk-status-cell[b-rb9adxx331],
.next-action-cell[b-rb9adxx331] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.taxpayer-parcel-cell[b-rb9adxx331] {
    min-width: 190px;
}

.taxpayer-parcel-cell strong[b-rb9adxx331],
.year-aging-cell strong[b-rb9adxx331],
.assessment-paid-cell strong[b-rb9adxx331],
.principal-surcharge-cell strong[b-rb9adxx331],
.outstanding-total-cell strong[b-rb9adxx331],
.next-action-cell strong[b-rb9adxx331] {
    margin-top: 4px;
    color: #3c5047;
    font-size: .51rem;
    line-height: 1.48;
}

.taxpayer-parcel-cell small[b-rb9adxx331],
.year-aging-cell small[b-rb9adxx331],
.assessment-paid-cell small[b-rb9adxx331],
.principal-surcharge-cell small[b-rb9adxx331],
.outstanding-total-cell small[b-rb9adxx331],
.next-action-cell small[b-rb9adxx331] {
    margin-top: 3px;
    color: #84928d;
    font-size: .40rem;
    line-height: 1.5;
}

.taxpayer-parcel-cell em[b-rb9adxx331],
.principal-surcharge-cell em[b-rb9adxx331],
.next-action-cell em[b-rb9adxx331] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.outstanding-total-cell strong[b-rb9adxx331] {
    color: #b54d43;
    font-size: .58rem;
}

.assessment-paid-cell small[b-rb9adxx331] {
    color: var(--theme-primary);
}

.risk-status-cell[b-rb9adxx331] {
    align-items: flex-start;
    gap: 5px;
}

/* CHIPS */

.usage-chip[b-rb9adxx331],
.risk-chip[b-rb9adxx331],
.collection-chip[b-rb9adxx331],
.aging-chip[b-rb9adxx331],
.next-action-badge[b-rb9adxx331],
.source-due-chip[b-rb9adxx331] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .38rem;
    font-weight: 700;
}

.usage-chip.residential[b-rb9adxx331] { color:#2f789f; background:#e8f3f8; }
.usage-chip.agriculture[b-rb9adxx331] { color:#43763d; background:#edf6e9; }
.usage-chip.commercial[b-rb9adxx331] { color:#9d671c; background:#fff0d8; }
.usage-chip.industrial[b-rb9adxx331] { color:#6c4e96; background:#f0eafb; }
.usage-chip.public[b-rb9adxx331] { color:var(--theme-primary); background:#e7f5ef; }
.usage-chip.vacant[b-rb9adxx331] { color:#687872; background:#edf1ef; }

.risk-chip i[b-rb9adxx331] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.risk-chip.low[b-rb9adxx331] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-rb9adxx331] { color:#9d671c; background:#fff0d8; }
.risk-chip.high[b-rb9adxx331] { color:#c05f24; background:#fff1e6; }
.risk-chip.critical[b-rb9adxx331] { color:#ad4037; background:#fff0ee; }
.risk-chip.auto[b-rb9adxx331] { color:#687872; background:#edf1ef; }

.collection-chip.new[b-rb9adxx331] { color:var(--theme-primary); background:#e7f5ef; }
.collection-chip.notice-1[b-rb9adxx331],
.collection-chip.notice-2[b-rb9adxx331] { color:#987634; background:#fff4df; }
.collection-chip.contacted[b-rb9adxx331] { color:#2f789f; background:#e8f3f8; }
.collection-chip.installment[b-rb9adxx331] { color:#6c4e96; background:#f0eafb; }
.collection-chip.legal-review[b-rb9adxx331] { color:#76532e; background:#f8eee3; }
.collection-chip.suspended[b-rb9adxx331] { color:#687872; background:#edf1ef; }
.collection-chip.closed[b-rb9adxx331] { color:#34734b; background:#e7f5ec; }
.collection-chip.cancelled[b-rb9adxx331] { color:#ad4037; background:#fff0ee; }

.aging-chip[b-rb9adxx331] {
    margin-top: 5px;
    font-style: normal;
}
.aging-chip.age-0-30[b-rb9adxx331] { color:#34734b; background:#e7f5ec; }
.aging-chip.age-31-60[b-rb9adxx331] { color:#2f789f; background:#e8f3f8; }
.aging-chip.age-61-90[b-rb9adxx331] { color:#6c4e96; background:#f0eafb; }
.aging-chip.age-91-180[b-rb9adxx331] { color:#9d671c; background:#fff0d8; }
.aging-chip.age-181-365[b-rb9adxx331] { color:#c05f24; background:#fff1e6; }
.aging-chip.age-over-365[b-rb9adxx331] { color:#ad4037; background:#fff0ee; }

.next-action-badge[b-rb9adxx331] {
    margin-top: 5px;
}
.next-action-badge.normal[b-rb9adxx331] { color:#34734b; background:#e7f5ec; }
.next-action-badge.urgent[b-rb9adxx331] { color:#9d671c; background:#fff0d8; }
.next-action-badge.overdue[b-rb9adxx331] { color:#ad4037; background:#fff0ee; }
.next-action-badge.none[b-rb9adxx331],
.next-action-badge.closed[b-rb9adxx331] { color:#687872; background:#edf1ef; }

.row-actions[b-rb9adxx331] {
    display: flex;
    min-width: 182px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.arrear-page[b-rb9adxx331]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.arrear-page[b-rb9adxx331]  .row-action.view {
    color: #2f789f !important;
    background: #edf6fb !important;
}

.arrear-page[b-rb9adxx331]  .row-action.edit {
    color: #987634 !important;
    background: #fff7e8 !important;
}

.arrear-page[b-rb9adxx331]  .row-action.print {
    color: #73569b !important;
    background: #f0eafb !important;
}

.arrear-page[b-rb9adxx331]  .row-action.delete {
    color: #b54d43 !important;
    background: #fff0ee !important;
}

.row-payment-action[b-rb9adxx331] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-rb9adxx331] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

.arrear-page[b-rb9adxx331]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
    font-family: 'Kanit', sans-serif;
}

/* MODALS */

.modal-backdrop[b-rb9adxx331],
.image-preview-backdrop[b-rb9adxx331] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.arrear-form-modal[b-rb9adxx331],
.arrear-view-modal[b-rb9adxx331],
.delete-modal[b-rb9adxx331],
.image-preview-modal[b-rb9adxx331] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-rb9adxx331],
.image-preview-header[b-rb9adxx331],
.view-modal-toolbar[b-rb9adxx331] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-rb9adxx331] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-rb9adxx331] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg, #178466, #0a5543);
}

.modal-heading small[b-rb9adxx331],
.view-modal-toolbar small[b-rb9adxx331],
.image-preview-header small[b-rb9adxx331] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.modal-heading h2[b-rb9adxx331],
.view-modal-toolbar h2[b-rb9adxx331],
.image-preview-header h3[b-rb9adxx331] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .72rem;
}

.modal-heading p[b-rb9adxx331] {
    margin: 3px 0 0;
    color: #7c8d86;
    font-size: .41rem;
}

.modal-body[b-rb9adxx331],
.view-scroll[b-rb9adxx331] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.modal-footer[b-rb9adxx331] {
    display: flex;
    min-height: 65px;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.arrear-page[b-rb9adxx331]  .cancel-button,
.arrear-page[b-rb9adxx331]  .save-button,
.arrear-page[b-rb9adxx331]  .delete-confirm-button {
    min-height: 39px;
    border-radius: 10px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.form-section-title[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    margin: 16px 0 9px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title > span[b-rb9adxx331] {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 11px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.form-section-title strong[b-rb9adxx331] {
    display: block;
    color: #3c5047;
    font-size: .52rem;
}

.form-section-title small[b-rb9adxx331] {
    display: block;
    margin-top: 3px;
    color: #84928d;
    font-size: .39rem;
}

/* SOURCE */

.source-assessment-panel[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 13px;
    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10,114,87,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10,114,87,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-rb9adxx331] {
    display: grid;
    min-height: 210px;
    overflow: hidden;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-photo button[b-rb9adxx331] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-photo img[b-rb9adxx331] {
    width: 100%;
    height: 100%;
    min-height: 210px;
    object-fit: cover;
}

.source-content[b-rb9adxx331] {
    min-width: 0;
}

.source-title-row[b-rb9adxx331] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-rb9adxx331] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-rb9adxx331] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-rb9adxx331] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .45rem;
}

.source-due-chip.low[b-rb9adxx331] { color:#34734b; background:#e7f5ec; }
.source-due-chip.medium[b-rb9adxx331] { color:#9d671c; background:#fff0d8; }
.source-due-chip.high[b-rb9adxx331] { color:#c05f24; background:#fff1e6; }
.source-due-chip.critical[b-rb9adxx331] { color:#ad4037; background:#fff0ee; }

.source-data-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-rb9adxx331] {
    min-height: 64px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #fff;
}

.source-data-grid span[b-rb9adxx331] {
    display: block;
    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-rb9adxx331] {
    display: block;
    margin-top: 5px;
    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-rb9adxx331] {
    display: flex;
    align-items: flex-start;
    gap: 5px;
    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.09);
    border-radius: 9px;
    color: #2f789f;
    background: #f4fafc;
    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-rb9adxx331] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.source-actions a[b-rb9adxx331] {
    display: inline-flex;
    min-height: 33px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #fff;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-rb9adxx331] {
    color: #73569b;
    border-color: rgba(115,86,155,.14);
    background: #f8f3ff;
}

.source-actions a:nth-child(3)[b-rb9adxx331] {
    color: #2f789f;
    border-color: rgba(47,120,159,.14);
    background: #f4fafc;
}

.source-actions a:nth-child(4)[b-rb9adxx331] {
    color: #987634;
    border-color: rgba(152,118,52,.14);
    background: #fff9ed;
}

.source-map-preview[b-rb9adxx331] {
    overflow: hidden;
    margin: -4px 0 16px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 14px;
    background: #edf2ef;
}

.source-map-preview iframe[b-rb9adxx331] {
    display: block;
    width: 100%;
    height: 280px;
    border: 0;
}

/* CALC / FORM */

.arrear-calculation-preview[b-rb9adxx331] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(181,77,67,.13);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(181,77,67,.08), transparent 18rem),
        #fff8f6;
}

.calculation-heading[b-rb9adxx331] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.calculation-heading small[b-rb9adxx331] {
    color: #b54d43;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.calculation-heading h3[b-rb9adxx331] {
    margin: 3px 0 0;
    color: #405249;
    font-size: .69rem;
}

.calculation-heading > span[b-rb9adxx331] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #ad4037;
    background: #fff0ee;
    font-size: .40rem;
    font-weight: 700;
}

.calculation-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 11px;
}

.calculation-grid > div[b-rb9adxx331] {
    min-height: 82px;
    padding: 10px;
    border: 1px solid rgba(181,77,67,.08);
    border-radius: 11px;
    background: #fff;
}

.calculation-grid > div.highlight[b-rb9adxx331] {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(145deg, #c85b50, #963b34);
    box-shadow: 0 10px 22px rgba(181,77,67,.18);
}

.calculation-grid span[b-rb9adxx331] {
    display: block;
    color: #8b7b74;
    font-size: .39rem;
}

.calculation-grid strong[b-rb9adxx331] {
    display: block;
    margin-top: 7px;
    color: #3f5249;
    font-size: .66rem;
}

.calculation-grid small[b-rb9adxx331] {
    display: block;
    margin-top: 2px;
    color: #8a9791;
    font-size: .36rem;
}

.calculation-grid .highlight span[b-rb9adxx331],
.calculation-grid .highlight strong[b-rb9adxx331],
.calculation-grid .highlight small[b-rb9adxx331] {
    color: #fff;
}

.installment-switch-row[b-rb9adxx331] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    padding: 10px;
    border: 1px solid rgba(115,86,155,.10);
    border-radius: 10px;
    background: #faf7ff;
}

.installment-switch-row span[b-rb9adxx331] {
    color: #756b80;
    font-size: .40rem;
}

.arrear-photo-upload-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.photo-upload-card[b-rb9adxx331] {
    overflow: hidden;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 13px;
    background: #fff;
}

.photo-upload-heading[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 10px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-rb9adxx331] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 11px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.photo-upload-heading strong[b-rb9adxx331] {
    display: block;
    color: #3c5047;
    font-size: .48rem;
}

.photo-upload-heading small[b-rb9adxx331] {
    display: block;
    margin-top: 3px;
    color: #84928d;
    font-size: .37rem;
}

.photo-preview[b-rb9adxx331] {
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: #edf3f0;
}

.photo-preview img[b-rb9adxx331] {
    width: 100%;
    height: 190px;
    object-fit: cover;
}

.photo-empty[b-rb9adxx331] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    color: #84928d;
}

.photo-empty strong[b-rb9adxx331] {
    color: #40544b;
    font-size: .48rem;
}

.photo-empty small[b-rb9adxx331] {
    font-size: .36rem;
}

.photo-upload-actions[b-rb9adxx331] {
    display: flex;
    gap: 7px;
    padding: 9px;
}

.file-picker-button[b-rb9adxx331],
.remove-photo-button[b-rb9adxx331] {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border-radius: 9px;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    cursor: pointer;
}

.file-picker-button[b-rb9adxx331] {
    position: relative;
    overflow: hidden;
    color: var(--theme-primary);
    border: 1px solid rgba(10,114,87,.14);
    background: #edf7f3;
}

.file-picker-button input[b-rb9adxx331] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.remove-photo-button[b-rb9adxx331] {
    color: #b54d43;
    border: 1px solid rgba(181,77,67,.14);
    background: #fff0ee;
}

.mock-rule-warning[b-rb9adxx331] {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem !important;
}

/* VIEW / PRINT */

.arrear-view-modal[b-rb9adxx331] {
    width: min(1180px, calc(100vw - 28px));
}

.view-modal-toolbar > div:last-child[b-rb9adxx331] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.view-payment-button[b-rb9adxx331],
.view-map-button[b-rb9adxx331] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border-radius: 9px;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.view-payment-button[b-rb9adxx331] {
    color: var(--theme-primary);
    border: 1px solid rgba(10,114,87,.14);
    background: #edf7f3;
}

.view-map-button[b-rb9adxx331] {
    color: #2f789f;
    border: 1px solid rgba(47,120,159,.14);
    background: #edf6fb;
}

.arrear-page[b-rb9adxx331]  .view-edit-button,
.arrear-page[b-rb9adxx331]  .view-print-button {
    min-height: 36px;
    border-radius: 9px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .40rem !important;
    text-transform: none !important;
}

.arrear-page[b-rb9adxx331]  .view-print-button {
    color: #fff !important;
    background: linear-gradient(145deg, #73569b, #523976) !important;
}

.view-scroll[b-rb9adxx331] {
    background: #e9efec;
}

.print-arrear-notice[b-rb9adxx331] {
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 34px 38px;
    border: 1px solid rgba(10,72,56,.12);
    border-radius: 4px;
    color: #263c33;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    box-shadow: 0 22px 55px rgba(5,62,46,.14);
}

.notice-header[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) 180px;
    align-items: center;
    gap: 14px;
    padding-bottom: 18px;
    border-bottom: 3px double var(--theme-primary);
}

.municipal-seal[b-rb9adxx331] {
    display: grid;
    width: 78px;
    height: 78px;
    place-items: center;
    border: 3px solid var(--theme-primary);
    border-radius: 50%;
    color: var(--theme-primary);
    background: #f3faf7;
}

.notice-organization[b-rb9adxx331] {
    text-align: center;
}

.notice-organization small[b-rb9adxx331] {
    color: #987634;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .11em;
}

.notice-organization h1[b-rb9adxx331] {
    margin: 5px 0 0;
    color: #173e35;
    font-size: 1.18rem;
}

.notice-organization p[b-rb9adxx331] {
    margin: 5px 0 0;
    color: #64766e;
    font-size: .50rem;
}

.notice-number[b-rb9adxx331] {
    padding: 10px;
    border: 1px solid rgba(181,77,67,.15);
    border-radius: 10px;
    background: #fff7f5;
    text-align: center;
}

.notice-number span[b-rb9adxx331],
.notice-number small[b-rb9adxx331] {
    display: block;
    color: #778980;
    font-size: .40rem;
}

.notice-number strong[b-rb9adxx331] {
    display: block;
    margin: 5px 0;
    color: #b54d43;
    font-size: .58rem;
}

.notice-status-strip[b-rb9adxx331] {
    display: grid;
    grid-template-columns: minmax(140px,.8fr) repeat(3,minmax(0,1fr));
    gap: 8px;
    align-items: center;
    margin-top: 14px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.notice-status-strip > div[b-rb9adxx331] {
    padding-left: 9px;
    border-left: 1px solid rgba(10,114,87,.10);
}

.notice-status-strip > div span[b-rb9adxx331] {
    display: block;
    color: #83918b;
    font-size: .38rem;
}

.notice-status-strip > div strong[b-rb9adxx331] {
    display: block;
    margin-top: 4px;
    color: #354940;
    font-size: .46rem;
}

.notice-recipient[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 58px minmax(0,1fr) 155px;
    gap: 10px;
    align-items: center;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(47,120,159,.12);
    border-radius: 11px;
    background: #f5fafc;
}

.recipient-icon[b-rb9adxx331] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(145deg,#3a86af,#245f82);
}

.notice-recipient small[b-rb9adxx331] {
    color: #2f789f;
    font-size: .40rem;
    font-weight: 700;
}

.notice-recipient h2[b-rb9adxx331] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .72rem;
}

.notice-recipient p[b-rb9adxx331] {
    margin: 4px 0 0;
    color: #6f8078;
    font-size: .43rem;
}

.recipient-status[b-rb9adxx331] {
    padding: 9px;
    border-radius: 9px;
    background: #fff;
    text-align: center;
}

.recipient-status span[b-rb9adxx331] {
    display: block;
    color: #87958f;
    font-size: .37rem;
}

.recipient-status strong[b-rb9adxx331] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .45rem;
}

.notice-property[b-rb9adxx331],
.notice-calculation[b-rb9adxx331],
.notice-followup[b-rb9adxx331],
.notice-officers[b-rb9adxx331] {
    margin-top: 16px;
}

.section-title[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 34px minmax(0,1fr);
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.section-title > span[b-rb9adxx331] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
    font-size: .48rem;
    font-weight: 800;
}

.section-title small[b-rb9adxx331] {
    color: #987634;
    font-size: .39rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.section-title h3[b-rb9adxx331] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: .61rem;
}

.property-photo-data[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 180px minmax(0,1fr);
    gap: 10px;
}

.notice-photo[b-rb9adxx331] {
    display: grid;
    min-height: 178px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf5f1;
}

.notice-photo img[b-rb9adxx331] {
    width: 100%;
    height: 100%;
    min-height: 178px;
    object-fit: cover;
}

.property-data-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 7px;
}

.property-data-grid > div[b-rb9adxx331],
.followup-grid > div[b-rb9adxx331] {
    min-height: 76px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 9px;
    background: #f9fbfa;
}

.property-data-grid span[b-rb9adxx331],
.followup-grid span[b-rb9adxx331],
.officer-grid span[b-rb9adxx331] {
    display: block;
    color: #87958f;
    font-size: .37rem;
}

.property-data-grid strong[b-rb9adxx331],
.followup-grid strong[b-rb9adxx331],
.officer-grid strong[b-rb9adxx331] {
    display: block;
    margin-top: 5px;
    color: #354940;
    font-size: .44rem;
    line-height: 1.48;
}

.notice-address[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 28px minmax(0,1fr) auto;
    gap: 7px;
    align-items: center;
    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.09);
    border-radius: 9px;
    color: #2f789f;
    background: #f4fafc;
}

.notice-address div[b-rb9adxx331] {
    display: flex;
    flex-direction: column;
}

.notice-address span[b-rb9adxx331] { font-size: .37rem; }
.notice-address strong[b-rb9adxx331] {
    margin-top: 3px;
    color: #455950;
    font-size: .44rem;
}
.notice-address a[b-rb9adxx331] {
    padding: 6px 8px;
    border-radius: 7px;
    color: #2f789f;
    background: #fff;
    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.arrear-calculation-table[b-rb9adxx331] {
    overflow: hidden;
    border: 1px solid rgba(10,114,87,.11);
    border-radius: 10px;
}

.arrear-calculation-table > div[b-rb9adxx331] {
    display: grid;
    grid-template-columns: minmax(0,1fr) 220px;
    min-height: 42px;
    align-items: center;
    border-bottom: 1px solid rgba(10,114,87,.07);
}

.arrear-calculation-table > div:last-child[b-rb9adxx331] {
    border-bottom: 0;
}

.arrear-calculation-table span[b-rb9adxx331],
.arrear-calculation-table strong[b-rb9adxx331] {
    padding: 8px 10px;
    font-size: .43rem;
}

.arrear-calculation-table strong[b-rb9adxx331] {
    border-left: 1px solid rgba(10,114,87,.07);
    color: #354940;
    text-align: right;
}

.arrear-calculation-table .table-header[b-rb9adxx331] {
    color: #fff;
    background: linear-gradient(145deg,#17725a,#0a5543);
}

.arrear-calculation-table .subtotal[b-rb9adxx331] {
    background: #f4faf7;
}

.arrear-calculation-table .grand-total[b-rb9adxx331] {
    color: #fff;
    background: linear-gradient(145deg,#b54d43,#8f342e);
}

.arrear-calculation-table .grand-total strong[b-rb9adxx331] {
    color: #fff;
    border-left-color: rgba(255,255,255,.15);
    font-size: .55rem;
}

.followup-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 7px;
}

.contact-note[b-rb9adxx331] {
    margin-top: 8px;
    padding: 10px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 9px;
    background: #f4fafc;
}

.contact-note strong[b-rb9adxx331] {
    color: #2f789f;
    font-size: .42rem;
}

.contact-note p[b-rb9adxx331] {
    margin: 4px 0 0;
    color: #5e7068;
    font-size: .42rem;
    line-height: 1.6;
}

.officer-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
}

.officer-grid > div[b-rb9adxx331] {
    min-height: 110px;
    padding: 18px 9px 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 9px;
    background: #f9fbfa;
    text-align: center;
}

.officer-grid > div[b-rb9adxx331]::before {
    display: block;
    width: 80%;
    height: 1px;
    margin: 0 auto 11px;
    background: rgba(48,71,61,.28);
    content: "";
}

.officer-grid em[b-rb9adxx331] {
    display: block;
    margin-top: 5px;
    color: #87958f;
    font-size: .35rem;
    font-style: normal;
}

.notice-footer[b-rb9adxx331] {
    display: grid;
    grid-template-columns: minmax(0,1fr) 110px;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 3px double var(--theme-primary);
}

.notice-footer strong[b-rb9adxx331] {
    color: var(--theme-primary);
    font-size: .43rem;
}

.notice-footer p[b-rb9adxx331] {
    margin: 4px 0 0;
    color: #62756c;
    font-size: .39rem;
    line-height: 1.6;
}

.notice-qr-placeholder[b-rb9adxx331] {
    display: grid;
    min-height: 90px;
    place-items: center;
    border: 1px dashed rgba(10,114,87,.24);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f5faf8;
}

.notice-qr-placeholder span[b-rb9adxx331] {
    font-size: .33rem;
    font-weight: 700;
}

.mock-notice[b-rb9adxx331] {
    margin-top: 12px;
    padding: 6px;
    border-radius: 7px;
    color: #ad4037;
    background: #fff0ee;
    font-size: .35rem;
    font-weight: 700;
    text-align: center;
}

.google-map-panel[b-rb9adxx331],
.history-panel[b-rb9adxx331],
.attachment-panel[b-rb9adxx331] {
    width: min(900px,100%);
    margin: 14px auto 0;
    padding: 14px;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 14px;
    background: #fff;
}

.google-map-panel[b-rb9adxx331] {
    overflow: hidden;
    padding: 0;
}

.map-heading[b-rb9adxx331],
.section-heading[b-rb9adxx331] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 13px;
}

.section-heading[b-rb9adxx331] {
    padding: 0 0 10px;
}

.map-heading small[b-rb9adxx331],
.section-heading small[b-rb9adxx331] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-rb9adxx331],
.section-heading h3[b-rb9adxx331] {
    margin: 3px 0 0;
    color: #34483f;
    font-size: .65rem;
}

.map-heading > span[b-rb9adxx331],
.section-heading > span[b-rb9adxx331] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .39rem;
    font-weight: 700;
}

.google-map-panel iframe[b-rb9adxx331] {
    display: block;
    width: 100%;
    height: 350px;
    border: 0;
}

.history-list[b-rb9adxx331] {
    display: grid;
    gap: 7px;
}

.history-item[b-rb9adxx331] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 10px;
    background: #f9fbfa;
}

.history-item > span[b-rb9adxx331] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.history-item > div > div[b-rb9adxx331] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.history-item strong[b-rb9adxx331] {
    color: #3c5047;
    font-size: .46rem;
}

.history-item small[b-rb9adxx331],
.history-item em[b-rb9adxx331] {
    color: #84928d;
    font-size: .36rem;
    font-style: normal;
}

.history-item p[b-rb9adxx331] {
    margin: 4px 0;
    color: #5e7068;
    font-size: .41rem;
    line-height: 1.55;
}

.attachment-grid[b-rb9adxx331] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 8px;
}

.attachment-card[b-rb9adxx331] {
    position: relative;
    min-height: 145px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 11px;
    background: #fff;
    cursor: zoom-in;
}

.attachment-card img[b-rb9adxx331] {
    width: 100%;
    height: 145px;
    object-fit: cover;
}

.attachment-card > span[b-rb9adxx331] {
    position: absolute;
    inset: auto 7px 7px 7px;
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    color: #fff;
    background: rgba(5,50,40,.83);
    font-family: 'Kanit',sans-serif;
    font-size: .37rem;
    font-weight: 700;
    backdrop-filter: blur(7px);
}

.attachment-card.land > span[b-rb9adxx331] { background: rgba(77,124,69,.89); }
.attachment-card.deed > span[b-rb9adxx331] { background: rgba(152,118,52,.89); }
.attachment-card.map > span[b-rb9adxx331] { background: rgba(47,120,159,.89); }
.attachment-card.survey > span[b-rb9adxx331] { background: rgba(10,114,87,.89); }
.attachment-card.valuation > span[b-rb9adxx331] { background: rgba(115,86,155,.89); }
.attachment-card.notice > span[b-rb9adxx331] { background: rgba(166,110,56,.89); }
.attachment-card.payment > span[b-rb9adxx331] { background: rgba(47,120,159,.89); }
.attachment-card.arrear-notice > span[b-rb9adxx331] { background: rgba(181,77,67,.89); }
.attachment-card.contact > span[b-rb9adxx331] { background: rgba(123,90,54,.89); }

.attachment-empty[b-rb9adxx331] {
    grid-column: 1 / -1;
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    border: 1px dashed rgba(10,114,87,.18);
    border-radius: 11px;
    color: #7c8d86;
}

.image-preview-modal[b-rb9adxx331] {
    width: min(1120px, calc(100vw - 28px));
}

.image-preview-body[b-rb9adxx331] {
    display: grid;
    min-height: 420px;
    max-height: calc(100vh - 110px);
    overflow: auto;
    place-items: center;
    padding: 12px;
    background: #edf2ef;
}

.image-preview-body img[b-rb9adxx331] {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 145px);
    border-radius: 12px;
    object-fit: contain;
    box-shadow: 0 18px 40px rgba(5,62,46,.16);
}

/* DELETE */

.delete-modal[b-rb9adxx331] {
    width: min(470px, calc(100vw - 28px));
    padding: 22px;
    text-align: center;
}

.delete-icon[b-rb9adxx331] {
    display: grid;
    width: 66px;
    height: 66px;
    margin: 0 auto;
    place-items: center;
    border-radius: 20px;
    color: #b54d43;
    background: #fff0ee;
}

.delete-modal h2[b-rb9adxx331] {
    margin: 13px 0 0;
    color: var(--theme-ink);
    font-size: .72rem;
}

.delete-modal p[b-rb9adxx331] {
    margin: 8px 0 0;
    color: #6f8078;
    font-size: .45rem;
    line-height: 1.7;
}

.delete-modal p strong[b-rb9adxx331] {
    color: #b54d43;
}

.delete-warning[b-rb9adxx331] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 12px;
    padding: 10px;
    border: 1px solid rgba(181,77,67,.12);
    border-radius: 10px;
    color: #9b5149;
    background: #fff7f5;
    font-size: .40rem;
    line-height: 1.55;
    text-align: left;
}

.delete-actions[b-rb9adxx331] {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 15px;
}

.arrear-page[b-rb9adxx331]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1450px) {
    .status-overview[b-rb9adxx331] {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    .aging-grid[b-rb9adxx331] {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .arrear-insight-grid[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .source-data-grid[b-rb9adxx331],
    .calculation-grid[b-rb9adxx331],
    .property-data-grid[b-rb9adxx331],
    .followup-grid[b-rb9adxx331] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .arrear-hero[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .hero-action-panel[b-rb9adxx331] {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .hero-status[b-rb9adxx331] {
        grid-column: 1 / -1;
    }

    .source-assessment-panel[b-rb9adxx331] {
        grid-template-columns: 190px minmax(0,1fr);
    }

    .notice-header[b-rb9adxx331] {
        grid-template-columns: 70px minmax(0,1fr);
    }

    .notice-number[b-rb9adxx331] {
        grid-column: 1 / -1;
    }

    .notice-status-strip[b-rb9adxx331] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .property-photo-data[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .arrear-page[b-rb9adxx331] {
        padding-top: 10px;
    }

    .arrear-page[b-rb9adxx331]  .arrear-container {
        padding-inline: 10px !important;
    }

    .arrear-hero[b-rb9adxx331] {
        padding: 18px 15px;
        border-radius: 17px;
    }

    .filter-heading[b-rb9adxx331],
    .list-toolbar[b-rb9adxx331],
    .source-title-row[b-rb9adxx331],
    .calculation-heading[b-rb9adxx331],
    .view-modal-toolbar[b-rb9adxx331],
    .map-heading[b-rb9adxx331],
    .section-heading[b-rb9adxx331] {
        align-items: flex-start;
        flex-direction: column;
    }

    .status-overview[b-rb9adxx331] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .aging-grid[b-rb9adxx331],
    .source-data-grid[b-rb9adxx331],
    .calculation-grid[b-rb9adxx331],
    .arrear-photo-upload-grid[b-rb9adxx331],
    .property-data-grid[b-rb9adxx331],
    .followup-grid[b-rb9adxx331],
    .officer-grid[b-rb9adxx331],
    .attachment-grid[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .source-assessment-panel[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .source-photo[b-rb9adxx331] {
        max-height: 300px;
    }

    .installment-switch-row[b-rb9adxx331] {
        align-items: flex-start;
        flex-direction: column;
    }

    .view-modal-toolbar > div:last-child[b-rb9adxx331] {
        width: 100%;
    }

    .print-arrear-notice[b-rb9adxx331] {
        padding: 22px 18px;
    }

    .notice-recipient[b-rb9adxx331] {
        grid-template-columns: 52px minmax(0,1fr);
    }

    .recipient-status[b-rb9adxx331] {
        grid-column: 1 / -1;
    }

    .notice-address[b-rb9adxx331] {
        grid-template-columns: 28px minmax(0,1fr);
    }

    .notice-address a[b-rb9adxx331] {
        grid-column: 1 / -1;
    }

    .notice-footer[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .google-map-panel iframe[b-rb9adxx331],
    .source-map-preview iframe[b-rb9adxx331] {
        height: 280px;
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .hero-status[b-rb9adxx331] {
        grid-column: auto;
    }

    .status-overview[b-rb9adxx331],
    .aging-grid[b-rb9adxx331],
    .notice-status-strip[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .source-actions[b-rb9adxx331] {
        flex-direction: column;
    }

    .source-actions a[b-rb9adxx331],
    .view-payment-button[b-rb9adxx331],
    .view-map-button[b-rb9adxx331] {
        width: 100%;
    }

    .notice-header[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
        text-align: center;
    }

    .municipal-seal[b-rb9adxx331] {
        margin: 0 auto;
    }

    .arrear-calculation-table > div[b-rb9adxx331] {
        grid-template-columns: minmax(0,1fr);
    }

    .arrear-calculation-table strong[b-rb9adxx331] {
        border-top: 1px solid rgba(10,114,87,.07);
        border-left: 0;
    }

    .google-map-panel iframe[b-rb9adxx331],
    .source-map-preview iframe[b-rb9adxx331] {
        height: 250px;
    }
}

/* PRINT */

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm;
    }

    body *[b-rb9adxx331] {
        visibility: hidden !important;
    }

    #tax-arrear-print-area[b-rb9adxx331],
    #tax-arrear-print-area *[b-rb9adxx331] {
        visibility: visible !important;
    }

    #tax-arrear-print-area[b-rb9adxx331] {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .no-print[b-rb9adxx331] {
        display: none !important;
    }

    .modal-backdrop[b-rb9adxx331],
    .arrear-view-modal[b-rb9adxx331],
    .view-scroll[b-rb9adxx331] {
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;
        padding: 0 !important;
        border: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .notice-header[b-rb9adxx331],
    .notice-status-strip[b-rb9adxx331],
    .notice-recipient[b-rb9adxx331],
    .notice-property[b-rb9adxx331],
    .notice-calculation[b-rb9adxx331],
    .notice-followup[b-rb9adxx331],
    .notice-officers[b-rb9adxx331],
    .notice-footer[b-rb9adxx331] {
        break-inside: avoid;
    }

    .mock-notice[b-rb9adxx331] {
        border: 1px solid #999;
        color: #555;
        background: #fff;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/TaxAssessments.razor.rz.scp.css */
.tax-page[b-0kazjr9qkf] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.tax-page[b-0kazjr9qkf]  .tax-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.tax-hero[b-0kazjr9qkf] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-0kazjr9qkf] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-0kazjr9qkf] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-0kazjr9qkf] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-0kazjr9qkf] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-0kazjr9qkf] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-0kazjr9qkf] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-0kazjr9qkf] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-0kazjr9qkf] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-0kazjr9qkf] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-0kazjr9qkf] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-0kazjr9qkf] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-0kazjr9qkf] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.tax-page[b-0kazjr9qkf]  .hero-add-button,
.tax-page[b-0kazjr9qkf]  .search-button,
.tax-page[b-0kazjr9qkf]  .toolbar-add-button,
.tax-page[b-0kazjr9qkf]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.tax-page[b-0kazjr9qkf]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-0kazjr9qkf] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-0kazjr9qkf] {
    opacity: .55;
    cursor: not-allowed;
}

.tax-page[b-0kazjr9qkf]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.tax-page[b-0kazjr9qkf]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-0kazjr9qkf] {
    margin-top: 7px;
}

.summary-card[b-0kazjr9qkf] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-0kazjr9qkf] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-0kazjr9qkf] {
    color: #2c7da8;
}

.summary-card.approved[b-0kazjr9qkf] {
    color: #7658a7;
}

.summary-card.incomplete[b-0kazjr9qkf] {
    color: #c05b4e;
}

.summary-line[b-0kazjr9qkf] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-0kazjr9qkf] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-0kazjr9qkf] {
    min-width: 0;
}

.summary-card small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-0kazjr9qkf] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-0kazjr9qkf] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-0kazjr9qkf] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-0kazjr9qkf],
.tax-list-panel[b-0kazjr9qkf] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-0kazjr9qkf],
.list-toolbar[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-0kazjr9qkf],
.panel-kicker[b-0kazjr9qkf] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-0kazjr9qkf],
.list-toolbar h2[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-0kazjr9qkf],
.list-toolbar p[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-0kazjr9qkf] {
    align-items: center;
}

.tax-page[b-0kazjr9qkf]  .premium-field,
.tax-page[b-0kazjr9qkf]  .form-field {
    width: 100%;
}

.tax-page[b-0kazjr9qkf]  .premium-field .mud-input-outlined-border,
.tax-page[b-0kazjr9qkf]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.tax-page[b-0kazjr9qkf]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.tax-page[b-0kazjr9qkf]  .sort-select {
    width: 160px;
}

.tax-page[b-0kazjr9qkf]  .toolbar-add-button {
    min-height: 42px;
}

.tax-page[b-0kazjr9qkf]  .tax-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.tax-page[b-0kazjr9qkf]  .tax-table .mud-table-head {
    background: #eef6f2;
}

.tax-page[b-0kazjr9qkf]  .tax-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-0kazjr9qkf] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-0kazjr9qkf],
.view-avatar[b-0kazjr9qkf] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-0kazjr9qkf],
.view-avatar.female[b-0kazjr9qkf] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-0kazjr9qkf],
.view-avatar.other[b-0kazjr9qkf] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-0kazjr9qkf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-0kazjr9qkf],
.person-name small[b-0kazjr9qkf] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-0kazjr9qkf] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-0kazjr9qkf] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-0kazjr9qkf] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-0kazjr9qkf] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-0kazjr9qkf],
.area-cell[b-0kazjr9qkf],
.date-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-0kazjr9qkf] {
    gap: 3px;
}

.contact-cell span[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-0kazjr9qkf],
.date-cell strong[b-0kazjr9qkf] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-0kazjr9qkf],
.date-cell small[b-0kazjr9qkf] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-0kazjr9qkf],
.document-chip[b-0kazjr9qkf],
.status-chip[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-0kazjr9qkf] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-0kazjr9qkf] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-0kazjr9qkf] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-0kazjr9qkf] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-0kazjr9qkf] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-0kazjr9qkf] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-0kazjr9qkf] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-0kazjr9qkf] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-0kazjr9qkf] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.tax-page[b-0kazjr9qkf]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.tax-page[b-0kazjr9qkf]  .row-action.view {
    color: #2d79a2;
}

.tax-page[b-0kazjr9qkf]  .row-action.edit {
    color: var(--theme-primary);
}

.tax-page[b-0kazjr9qkf]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.tax-page[b-0kazjr9qkf]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-0kazjr9qkf] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-0kazjr9qkf] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-0kazjr9qkf] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-0kazjr9qkf] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-0kazjr9qkf] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.tax-form-modal[b-0kazjr9qkf],
.tax-view-modal[b-0kazjr9qkf],
.delete-modal[b-0kazjr9qkf] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-0kazjr9qkf .22s ease-out;
}

@keyframes modalAppear-b-0kazjr9qkf {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.tax-form-modal[b-0kazjr9qkf] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-0kazjr9qkf] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-0kazjr9qkf] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-0kazjr9qkf] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-0kazjr9qkf] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-0kazjr9qkf] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-0kazjr9qkf] {
    margin-top: 24px;
}

.form-section-title > span[b-0kazjr9qkf] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-0kazjr9qkf] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-0kazjr9qkf] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-0kazjr9qkf] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-0kazjr9qkf] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-0kazjr9qkf] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tax-page[b-0kazjr9qkf]  .cancel-button,
.tax-page[b-0kazjr9qkf]  .save-button,
.tax-page[b-0kazjr9qkf]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.tax-page[b-0kazjr9qkf]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.tax-page[b-0kazjr9qkf]  .save-button {
    min-width: 170px;
}

.tax-view-modal[b-0kazjr9qkf] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-0kazjr9qkf] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-0kazjr9qkf] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-0kazjr9qkf] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-0kazjr9qkf] {
    padding: 61px 24px 25px;
}

.view-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-0kazjr9qkf] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-0kazjr9qkf] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-0kazjr9qkf] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-0kazjr9qkf],
.view-address small[b-0kazjr9qkf],
.view-note small[b-0kazjr9qkf] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-0kazjr9qkf] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-0kazjr9qkf] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-0kazjr9qkf] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-0kazjr9qkf] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-0kazjr9qkf] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-0kazjr9qkf] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-0kazjr9qkf] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-0kazjr9qkf] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-0kazjr9qkf] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-0kazjr9qkf] {
    color: #963b36;
}

.delete-warning[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.tax-page[b-0kazjr9qkf]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .tax-hero[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-0kazjr9qkf] {
        max-width: 570px;
    }

    .list-toolbar[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-0kazjr9qkf] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .tax-page[b-0kazjr9qkf] {
        padding: 15px 12px 30px;
    }

    .tax-hero[b-0kazjr9qkf] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-0kazjr9qkf] {
        font-size: 2.3rem;
    }

    .hero-meta[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-0kazjr9qkf] {
        width: 100%;
    }

    .filter-heading[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }

    .tax-page[b-0kazjr9qkf]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-0kazjr9qkf] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-0kazjr9qkf] {
        align-items: end;
        padding: 0;
    }

    .tax-form-modal[b-0kazjr9qkf],
    .tax-view-modal[b-0kazjr9qkf] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-0kazjr9qkf] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-0kazjr9qkf],
    .tax-list-panel[b-0kazjr9qkf] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-0kazjr9qkf] {
        align-items: flex-start;
    }

    .modal-icon[b-0kazjr9qkf] {
        display: none;
    }

    .modal-footer[b-0kazjr9qkf] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tax-page[b-0kazjr9qkf]  .save-button {
        min-width: 0;
    }

    .view-heading[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-0kazjr9qkf],
    .tax-form-modal[b-0kazjr9qkf],
    .tax-view-modal[b-0kazjr9qkf],
    .delete-modal[b-0kazjr9qkf] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.tax-page[b-0kazjr9qkf]  .hero-add-button,
.tax-page[b-0kazjr9qkf]  .toolbar-add-button,
.tax-page[b-0kazjr9qkf]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-0kazjr9qkf] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-0kazjr9qkf] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-0kazjr9qkf] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-0kazjr9qkf] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-0kazjr9qkf] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-0kazjr9qkf] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-0kazjr9qkf] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-0kazjr9qkf] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-0kazjr9qkf] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-0kazjr9qkf] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-0kazjr9qkf] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.status-overview-card div[b-0kazjr9qkf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-0kazjr9qkf] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-0kazjr9qkf],
.applicant-cell[b-0kazjr9qkf],
.status-document-cell[b-0kazjr9qkf],
.officer-cell[b-0kazjr9qkf],
.fee-cell[b-0kazjr9qkf],
.due-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-0kazjr9qkf] {
    min-width: 190px;
}

.project-cell strong[b-0kazjr9qkf],
.applicant-cell strong[b-0kazjr9qkf],
.officer-cell strong[b-0kazjr9qkf],
.fee-cell strong[b-0kazjr9qkf],
.due-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-0kazjr9qkf],
.applicant-cell small[b-0kazjr9qkf],
.officer-cell small[b-0kazjr9qkf],
.due-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-0kazjr9qkf] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-0kazjr9qkf],
.due-cell.due-soon small[b-0kazjr9qkf] {
    color: #b14a40;
}

.permit-type-chip[b-0kazjr9qkf],
.priority-chip[b-0kazjr9qkf],
.document-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-0kazjr9qkf],
.permit-type-chip.occupancy[b-0kazjr9qkf] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-0kazjr9qkf] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-0kazjr9qkf],
.permit-type-chip.factory[b-0kazjr9qkf] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-0kazjr9qkf],
.permit-type-chip.market[b-0kazjr9qkf] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-0kazjr9qkf] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-0kazjr9qkf] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-0kazjr9qkf],
.permit-type-chip.event[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-0kazjr9qkf] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-0kazjr9qkf] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-0kazjr9qkf] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-0kazjr9qkf] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-0kazjr9qkf] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-0kazjr9qkf],
.status-chip.inspection[b-0kazjr9qkf],
.status-chip.reviewing[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-0kazjr9qkf] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-0kazjr9qkf] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-0kazjr9qkf] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-0kazjr9qkf] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-0kazjr9qkf] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-0kazjr9qkf] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-0kazjr9qkf] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-0kazjr9qkf] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-0kazjr9qkf] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.8rem;
}

.photo-empty strong[b-0kazjr9qkf] {
    font-size: .48rem;
}

.photo-empty small[b-0kazjr9qkf] {
    font-size: .38rem;
}

.photo-upload-actions[b-0kazjr9qkf] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-0kazjr9qkf],
.remove-photo-button[b-0kazjr9qkf] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-0kazjr9qkf] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-0kazjr9qkf] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-0kazjr9qkf] {
    margin-top: 12px;
}

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.valuation-identity-banner[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-0kazjr9qkf] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-0kazjr9qkf] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-0kazjr9qkf] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-0kazjr9qkf] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-0kazjr9qkf] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-0kazjr9qkf] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-0kazjr9qkf] {
    font-style: normal;
}

.approval-location-panel b[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-0kazjr9qkf] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-0kazjr9qkf] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-0kazjr9qkf] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-0kazjr9qkf] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-0kazjr9qkf] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-0kazjr9qkf] {
    display: grid;
    gap: 10px;
}

.three-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-0kazjr9qkf] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-0kazjr9qkf] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-0kazjr9qkf] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-0kazjr9qkf] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-0kazjr9qkf] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-0kazjr9qkf] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-0kazjr9qkf] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-0kazjr9qkf] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-0kazjr9qkf] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-0kazjr9qkf] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-0kazjr9qkf] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-0kazjr9qkf] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .three-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .tax-photo-upload-grid[b-0kazjr9qkf],
    .project-summary-grid[b-0kazjr9qkf],
    .inspection-note-grid[b-0kazjr9qkf],
    .three-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-0kazjr9qkf] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-0kazjr9qkf] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-0kazjr9qkf],
    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
        min-height: 72px;
    }

    .view-toolbar[b-0kazjr9qkf] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-0kazjr9qkf] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-0kazjr9qkf],
    .tax-page[b-0kazjr9qkf]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-0kazjr9qkf] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-0kazjr9qkf] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-0kazjr9qkf] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-0kazjr9qkf] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-0kazjr9qkf] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-0kazjr9qkf] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-0kazjr9qkf] {
    background: #73569b;
}

.status-overview-card.completed > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-0kazjr9qkf] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-0kazjr9qkf],
.appointment-cell[b-0kazjr9qkf],
.team-cell[b-0kazjr9qkf],
.status-result-cell[b-0kazjr9qkf],
.applicant-cell[b-0kazjr9qkf],
.notification-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-0kazjr9qkf] {
    min-width: 190px;
}

.project-cell strong[b-0kazjr9qkf],
.appointment-cell strong[b-0kazjr9qkf],
.team-cell strong[b-0kazjr9qkf],
.applicant-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-0kazjr9qkf],
.appointment-cell small[b-0kazjr9qkf],
.team-cell small[b-0kazjr9qkf],
.applicant-cell small[b-0kazjr9qkf],
.notification-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-0kazjr9qkf],
.team-cell em[b-0kazjr9qkf],
.applicant-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-0kazjr9qkf],
.appointment-cell.overdue small[b-0kazjr9qkf] {
    color: #b0443b;
}

.status-result-cell[b-0kazjr9qkf] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-0kazjr9qkf] {
    align-items: flex-start;
}

.notification-cell > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-0kazjr9qkf] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-0kazjr9qkf] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-0kazjr9qkf] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-0kazjr9qkf] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-0kazjr9qkf] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-0kazjr9qkf] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-0kazjr9qkf] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-0kazjr9qkf] {
    font-size: 2rem;
}

.source-priority[b-0kazjr9qkf] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-0kazjr9qkf] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-0kazjr9qkf] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-0kazjr9qkf] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-0kazjr9qkf] {
    padding: 10px;
}

.source-picker-content > small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-0kazjr9qkf] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-0kazjr9qkf] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-0kazjr9qkf] {
    margin-bottom: 16px;
}

.locked-application-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-0kazjr9qkf] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-0kazjr9qkf] {
    font-size: 2.4rem;
}

.locked-application-content[b-0kazjr9qkf] {
    min-width: 0;
}

.locked-application-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-0kazjr9qkf] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-0kazjr9qkf] {
    grid-column: span 2;
}

.locked-application-grid span[b-0kazjr9qkf] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-0kazjr9qkf],
.source-panel-actions button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-0kazjr9qkf] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-0kazjr9qkf] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-0kazjr9qkf] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-0kazjr9qkf] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-0kazjr9qkf] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-0kazjr9qkf] {
    font-style: normal;
}

.approval-location-panel b[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-0kazjr9qkf] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-0kazjr9qkf] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-0kazjr9qkf] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-0kazjr9qkf] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-0kazjr9qkf] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-0kazjr9qkf] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-0kazjr9qkf] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-0kazjr9qkf] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-0kazjr9qkf] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-0kazjr9qkf] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-0kazjr9qkf] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-0kazjr9qkf] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-0kazjr9qkf] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-0kazjr9qkf],
    .five-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-0kazjr9qkf] {
        max-height: 310px;
    }

    .locked-application-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-0kazjr9qkf],
    .five-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-0kazjr9qkf],
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .inspection-note-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-0kazjr9qkf],
    .five-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-0kazjr9qkf] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-0kazjr9qkf],
    .locked-application-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-0kazjr9qkf] {
        grid-column: auto;
    }

    .locked-application-heading[b-0kazjr9qkf] {
        flex-direction: column;
    }

    .locked-application-badges[b-0kazjr9qkf] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-0kazjr9qkf] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-0kazjr9qkf] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-0kazjr9qkf] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-0kazjr9qkf] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-0kazjr9qkf] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-0kazjr9qkf] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-0kazjr9qkf] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-0kazjr9qkf] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-0kazjr9qkf] {
    background: #73569b;
}

.status-overview-card.revision > span[b-0kazjr9qkf] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-0kazjr9qkf] {
    background: #9f4139;
}

.source-note[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-0kazjr9qkf],
.inspection-result-cell[b-0kazjr9qkf],
.status-recommendation-cell[b-0kazjr9qkf],
.reviewer-cell[b-0kazjr9qkf],
.decision-cell[b-0kazjr9qkf],
.permit-fee-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-0kazjr9qkf] {
    min-width: 190px;
}

.project-cell strong[b-0kazjr9qkf],
.inspection-result-cell strong[b-0kazjr9qkf],
.reviewer-cell strong[b-0kazjr9qkf],
.decision-cell strong[b-0kazjr9qkf],
.permit-fee-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-0kazjr9qkf],
.inspection-result-cell small[b-0kazjr9qkf],
.reviewer-cell small[b-0kazjr9qkf],
.decision-cell small[b-0kazjr9qkf],
.permit-fee-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-0kazjr9qkf] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-0kazjr9qkf] {
    gap: 4px;
}

.decision-cell.overdue strong[b-0kazjr9qkf],
.decision-cell.overdue small[b-0kazjr9qkf] {
    color: #ad4037;
}

.permit-fee-cell > span[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-0kazjr9qkf],
.recommendation-chip[b-0kazjr9qkf],
.final-decision-chip[b-0kazjr9qkf],
.inspection-result-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-0kazjr9qkf] {
    gap: 5px;
}

.review-status-chip > i[b-0kazjr9qkf] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-0kazjr9qkf] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-0kazjr9qkf] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-0kazjr9qkf] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-0kazjr9qkf] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-0kazjr9qkf] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-0kazjr9qkf] {
    font-size: 2.4rem;
}

.locked-source-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-0kazjr9qkf] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-0kazjr9qkf] {
    grid-column: span 2;
}

.locked-source-grid span[b-0kazjr9qkf] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-0kazjr9qkf] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-0kazjr9qkf] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-0kazjr9qkf] {
    font-style: normal;
}

.approval-location-panel b[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-0kazjr9qkf] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-0kazjr9qkf] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-0kazjr9qkf] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-0kazjr9qkf],
.condition-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-0kazjr9qkf],
.condition-grid > div[b-0kazjr9qkf] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-0kazjr9qkf] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-0kazjr9qkf] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-0kazjr9qkf] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-0kazjr9qkf] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-0kazjr9qkf] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-0kazjr9qkf] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-0kazjr9qkf] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-0kazjr9qkf],
.condition-grid small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-0kazjr9qkf],
.condition-grid p[b-0kazjr9qkf] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-0kazjr9qkf] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-0kazjr9qkf] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-0kazjr9qkf],
    .six-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-0kazjr9qkf] {
        max-height: 320px;
    }

    .locked-source-grid[b-0kazjr9qkf],
    .decision-summary-grid[b-0kazjr9qkf],
    .six-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .opinion-grid[b-0kazjr9qkf],
    .condition-grid[b-0kazjr9qkf],
    .decision-summary-grid[b-0kazjr9qkf],
    .six-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-0kazjr9qkf] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-0kazjr9qkf],
    .locked-source-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-0kazjr9qkf] {
        grid-column: auto;
    }

    .locked-source-heading[b-0kazjr9qkf] {
        flex-direction: column;
    }

    .locked-source-badges[b-0kazjr9qkf] {
        justify-content: flex-start;
    }
}


/* =========================================================
   LAND PARCEL REGISTRY PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --land-green: var(--theme-primary);
    --land-deep: var(--theme-dark);
    --land-gold: var(--theme-accent);
    --land-blue: #2f789f;
    --land-purple: #73569b;
    --land-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .27),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.summary-card.total[b-0kazjr9qkf] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.area[b-0kazjr9qkf] {
    --summary-accent: #4d7c45;
    --summary-soft: #edf6e9;
    --summary-border: rgba(77, 124, 69, .20);
}

.summary-card.value[b-0kazjr9qkf] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.coordinate[b-0kazjr9qkf] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.transfer > span[b-0kazjr9qkf] {
    background: #b27a25;
}

.status-overview-card.disputed > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.status-overview-card.coordinate > span[b-0kazjr9qkf] {
    background: #2f789f;
}

.status-overview-card.missing > span[b-0kazjr9qkf] {
    background: #7d665f;
}

.status-overview-card.review > span[b-0kazjr9qkf] {
    background: #73569b;
}

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 150px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .40rem;
    font-weight: 650;
}

.owner-cell[b-0kazjr9qkf],
.area-cell[b-0kazjr9qkf],
.location-cell[b-0kazjr9qkf],
.value-cell[b-0kazjr9qkf],
.status-review-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.owner-cell[b-0kazjr9qkf],
.location-cell[b-0kazjr9qkf] {
    min-width: 180px;
}

.owner-cell strong[b-0kazjr9qkf],
.area-cell strong[b-0kazjr9qkf],
.location-cell strong[b-0kazjr9qkf],
.value-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.owner-cell small[b-0kazjr9qkf],
.area-cell small[b-0kazjr9qkf],
.location-cell small[b-0kazjr9qkf],
.value-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.owner-cell em[b-0kazjr9qkf],
.value-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.location-cell a[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;

    align-items: center;
    gap: 4px;

    margin-top: 6px;
    padding: 0 7px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 999px;

    color: #2f789f;
    background: #edf6fb;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.missing-coordinate[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 6px;
    padding: 0 7px;

    border-radius: 999px;

    color: #775f59;
    background: #f0e9e7;

    font-size: .38rem;
    font-style: normal;
    font-weight: 700;
}

.status-review-cell[b-0kazjr9qkf] {
    align-items: flex-start;
    gap: 5px;
}

.owner-type-chip[b-0kazjr9qkf],
.usage-chip[b-0kazjr9qkf],
.land-type-chip[b-0kazjr9qkf],
.coordinate-ready-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    gap: 4px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.owner-type-chip.person[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-type-chip.company[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.owner-type-chip.government[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.owner-type-chip.community[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.residential[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-0kazjr9qkf] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.land-type-chip.chanote[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.land-type-chip.ns3k[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.land-type-chip.ns3[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.land-type-chip.sk1[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.land-type-chip.other[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.active[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.transfer-pending[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.disputed[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.leased[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.mortgaged[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.archived[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.review-badge[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.review-badge.normal[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.review-badge.due[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.review-badge.overdue[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.review-badge.none[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.row-map-action[b-0kazjr9qkf] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

.coordinate-form-panel[b-0kazjr9qkf] {
    overflow: hidden;

    margin-bottom: 16px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .09),
            transparent 18rem),
        #f5fafc;
}

.coordinate-action-card[b-0kazjr9qkf] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: center;

    border: 1px solid rgba(47, 120, 159, .10);
    border-radius: 12px;

    background: #fff;
}

.coordinate-action-card a[b-0kazjr9qkf],
.coordinate-action-card span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.coordinate-action-card a[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-action-card span[b-0kazjr9qkf] {
    color: #75867f;
    background: #edf2ef;
}

.map-preview[b-0kazjr9qkf],
.google-map-panel[b-0kazjr9qkf] {
    overflow: hidden;

    margin-top: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 15px;

    background: #fff;
}

.map-preview iframe[b-0kazjr9qkf] {
    display: block;
    width: 100%;
    height: 300px;

    border: 0;
}

.map-empty[b-0kazjr9qkf] {
    display: flex;
    min-height: 220px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    margin-top: 12px;
    border: 1px dashed rgba(47, 120, 159, .22);
    border-radius: 15px;

    color: #2f789f;
    background: rgba(255, 255, 255, .65);
}

.map-empty strong[b-0kazjr9qkf] {
    color: #40554c;
    font-size: .55rem;
}

.map-empty small[b-0kazjr9qkf] {
    color: #7e8d87;
    font-size: .42rem;
}

.area-summary-card[b-0kazjr9qkf] {
    display: flex;
    min-height: 58px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 0 13px;
    border: 1px solid rgba(77, 124, 69, .12);
    border-radius: 12px;

    background: #f2f8ef;
}

.area-summary-card span[b-0kazjr9qkf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #43763d;
    font-size: .44rem;
    font-weight: 700;
}

.area-summary-card strong[b-0kazjr9qkf] {
    color: #355047;
    font-size: .54rem;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;
}

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1220px, calc(100vw - 28px)) !important;
}

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.coordinate-ready-chip[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-summary-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(10, 114, 87, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.owner-summary-icon[b-0kazjr9qkf] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.owner-summary-panel small[b-0kazjr9qkf] {
    color: var(--theme-primary);
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-summary-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.owner-summary-panel p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
}

.owner-summary-panel em[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #987634;
    font-size: .43rem;
    font-style: normal;
}

.area-value-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.area-value-grid article[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);

    min-height: 82px;
    align-items: center;
    gap: 9px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 13px;

    background: #fff;
}

.area-value-grid article > span[b-0kazjr9qkf] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #4d7c45;
    background: #edf6e9;
}

.area-value-grid article:nth-child(2) > span[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.area-value-grid article:nth-child(3) > span[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.area-value-grid article:nth-child(4) > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

.area-value-grid div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.area-value-grid small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.area-value-grid strong[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #34483f;
    font-size: .62rem;
}

.area-value-grid em[b-0kazjr9qkf] {
    color: #72837c;
    font-size: .38rem;
    font-style: normal;
}

.land-location-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.land-location-panel > span[b-0kazjr9qkf] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.land-location-panel small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.land-location-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .66rem;
}

.land-location-panel p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.55;
}

.land-location-panel b[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.land-location-panel a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-0kazjr9qkf] {
    margin-top: 13px;
    padding: 0;
}

.map-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 12px 13px;
}

.map-heading small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.map-heading > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .40rem;
    font-weight: 700;
}

.google-map-panel iframe[b-0kazjr9qkf] {
    display: block;
    width: 100%;
    height: 360px;

    border: 0;
}

.map-not-available[b-0kazjr9qkf] {
    display: flex;
    min-height: 110px;

    align-items: center;
    justify-content: center;
    gap: 10px;

    margin-top: 13px;
    padding: 15px;

    border: 1px dashed rgba(181, 77, 67, .22);
    border-radius: 15px;

    color: #ad4037;
    background: #fff8f6;
}

.map-not-available div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.map-not-available strong[b-0kazjr9qkf] {
    color: #6e4944;
    font-size: .54rem;
}

.map-not-available small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #967c77;
    font-size: .42rem;
}

.boundary-panel[b-0kazjr9qkf] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(77, 124, 69, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(77, 124, 69, .09),
            transparent 18rem),
        #f8fbf7;
}

.boundary-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.boundary-grid > div[b-0kazjr9qkf],
.access-grid > div[b-0kazjr9qkf] {
    min-height: 76px;
    padding: 10px;

    border: 1px solid rgba(77, 124, 69, .08);
    border-radius: 11px;

    background: #fff;
}

.boundary-grid span[b-0kazjr9qkf],
.access-grid span[b-0kazjr9qkf] {
    color: #4d7c45;
    font-size: .41rem;
    font-weight: 700;
}

.boundary-grid strong[b-0kazjr9qkf],
.access-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 6px;

    color: #45564f;
    font-size: .49rem;
    line-height: 1.55;
}

.boundary-grid .north[b-0kazjr9qkf] {
    border-top: 3px solid #2f789f;
}

.boundary-grid .east[b-0kazjr9qkf] {
    border-top: 3px solid #987634;
}

.boundary-grid .south[b-0kazjr9qkf] {
    border-top: 3px solid #4d7c45;
}

.boundary-grid .west[b-0kazjr9qkf] {
    border-top: 3px solid #73569b;
}

.access-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 8px;
}

.land-info-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.land-info-grid > div[b-0kazjr9qkf] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.land-info-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .40rem;
}

.land-info-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
}

.remark-panel[b-0kazjr9qkf] {
    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(199, 163, 93, .12);
    border-radius: 12px;

    background: #fffbf2;
}

.remark-panel small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.remark-panel p[b-0kazjr9qkf] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.four-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-0kazjr9qkf] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.document > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

@media (max-width: 1380px) {
    .tax-photo-upload-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .area-value-grid[b-0kazjr9qkf],
    .boundary-grid[b-0kazjr9qkf],
    .land-info-grid[b-0kazjr9qkf],
    .four-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .google-map-panel iframe[b-0kazjr9qkf],
    .map-preview iframe[b-0kazjr9qkf] {
        height: 300px;
    }
}

@media (max-width: 780px) {
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .area-value-grid[b-0kazjr9qkf],
    .boundary-grid[b-0kazjr9qkf],
    .access-grid[b-0kazjr9qkf],
    .land-info-grid[b-0kazjr9qkf],
    .four-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .land-location-panel[b-0kazjr9qkf] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .land-location-panel a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .area-summary-card[b-0kazjr9qkf] {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
        min-height: 72px;
    }

    .map-heading[b-0kazjr9qkf] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-0kazjr9qkf],
    .map-preview iframe[b-0kazjr9qkf] {
        height: 260px;
    }
}


/* =========================================================
   LANDSMAPS INTERNAL LOOKUP INTEGRATION
   ========================================================= */

.hero-landsmaps-button[b-0kazjr9qkf] {
    min-height: 40px !important;

    border-color: rgba(242, 217, 153, .27) !important;
    border-radius: 11px !important;

    color: #f4dda6 !important;
    background: rgba(242, 217, 153, .08) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .45rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.hero-landsmaps-button:hover[b-0kazjr9qkf] {
    border-color: rgba(242, 217, 153, .46) !important;
    background: rgba(242, 217, 153, .15) !important;
}

.row-landsmaps-action[b-0kazjr9qkf] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(152, 118, 52, .15);
    border-radius: 9px;

    color: #987634;
    background: #fff7e8;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}

.row-landsmaps-action:hover[b-0kazjr9qkf] {
    transform: translateY(-1px);
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

.view-landsmaps-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .18);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.view-landsmaps-button:hover[b-0kazjr9qkf] {
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

@media (max-width: 650px) {
    .view-landsmaps-button[b-0kazjr9qkf] {
        width: 100%;
    }
}


/* =========================================================
   PROPERTY VALUATION PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --valuation-green: var(--theme-primary);
    --valuation-deep: var(--theme-dark);
    --valuation-gold: var(--theme-accent);
    --valuation-blue: #2f789f;
    --valuation-purple: #73569b;
    --valuation-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .28),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(72, 166, 113, .24),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.hero-map-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;

    color: #f4dda6;
    background: rgba(242, 217, 153, .08);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.total[b-0kazjr9qkf] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.appraised[b-0kazjr9qkf] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.market[b-0kazjr9qkf] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.tax[b-0kazjr9qkf] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.draft > span[b-0kazjr9qkf] {
    background: #718078;
}

.status-overview-card.review > span[b-0kazjr9qkf] {
    background: #73569b;
}

.status-overview-card.approved > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.status-overview-card.due > span[b-0kazjr9qkf] {
    background: #b27a25;
}

.status-overview-card.building > span[b-0kazjr9qkf] {
    background: #2f789f;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.valuation-insight-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(320px, .75fr);

    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-0kazjr9qkf] {
    padding: 15px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 18rem),
        #fff;

    box-shadow:
        0 14px 35px rgba(5, 62, 46, .065);
}

.insight-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;
    border-radius: 999px;

    color: var(--theme-primary);
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 700;
}

.factor-guide-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.factor-guide-grid > div[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);

    min-height: 74px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;

    background: #f9fbfa;
}

.factor-guide-grid > div > span[b-0kazjr9qkf] {
    display: grid;
    width: 40px;
    height: 40px;

    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 11px;

    color: var(--theme-primary);
    background: #e7f5ef;
}

.factor-guide-grid strong[b-0kazjr9qkf] {
    color: #3c5047;
    font-size: .49rem;
}

.factor-guide-grid small[b-0kazjr9qkf] {
    color: #83918c;
    font-size: .39rem;
    line-height: 1.45;
}

.formula-list[b-0kazjr9qkf] {
    display: grid;
    gap: 8px;

    margin-top: 13px;
}

.formula-list > div[b-0kazjr9qkf] {
    min-height: 59px;
    padding: 9px 11px;

    border: 1px solid rgba(152, 118, 52, .10);
    border-radius: 10px;

    background: #fffbf3;
}

.formula-list small[b-0kazjr9qkf] {
    display: block;

    color: #987634;
    font-size: .39rem;
}

.formula-list strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #4c5e56;
    font-size: .47rem;
    line-height: 1.55;
}

/* =========================================================
   FILTER SUMMARY
   ========================================================= */

.filter-summary[b-0kazjr9qkf] {
    display: flex;
    min-height: 56px;

    align-items: center;
    flex-wrap: wrap;
    gap: 7px;

    padding: 8px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 11px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 4px;

    padding: 0 8px;
    border-radius: 999px;

    color: #65766f;
    background: #fff;

    font-size: .40rem;
}

.filter-summary strong[b-0kazjr9qkf] {
    color: var(--theme-primary);
}

/* =========================================================
   TABLE
   ========================================================= */

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);

    min-width: 168px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 52px;
    height: 52px;

    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #83918c;
    font-size: .39rem;
}

.parcel-owner-cell[b-0kazjr9qkf],
.method-year-cell[b-0kazjr9qkf],
.component-value-cell[b-0kazjr9qkf],
.total-value-cell[b-0kazjr9qkf],
.market-tax-cell[b-0kazjr9qkf],
.status-review-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.parcel-owner-cell[b-0kazjr9qkf] {
    min-width: 190px;
}

.parcel-owner-cell strong[b-0kazjr9qkf],
.method-year-cell strong[b-0kazjr9qkf],
.component-value-cell strong[b-0kazjr9qkf],
.total-value-cell strong[b-0kazjr9qkf],
.market-tax-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .53rem;
    line-height: 1.48;
}

.parcel-owner-cell small[b-0kazjr9qkf],
.method-year-cell small[b-0kazjr9qkf],
.component-value-cell small[b-0kazjr9qkf],
.total-value-cell small[b-0kazjr9qkf],
.market-tax-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .42rem;
    line-height: 1.5;
}

.parcel-owner-cell em[b-0kazjr9qkf],
.component-value-cell em[b-0kazjr9qkf],
.total-value-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .38rem;
    font-style: normal;
    font-weight: 650;
}

.total-value-cell strong[b-0kazjr9qkf] {
    color: var(--theme-primary);
    font-size: .58rem;
}

.market-tax-cell strong[b-0kazjr9qkf] {
    color: #987634;
}

.method-chip[b-0kazjr9qkf],
.usage-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.method-chip.market-comparison[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.method-chip.official-reference[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.method-chip.cost[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.method-chip.income[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.method-chip.mass-appraisal[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.usage-chip.residential[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-0kazjr9qkf] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.draft[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.surveyed[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.calculated[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.status-chip.under-review[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.approved[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

/* =========================================================
   SOURCE PARCEL & FORM
   ========================================================= */

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-parcel-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 13px;
    overflow: hidden;

    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-parcel-photo[b-0kazjr9qkf] {
    display: grid;
    min-height: 210px;
    overflow: hidden;

    place-items: center;
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-parcel-photo button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-parcel-photo img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    min-height: 210px;

    object-fit: cover;
}

.source-parcel-content[b-0kazjr9qkf] {
    min-width: 0;
}

.source-title-row[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .45rem;
}

.source-data-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-0kazjr9qkf] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.source-data-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    gap: 5px;

    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-actions a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 33px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-0kazjr9qkf] {
    color: #987634;
    border-color: rgba(152, 118, 52, .14);
    background: #fff9ed;
}

.source-actions a:nth-child(3)[b-0kazjr9qkf] {
    color: #2f789f;
    border-color: rgba(47, 120, 159, .14);
    background: #f4fafc;
}

.source-map-preview[b-0kazjr9qkf] {
    overflow: hidden;

    margin: -4px 0 16px;
    border: 1px solid rgba(47, 120, 159, .11);
    border-radius: 14px;

    background: #edf2ef;
}

.source-map-preview iframe[b-0kazjr9qkf] {
    display: block;
    width: 100%;
    height: 280px;

    border: 0;
}

.calculation-preview-panel[b-0kazjr9qkf] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .12),
            transparent 18rem),
        #fffbf3;
}

.calculation-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.calculation-heading small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.calculation-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #405249;
    font-size: .69rem;
}

.calculation-heading > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #987634;
    background: #fff1d4;

    font-size: .40rem;
    font-weight: 700;
}

.calculation-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.calculation-grid > div[b-0kazjr9qkf] {
    min-height: 82px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .08);
    border-radius: 11px;

    background: #fff;
}

.calculation-grid > div.highlight[b-0kazjr9qkf] {
    color: #fff;
    border-color: transparent;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .16);
}

.calculation-grid span[b-0kazjr9qkf] {
    display: block;

    color: #8b7b5b;
    font-size: .39rem;
}

.calculation-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 7px;

    color: #3f5249;
    font-size: .66rem;
}

.calculation-grid small[b-0kazjr9qkf] {
    display: block;
    margin-top: 2px;

    color: #8a9791;
    font-size: .36rem;
}

.calculation-grid .highlight span[b-0kazjr9qkf],
.calculation-grid .highlight strong[b-0kazjr9qkf],
.calculation-grid .highlight small[b-0kazjr9qkf] {
    color: #fff;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

/* =========================================================
   VIEW
   ========================================================= */

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.view-landsmaps-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .16);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    text-decoration: none;
}

.valuation-identity-banner[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-0kazjr9qkf] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-0kazjr9qkf] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-0kazjr9qkf] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #355047;
    font-size: .53rem;
    line-height: 1.45;
    text-align: center;
}

.owner-location-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.owner-location-panel > span[b-0kazjr9qkf] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.owner-location-panel small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-location-panel h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .67rem;
}

.owner-location-panel p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.55;
}

.owner-location-panel b[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.owner-location-panel a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-0kazjr9qkf] {
    overflow: hidden;

    margin-top: 13px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 14px;

    background: #fff;
}

.map-heading[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 11px 13px;
}

.map-heading small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .69rem;
}

.map-heading > span[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-weight: 700;
}

.google-map-panel iframe[b-0kazjr9qkf] {
    display: block;
    width: 100%;
    height: 350px;

    border: 0;
}

.value-highlight-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.value-highlight-grid article[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);

    min-height: 88px;
    align-items: center;
    gap: 8px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 12px;

    background: #fff;
}

.value-highlight-grid article > span[b-0kazjr9qkf] {
    display: grid;
    width: 44px;
    height: 44px;

    place-items: center;
    border-radius: 12px;
}

.value-highlight-grid .land-value > span[b-0kazjr9qkf] {
    color: #4d7c45;
    background: #edf6e9;
}

.value-highlight-grid .building-value > span[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.value-highlight-grid .total-appraised > span[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.value-highlight-grid .market-value > span[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.value-highlight-grid .tax-value > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

.value-highlight-grid div[b-0kazjr9qkf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.value-highlight-grid small[b-0kazjr9qkf] {
    color: #87958f;
    font-size: .38rem;
}

.value-highlight-grid strong[b-0kazjr9qkf] {
    margin-top: 4px;

    overflow: hidden;
    color: #354940;
    font-size: .58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value-highlight-grid em[b-0kazjr9qkf] {
    color: #75867f;
    font-size: .36rem;
    font-style: normal;
}

.factor-detail-panel[b-0kazjr9qkf],
.building-detail-panel[b-0kazjr9qkf],
.comparable-panel[b-0kazjr9qkf],
.workflow-panel[b-0kazjr9qkf] {
    margin-top: 13px;
    padding: 14px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .06),
            transparent 18rem),
        #f9fbfa;
}

.factor-detail-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.factor-detail-grid > div[b-0kazjr9qkf],
.building-detail-grid > div[b-0kazjr9qkf],
.workflow-grid > div[b-0kazjr9qkf] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.factor-detail-grid span[b-0kazjr9qkf],
.building-detail-grid span[b-0kazjr9qkf],
.workflow-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.factor-detail-grid strong[b-0kazjr9qkf],
.building-detail-grid strong[b-0kazjr9qkf],
.workflow-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .48rem;
    line-height: 1.45;
}

.building-detail-grid[b-0kazjr9qkf],
.workflow-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.comparable-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.comparable-grid > div[b-0kazjr9qkf] {
    min-height: 90px;
    padding: 10px;
    border: 1px solid rgba(47, 120, 159, .08);
    border-radius: 10px;

    background: #fff;
}

.comparable-grid span[b-0kazjr9qkf] {
    display: block;

    color: #2f789f;
    font-size: .39rem;
    font-weight: 700;
}

.comparable-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 6px;

    color: #465951;
    font-size: .47rem;
    line-height: 1.58;
}

.comparable-empty[b-0kazjr9qkf] {
    grid-column: 1 / -1;

    display: grid;
    min-height: 90px;

    place-items: center;

    color: #84928d;
}

.rejection-note[b-0kazjr9qkf],
.internal-note[b-0kazjr9qkf] {
    margin-top: 9px;
    padding: 10px;
    border-radius: 10px;
}

.rejection-note[b-0kazjr9qkf] {
    border: 1px solid rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.internal-note[b-0kazjr9qkf] {
    border: 1px solid rgba(152, 118, 52, .12);
    background: #fffbf3;
}

.rejection-note strong[b-0kazjr9qkf] {
    color: #ad4037;
    font-size: .43rem;
}

.internal-note strong[b-0kazjr9qkf] {
    color: #987634;
    font-size: .43rem;
}

.rejection-note p[b-0kazjr9qkf],
.internal-note p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: #5f7169;
    font-size: .47rem;
    line-height: 1.65;
}

.five-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-0kazjr9qkf] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.survey > span[b-0kazjr9qkf] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.attachment-card.report > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .valuation-insight-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-data-grid[b-0kazjr9qkf],
    .calculation-grid[b-0kazjr9qkf],
    .factor-detail-grid[b-0kazjr9qkf],
    .building-detail-grid[b-0kazjr9qkf],
    .workflow-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .value-highlight-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .five-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }

    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .factor-guide-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .source-parcel-panel[b-0kazjr9qkf] {
        grid-template-columns:
            190px minmax(0, 1fr);
    }

    .comparable-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }
}

@media (max-width: 780px) {
    .factor-guide-grid[b-0kazjr9qkf],
    .source-data-grid[b-0kazjr9qkf],
    .calculation-grid[b-0kazjr9qkf],
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .factor-detail-grid[b-0kazjr9qkf],
    .building-detail-grid[b-0kazjr9qkf],
    .workflow-grid[b-0kazjr9qkf],
    .value-highlight-grid[b-0kazjr9qkf],
    .five-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .source-parcel-panel[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-parcel-photo[b-0kazjr9qkf] {
        max-height: 300px;
    }

    .owner-location-panel[b-0kazjr9qkf] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .owner-location-panel a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .source-title-row[b-0kazjr9qkf],
    .calculation-heading[b-0kazjr9qkf],
    .map-heading[b-0kazjr9qkf] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-0kazjr9qkf],
    .source-map-preview iframe[b-0kazjr9qkf] {
        height: 280px;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-0kazjr9qkf] {
        min-height: 72px;
    }

    .factor-guide-grid > div[b-0kazjr9qkf] {
        grid-template-columns:
            38px minmax(0, 1fr);
    }

    .source-actions[b-0kazjr9qkf] {
        flex-direction: column;
    }

    .source-actions a[b-0kazjr9qkf],
    .view-landsmaps-button[b-0kazjr9qkf] {
        width: 100%;
    }

    .google-map-panel iframe[b-0kazjr9qkf],
    .source-map-preview iframe[b-0kazjr9qkf] {
        height: 250px;
    }
}


/* =========================================================
   PROPERTY TAX ASSESSMENT NOTICE PREMIUM EXTENSIONS
   ========================================================= */

.tax-page[b-0kazjr9qkf] {
    --tax-green: var(--theme-primary);
    --tax-deep: var(--theme-dark);
    --tax-gold: var(--theme-accent);
    --tax-blue: #2f789f;
    --tax-purple: #73569b;
    --tax-red: #b54d43;
}

.tax-hero[b-0kazjr9qkf] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .29),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(72, 166, 113, .24),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.hero-valuation-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;

    color: #f4dda6;
    background: rgba(242, 217, 153, .08);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.notices[b-0kazjr9qkf] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.tax[b-0kazjr9qkf] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.paid[b-0kazjr9qkf] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.balance[b-0kazjr9qkf] {
    --summary-accent: #b54d43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(181, 77, 67, .20);
}

.tax-page[b-0kazjr9qkf]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.draft > span[b-0kazjr9qkf] {
    background: #718078;
}

.status-overview-card.issued > span[b-0kazjr9qkf] {
    background: #b27a25;
}

.status-overview-card.acknowledged > span[b-0kazjr9qkf] {
    background: #73569b;
}

.status-overview-card.partial > span[b-0kazjr9qkf] {
    background: #2f789f;
}

.status-overview-card.paid > span[b-0kazjr9qkf] {
    background: #397a4c;
}

.status-overview-card.overdue > span[b-0kazjr9qkf] {
    background: #b54d43;
}

.status-overview-card.objection > span[b-0kazjr9qkf] {
    background: #7b5a36;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.tax-insight-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(320px, .8fr);

    gap: 14px;
    margin-top: 14px;
}

.calculation-guide-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.calculation-guide-grid > div[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    min-height: 78px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;

    background: #f9fbfa;
}

.calculation-guide-grid > div > span[b-0kazjr9qkf] {
    display: grid;
    width: 38px;
    height: 38px;

    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    font-size: .52rem;
    font-weight: 800;
}

.calculation-guide-grid strong[b-0kazjr9qkf] {
    color: #3c5047;
    font-size: .48rem;
}

.calculation-guide-grid small[b-0kazjr9qkf] {
    color: #83918c;
    font-size: .38rem;
    line-height: 1.45;
}

.mock-rate-warning[b-0kazjr9qkf] {
    margin-top: 11px !important;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem !important;
    line-height: 1.65;
}

.collection-progress[b-0kazjr9qkf] {
    margin-top: 13px;
}

.progress-track[b-0kazjr9qkf] {
    height: 15px;
    overflow: hidden;

    border-radius: 999px;
    background: #edf2ef;

    box-shadow:
        inset 0 1px 3px rgba(5, 62, 46, .12);
}

.progress-track > span[b-0kazjr9qkf] {
    display: block;
    height: 100%;

    border-radius: inherit;
    background:
        linear-gradient(
            90deg,
            #178466,
            #38b886);

    transition: width .25s ease;
}

.collection-metrics[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.collection-metrics > div[b-0kazjr9qkf] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #f9fbfa;
}

.collection-metrics small[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .39rem;
}

.collection-metrics strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 6px;

    color: #354940;
    font-size: .55rem;
}

/* =========================================================
   TABLE
   ========================================================= */

.tax-code-photo-cell[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);

    min-width: 174px;
    align-items: center;
    gap: 8px;
}

.tax-photo-mini[b-0kazjr9qkf] {
    display: grid;
    width: 52px;
    height: 52px;

    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.tax-photo-mini button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.tax-photo-mini img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tax-code-photo-cell strong[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.tax-code-photo-cell small[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .39rem;
}

.taxpayer-cell[b-0kazjr9qkf],
.year-due-cell[b-0kazjr9qkf],
.property-value-cell[b-0kazjr9qkf],
.tax-amount-cell[b-0kazjr9qkf],
.payment-cell[b-0kazjr9qkf],
.status-objection-cell[b-0kazjr9qkf] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.taxpayer-cell[b-0kazjr9qkf] {
    min-width: 190px;
}

.taxpayer-cell strong[b-0kazjr9qkf],
.year-due-cell strong[b-0kazjr9qkf],
.property-value-cell strong[b-0kazjr9qkf],
.tax-amount-cell strong[b-0kazjr9qkf],
.payment-cell strong[b-0kazjr9qkf] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .52rem;
    line-height: 1.48;
}

.taxpayer-cell small[b-0kazjr9qkf],
.year-due-cell small[b-0kazjr9qkf],
.property-value-cell small[b-0kazjr9qkf],
.tax-amount-cell small[b-0kazjr9qkf],
.payment-cell small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #84928d;
    font-size: .41rem;
    line-height: 1.5;
}

.taxpayer-cell em[b-0kazjr9qkf],
.property-value-cell em[b-0kazjr9qkf],
.tax-amount-cell em[b-0kazjr9qkf],
.payment-cell em[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.tax-amount-cell strong[b-0kazjr9qkf] {
    color: #987634;
    font-size: .57rem;
}

.payment-cell strong[b-0kazjr9qkf] {
    color: var(--theme-primary);
}

.payment-cell small[b-0kazjr9qkf] {
    color: #b54d43;
}

.status-objection-cell[b-0kazjr9qkf] {
    align-items: flex-start;
    gap: 5px;
}

.status-chip.issued[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.acknowledged[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.partial[b-0kazjr9qkf] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.paid[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.overdue[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.objection-chip[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .37rem;
    font-weight: 700;
}

.objection-chip.submitted[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.objection-chip.under-review[b-0kazjr9qkf] {
    color: #6c4e96;
    background: #f0eafb;
}

.objection-chip.accepted[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.objection-chip.rejected[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.objection-chip.withdrawn[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.due-badge[b-0kazjr9qkf] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .37rem;
    font-style: normal;
    font-weight: 700;
}

.due-badge.normal[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.due-badge.urgent[b-0kazjr9qkf] {
    color: #9d671c;
    background: #fff0d8;
}

.due-badge.overdue[b-0kazjr9qkf] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.paid[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.due-badge.none[b-0kazjr9qkf] {
    color: #687872;
    background: #edf1ef;
}

.row-action.print[b-0kazjr9qkf] {
    color: #73569b !important;
    background: #f0eafb !important;
}

.row-map-action[b-0kazjr9qkf] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

/* =========================================================
   SOURCE & CALCULATION FORM
   ========================================================= */

.tax-form-modal[b-0kazjr9qkf] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-valuation-panel[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 13px;
    overflow: hidden;

    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-0kazjr9qkf] {
    display: grid;
    min-height: 210px;
    overflow: hidden;

    place-items: center;
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-photo button[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-photo img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    min-height: 210px;

    object-fit: cover;
}

.source-content[b-0kazjr9qkf] {
    min-width: 0;
}

.source-title-row[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .45rem;
}

.approved-source-chip[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    color: #34734b;
    background: #e7f5ec;

    font-size: .40rem;
    font-weight: 700;
    white-space: nowrap;
}

.source-data-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-0kazjr9qkf] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.source-data-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-0kazjr9qkf] {
    display: flex;
    align-items: flex-start;
    gap: 5px;

    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-0kazjr9qkf] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-actions a[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 33px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-0kazjr9qkf] {
    color: #2f789f;
    border-color: rgba(47, 120, 159, .14);
    background: #f4fafc;
}

.source-actions a:nth-child(3)[b-0kazjr9qkf] {
    color: #987634;
    border-color: rgba(152, 118, 52, .14);
    background: #fff9ed;
}

.source-actions a:nth-child(4)[b-0kazjr9qkf] {
    color: #73569b;
    border-color: rgba(115, 86, 155, .14);
    background: #f8f3ff;
}

.tax-calculation-preview[b-0kazjr9qkf] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .12),
            transparent 18rem),
        #fffbf3;
}

.tax-photo-upload-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

/* =========================================================
   VIEW MODAL & PRINTABLE NOTICE
   ========================================================= */

.tax-view-modal[b-0kazjr9qkf] {
    width: min(1180px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 24px);
    overflow: hidden;
}

.view-modal-toolbar[b-0kazjr9qkf] {
    display: flex;
    min-height: 66px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 10px 13px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-modal-toolbar > div:last-child[b-0kazjr9qkf] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.view-modal-toolbar small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-modal-toolbar h2[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.view-map-button[b-0kazjr9qkf],
.view-landsmaps-button[b-0kazjr9qkf] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.view-map-button[b-0kazjr9qkf] {
    color: #2f789f;
    border: 1px solid rgba(47, 120, 159, .14);
    background: #edf6fb;
}

.view-landsmaps-button[b-0kazjr9qkf] {
    color: #987634;
    border: 1px solid rgba(152, 118, 52, .15);
    background: #fff7e8;
}

.view-print-button[b-0kazjr9qkf] {
    color: #fff !important;
    border-radius: 9px !important;
    background:
        linear-gradient(
            145deg,
            #73569b,
            #523976) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .41rem !important;
    text-transform: none !important;
}

.view-scroll[b-0kazjr9qkf] {
    max-height: calc(100vh - 94px);
    overflow: auto;
    padding: 16px;

    background: #e9efec;
}

.print-notice[b-0kazjr9qkf] {
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 34px 38px;

    border: 1px solid rgba(10, 72, 56, .12);
    border-radius: 4px;

    color: #263c33;
    background: #fff;

    font-family: 'Kanit', sans-serif;

    box-shadow:
        0 22px 55px rgba(5, 62, 46, .14);
}

.notice-header[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) 180px;

    align-items: center;
    gap: 14px;

    padding-bottom: 18px;
    border-bottom: 3px double var(--theme-primary);
}

.municipal-seal[b-0kazjr9qkf] {
    display: grid;
    width: 78px;
    height: 78px;

    place-items: center;
    border: 3px solid var(--theme-primary);
    border-radius: 50%;

    color: var(--theme-primary);
    background: #f3faf7;
}

.municipal-seal .mud-icon-root[b-0kazjr9qkf] {
    font-size: 2rem;
}

.notice-organization[b-0kazjr9qkf] {
    text-align: center;
}

.notice-organization small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .11em;
}

.notice-organization h1[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: #173e35;
    font-size: 1.25rem;
    line-height: 1.25;
}

.notice-organization p[b-0kazjr9qkf] {
    margin: 5px 0 0;

    color: #64766e;
    font-size: .50rem;
}

.notice-number[b-0kazjr9qkf] {
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .15);
    border-radius: 10px;

    background: #f5faf8;
    text-align: center;
}

.notice-number span[b-0kazjr9qkf],
.notice-number small[b-0kazjr9qkf] {
    display: block;

    color: #778980;
    font-size: .40rem;
}

.notice-number strong[b-0kazjr9qkf] {
    display: block;
    margin: 5px 0;

    color: var(--theme-primary);
    font-size: .58rem;
}

.notice-status-strip[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        minmax(130px, .7fr)
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    align-items: center;

    margin-top: 14px;
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.notice-status-strip > div[b-0kazjr9qkf] {
    padding-left: 9px;
    border-left: 1px solid rgba(10, 114, 87, .10);
}

.notice-status-strip > div span[b-0kazjr9qkf] {
    display: block;

    color: #83918b;
    font-size: .38rem;
}

.notice-status-strip > div strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #354940;
    font-size: .46rem;
}

.notice-recipient[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 150px;

    gap: 10px;
    align-items: center;

    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 11px;

    background: #f5fafc;
}

.recipient-icon[b-0kazjr9qkf] {
    display: grid;
    width: 58px;
    height: 58px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.notice-recipient small[b-0kazjr9qkf] {
    color: #2f789f;
    font-size: .40rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.notice-recipient h2[b-0kazjr9qkf] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.notice-recipient p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #6f8078;
    font-size: .43rem;
}

.recipient-status[b-0kazjr9qkf] {
    padding: 9px;
    border-radius: 9px;

    background: #fff;
    text-align: center;
}

.recipient-status span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.recipient-status strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 4px;

    color: #73569b;
    font-size: .45rem;
}

.notice-property[b-0kazjr9qkf],
.notice-calculation[b-0kazjr9qkf],
.notice-payment[b-0kazjr9qkf],
.notice-officers[b-0kazjr9qkf] {
    margin-top: 16px;
}

.section-title[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);

    align-items: center;
    gap: 8px;

    margin-bottom: 10px;
}

.section-title > span[b-0kazjr9qkf] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    font-size: .48rem;
    font-weight: 800;
}

.section-title small[b-0kazjr9qkf] {
    color: #987634;
    font-size: .39rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.section-title h3[b-0kazjr9qkf] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .61rem;
}

.property-photo-data[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);

    gap: 10px;
}

.notice-photo[b-0kazjr9qkf] {
    display: grid;
    min-height: 178px;
    overflow: hidden;

    place-items: center;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    color: var(--theme-primary);
    background: #edf5f1;
}

.notice-photo img[b-0kazjr9qkf] {
    width: 100%;
    height: 100%;
    min-height: 178px;

    object-fit: cover;
}

.property-data-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
}

.property-data-grid > div[b-0kazjr9qkf] {
    min-height: 80px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;

    background: #f9fbfa;
}

.property-data-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.property-data-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .45rem;
    line-height: 1.48;
}

.notice-address[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;

    gap: 7px;
    align-items: center;

    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;
}

.notice-address div[b-0kazjr9qkf] {
    display: flex;
    flex-direction: column;
}

.notice-address span[b-0kazjr9qkf] {
    font-size: .37rem;
}

.notice-address strong[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #455950;
    font-size: .44rem;
}

.notice-address small[b-0kazjr9qkf] {
    margin-top: 3px;

    color: #2f789f;
    font-size: .36rem;
}

.notice-address a[b-0kazjr9qkf] {
    padding: 6px 8px;
    border-radius: 7px;

    color: #2f789f;
    background: #fff;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.tax-calculation-table[b-0kazjr9qkf] {
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 10px;
}

.tax-calculation-table > div[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;

    min-height: 42px;
    align-items: center;

    border-bottom: 1px solid rgba(10, 114, 87, .07);
}

.tax-calculation-table > div:last-child[b-0kazjr9qkf] {
    border-bottom: 0;
}

.tax-calculation-table span[b-0kazjr9qkf],
.tax-calculation-table strong[b-0kazjr9qkf] {
    padding: 8px 10px;

    font-size: .43rem;
}

.tax-calculation-table strong[b-0kazjr9qkf] {
    border-left: 1px solid rgba(10, 114, 87, .07);

    color: #354940;
    text-align: right;
}

.tax-calculation-table .table-header[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #17725a,
            #0a5543);
}

.tax-calculation-table .table-header span[b-0kazjr9qkf] {
    font-weight: 700;
}

.tax-calculation-table .subtotal[b-0kazjr9qkf] {
    background: #f4faf7;
}

.tax-calculation-table .grand-total[b-0kazjr9qkf] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #987634,
            #765520);
}

.tax-calculation-table .grand-total strong[b-0kazjr9qkf] {
    color: #fff;
    border-left-color: rgba(255, 255, 255, .15);

    font-size: .55rem;
}

.amount-in-words[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    gap: 9px;
    align-items: center;

    margin-top: 8px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .12);
    border-radius: 9px;

    background: #fffbf3;
}

.amount-in-words span[b-0kazjr9qkf] {
    color: #987634;
    font-size: .41rem;
    font-weight: 700;
}

.amount-in-words strong[b-0kazjr9qkf] {
    color: #6e5225;
    font-size: .58rem;
    text-align: center;
}

.amount-in-words small[b-0kazjr9qkf] {
    color: #9b8b6a;
    font-size: .35rem;
}

.payment-summary-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
}

.payment-summary-grid article[b-0kazjr9qkf] {
    min-height: 87px;
    padding: 11px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    background: #f9fbfa;
}

.payment-summary-grid article.paid[b-0kazjr9qkf] {
    border-color: rgba(47, 120, 159, .12);
    background: #f4fafc;
}

.payment-summary-grid article.balance[b-0kazjr9qkf] {
    border-color: rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.payment-summary-grid span[b-0kazjr9qkf] {
    display: block;

    color: #84928c;
    font-size: .39rem;
}

.payment-summary-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 7px;

    color: #354940;
    font-size: .68rem;
}

.payment-summary-grid article.paid strong[b-0kazjr9qkf] {
    color: #2f789f;
}

.payment-summary-grid article.balance strong[b-0kazjr9qkf] {
    color: #b54d43;
}

.payment-summary-grid small[b-0kazjr9qkf] {
    display: block;

    color: #798a83;
    font-size: .36rem;
}

.payment-info-grid[b-0kazjr9qkf],
.officer-grid[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 8px;
}

.payment-info-grid > div[b-0kazjr9qkf],
.officer-grid > div[b-0kazjr9qkf] {
    min-height: 67px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;

    background: #f9fbfa;
}

.payment-info-grid span[b-0kazjr9qkf],
.officer-grid span[b-0kazjr9qkf] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.payment-info-grid strong[b-0kazjr9qkf],
.officer-grid strong[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .44rem;
}

.officer-grid[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.officer-grid > div[b-0kazjr9qkf] {
    min-height: 110px;
    padding-top: 18px;

    text-align: center;
}

.officer-grid > div[b-0kazjr9qkf]::before {
    display: block;
    width: 80%;
    height: 1px;

    margin: 0 auto 11px;

    background: rgba(48, 71, 61, .28);
    content: "";
}

.officer-grid em[b-0kazjr9qkf] {
    display: block;
    margin-top: 5px;

    color: #87958f;
    font-size: .35rem;
    font-style: normal;
}

.notice-warning[b-0kazjr9qkf] {
    margin-top: 11px;
    padding: 10px;

    border-radius: 9px;
}

.notice-warning.cancelled[b-0kazjr9qkf] {
    border: 1px solid rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.notice-warning.remark[b-0kazjr9qkf] {
    border: 1px solid rgba(152, 118, 52, .12);
    background: #fffbf3;
}

.notice-warning strong[b-0kazjr9qkf] {
    color: #704f2c;
    font-size: .42rem;
}

.notice-warning p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #5e7068;
    font-size: .42rem;
    line-height: 1.6;
}

.notice-footer[b-0kazjr9qkf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px;

    gap: 12px;
    align-items: center;

    margin-top: 16px;
    padding-top: 14px;
    border-top: 3px double var(--theme-primary);
}

.notice-footer strong[b-0kazjr9qkf] {
    color: var(--theme-primary);
    font-size: .43rem;
}

.notice-footer p[b-0kazjr9qkf] {
    margin: 4px 0 0;

    color: #62756c;
    font-size: .39rem;
    line-height: 1.6;
}

.notice-qr-placeholder[b-0kazjr9qkf] {
    display: grid;
    min-height: 90px;

    place-items: center;
    border: 1px dashed rgba(10, 114, 87, .24);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f5faf8;
}

.notice-qr-placeholder span[b-0kazjr9qkf] {
    font-size: .33rem;
    font-weight: 700;
}

.mock-notice[b-0kazjr9qkf] {
    margin-top: 12px;
    padding: 6px;

    border-radius: 7px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .35rem;
    font-weight: 700;
    text-align: center;
}

.google-map-panel[b-0kazjr9qkf] {
    overflow: hidden;

    width: min(900px, 100%);
    margin: 14px auto 0;

    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 14px;

    background: #fff;
}

.google-map-panel iframe[b-0kazjr9qkf] {
    display: block;
    width: 100%;
    height: 350px;

    border: 0;
}

.tax-view-modal .history-panel[b-0kazjr9qkf],
.tax-view-modal .attachment-panel[b-0kazjr9qkf] {
    width: min(900px, 100%);
    margin-right: auto;
    margin-left: auto;
}

.seven-columns[b-0kazjr9qkf] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.notice > span[b-0kazjr9qkf] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.payment > span[b-0kazjr9qkf] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.valuation > span[b-0kazjr9qkf] {
    color: #73569b;
    background: #f0eafb;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .tax-insight-grid[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .calculation-guide-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .source-data-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .seven-columns[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .source-valuation-panel[b-0kazjr9qkf] {
        grid-template-columns: 190px minmax(0, 1fr);
    }

    .notice-header[b-0kazjr9qkf] {
        grid-template-columns: 70px minmax(0, 1fr);
    }

    .notice-number[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .notice-status-strip[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .property-photo-data[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
    }

    .property-data-grid[b-0kazjr9qkf] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 780px) {
    .calculation-guide-grid[b-0kazjr9qkf],
    .collection-metrics[b-0kazjr9qkf],
    .source-data-grid[b-0kazjr9qkf],
    .tax-photo-upload-grid[b-0kazjr9qkf],
    .payment-summary-grid[b-0kazjr9qkf],
    .payment-info-grid[b-0kazjr9qkf],
    .officer-grid[b-0kazjr9qkf],
    .seven-columns[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .source-valuation-panel[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-title-row[b-0kazjr9qkf],
    .calculation-heading[b-0kazjr9qkf],
    .view-modal-toolbar[b-0kazjr9qkf] {
        align-items: flex-start;
        flex-direction: column;
    }

    .view-modal-toolbar > div:last-child[b-0kazjr9qkf] {
        width: 100%;
    }

    .print-notice[b-0kazjr9qkf] {
        padding: 22px 18px;
    }

    .notice-recipient[b-0kazjr9qkf] {
        grid-template-columns: 52px minmax(0, 1fr);
    }

    .recipient-status[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .tax-calculation-table > div[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr) 150px;
    }

    .notice-address[b-0kazjr9qkf] {
        grid-template-columns: 28px minmax(0, 1fr);
    }

    .notice-address a[b-0kazjr9qkf] {
        grid-column: 1 / -1;
    }

    .notice-footer[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
    }

    .notice-qr-placeholder[b-0kazjr9qkf] {
        width: 120px;
    }
}

@media (max-width: 560px) {
    .calculation-guide-grid[b-0kazjr9qkf],
    .property-data-grid[b-0kazjr9qkf],
    .notice-status-strip[b-0kazjr9qkf] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-actions[b-0kazjr9qkf] {
        flex-direction: column;
    }

    .source-actions a[b-0kazjr9qkf],
    .view-map-button[b-0kazjr9qkf],
    .view-landsmaps-button[b-0kazjr9qkf] {
        width: 100%;
    }

    .notice-header[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .municipal-seal[b-0kazjr9qkf] {
        margin: 0 auto;
    }

    .tax-calculation-table > div[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
    }

    .tax-calculation-table strong[b-0kazjr9qkf] {
        border-top: 1px solid rgba(10, 114, 87, .07);
        border-left: 0;
    }

    .amount-in-words[b-0kazjr9qkf] {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .google-map-panel iframe[b-0kazjr9qkf],
    .source-map-preview iframe[b-0kazjr9qkf] {
        height: 250px;
    }
}

/* =========================================================
   PRINT
   ========================================================= */

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm;
    }

    body *[b-0kazjr9qkf] {
        visibility: hidden !important;
    }

    #tax-assessment-print-area[b-0kazjr9qkf],
    #tax-assessment-print-area *[b-0kazjr9qkf] {
        visibility: visible !important;
    }

    #tax-assessment-print-area[b-0kazjr9qkf] {
        position: absolute;
        inset: 0 auto auto 0;

        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;

        border: 0;
        border-radius: 0;

        box-shadow: none;
    }

    .no-print[b-0kazjr9qkf] {
        display: none !important;
    }

    .modal-backdrop[b-0kazjr9qkf],
    .tax-view-modal[b-0kazjr9qkf],
    .view-scroll[b-0kazjr9qkf] {
        position: static !important;

        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;

        padding: 0 !important;
        border: 0 !important;
        background: #fff !important;

        box-shadow: none !important;
    }

    .notice-header[b-0kazjr9qkf],
    .notice-status-strip[b-0kazjr9qkf],
    .notice-recipient[b-0kazjr9qkf],
    .notice-property[b-0kazjr9qkf],
    .notice-calculation[b-0kazjr9qkf],
    .notice-payment[b-0kazjr9qkf],
    .notice-officers[b-0kazjr9qkf],
    .notice-footer[b-0kazjr9qkf] {
        break-inside: avoid;
    }

    .mock-notice[b-0kazjr9qkf] {
        border: 1px solid #999;
        color: #555;
        background: #fff;
    }
}
/* /Components/Pages/02Specialized/01Construction/02Landscape/TaxPayments.razor.rz.scp.css */
.payment-page[b-tsn2pem1kj] {
    --green-950: color-mix(in srgb, var(--theme-dark) 86%, black);
    --green-900: var(--theme-dark);
    --green-800: color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark));
    --green-700: var(--theme-primary);
    --gold: var(--theme-accent);
    --ink: var(--theme-ink);
    --muted: var(--theme-muted);
    --border: rgba(7, 88, 67, .11);
    --shadow: 0 15px 42px rgba(5, 62, 46, .075);

    min-height: 100%;
    padding: 24px 24px 44px;

    color: var(--ink);
    background:
        radial-gradient(circle at 1% 0%, rgba(201, 166, 93, .12), transparent 28rem),
        radial-gradient(circle at 100% 4%, rgba(10, 106, 80, .09), transparent 32rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);

    font-family: 'Kanit', sans-serif;
}

.payment-page[b-tsn2pem1kj]  .payment-container {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 0 !important;
}

.payment-hero[b-tsn2pem1kj] {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr);

    min-height: 292px;
    align-items: center;
    gap: 28px;

    padding: 36px 38px;
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .22);
    border-radius: 29px;

    color: #fff;
    background:
        radial-gradient(circle at 84% 0%, rgba(201, 166, 93, .21), transparent 27%),
        radial-gradient(circle at 9% 115%, rgba(28, 138, 101, .22), transparent 34%),
        linear-gradient(138deg, var(--theme-dark) 0%, color-mix(in srgb, var(--theme-dark) 86%, black) 58%, color-mix(in srgb, var(--theme-dark) 72%, black) 100%);

    box-shadow: 0 28px 72px rgba(4, 54, 41, .24);
}

.hero-pattern[b-tsn2pem1kj] {
    position: absolute;
    inset: 0;
    opacity: .15;

    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);

    background-size: 35px 35px;
    mask-image: linear-gradient(90deg, #000, transparent 88%);
}

.hero-gold-line[b-tsn2pem1kj] {
    position: absolute;
    top: 0;
    left: 7%;
    right: 7%;
    height: 3px;

    background: linear-gradient(90deg, transparent, rgba(231, 207, 152, .88), transparent);
    box-shadow: 0 0 24px rgba(231, 207, 152, .42);
}

.hero-content[b-tsn2pem1kj] {
    position: relative;
    z-index: 2;
}

.hero-badge[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
    padding: 8px 13px 8px 8px;

    border: 1px solid rgba(231, 207, 152, .24);
    border-radius: 999px;

    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-tsn2pem1kj] {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;

    border-radius: 11px;
    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: rgba(201, 166, 93, .14);
}

.hero-badge > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-tsn2pem1kj] {
    color: rgba(255, 255, 255, .52);
    font-size: .53rem;
    letter-spacing: .11em;
}

.hero-badge strong[b-tsn2pem1kj] {
    color: color-mix(in srgb, var(--theme-accent) 62%, white);
    font-size: .68rem;
    font-weight: 650;
}

.hero-content h1[b-tsn2pem1kj] {
    margin: 0;

    color: #fff;
    font-size: clamp(2.2rem, 3.8vw, 4.2rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.035em;
}

.hero-content p[b-tsn2pem1kj] {
    max-width: 940px;
    margin: 17px 0 0;

    color: rgba(255, 255, 255, .66);
    font-size: clamp(.83rem, 1.08vw, 1rem);
    font-weight: 300;
    line-height: 1.75;
}

.hero-meta[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 23px;
}

.hero-meta > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;

    padding: 0 11px;

    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .63);
    background: rgba(255, 255, 255, .045);

    font-size: .63rem;
}

.hero-action-panel[b-tsn2pem1kj] {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    gap: 11px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 22px;

    color: var(--ink);
    background: linear-gradient(145deg, rgba(255, 255, 255, .985), rgba(242, 247, 244, .955));

    box-shadow: 0 24px 52px rgba(0, 0, 0, .18);
}

.hero-status[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 3px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
}

.status-dot[b-tsn2pem1kj] {
    width: 10px;
    height: 10px;

    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 6px rgba(50, 205, 135, .12);
}

.hero-status > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-tsn2pem1kj] {
    color: #195d48;
    font-size: .72rem;
}

.hero-status small[b-tsn2pem1kj] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .56rem;
}

.payment-page[b-tsn2pem1kj]  .hero-add-button,
.payment-page[b-tsn2pem1kj]  .search-button,
.payment-page[b-tsn2pem1kj]  .toolbar-add-button,
.payment-page[b-tsn2pem1kj]  .save-button {
    border-radius: 13px !important;
    color: color-mix(in srgb, var(--theme-accent) 64%, white) !important;
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark)) !important;
    box-shadow: 0 10px 23px rgba(4, 61, 47, .20);
}

.payment-page[b-tsn2pem1kj]  .hero-add-button {
    min-height: 45px;
}

.hero-refresh-button[b-tsn2pem1kj] {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid rgba(7, 88, 67, .12);
    border-radius: 13px;

    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .64rem;
    cursor: pointer;
}

.hero-refresh-button:disabled[b-tsn2pem1kj] {
    opacity: .55;
    cursor: not-allowed;
}

.payment-page[b-tsn2pem1kj]  .page-loading {
    margin: -4px 27px 0;
    border-radius: 0 0 10px 10px;
}

.payment-page[b-tsn2pem1kj]  .page-error {
    margin-top: 18px;
    border-radius: 15px !important;
}

.summary-grid[b-tsn2pem1kj] {
    margin-top: 7px;
}

.summary-card[b-tsn2pem1kj] {
    position: relative;

    display: flex;
    min-height: 150px;
    align-items: center;
    gap: 15px;

    padding: 20px;
    overflow: hidden;

    border: 1px solid var(--border);
    border-radius: 21px;

    color: var(--theme-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));

    box-shadow: var(--shadow);
    transition: transform .20s ease, box-shadow .20s ease;
}

.summary-card:hover[b-tsn2pem1kj] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(5, 62, 46, .11);
}

.summary-card.pending[b-tsn2pem1kj] {
    color: #2c7da8;
}

.summary-card.approved[b-tsn2pem1kj] {
    color: #7658a7;
}

.summary-card.incomplete[b-tsn2pem1kj] {
    color: #c05b4e;
}

.summary-line[b-tsn2pem1kj] {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;
    opacity: .54;

    background: linear-gradient(90deg, transparent, currentColor, transparent);
}

.summary-icon[b-tsn2pem1kj] {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border-radius: 17px;

    color: #fff;
    background: currentColor;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .13);
}

.summary-card > div[b-tsn2pem1kj] {
    min-width: 0;
}

.summary-card small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .69rem;
    font-weight: 560;
}

.summary-card p[b-tsn2pem1kj] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 4px 0 0;
}

.summary-card p strong[b-tsn2pem1kj] {
    color: var(--ink);
    font-size: 1.82rem;
    font-weight: 800;
    letter-spacing: -.03em;
}

.summary-card p span[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .61rem;
}

.summary-card em[b-tsn2pem1kj] {
    display: block;
    margin-top: 6px;

    color: var(--theme-muted);
    font-size: .54rem;
    font-style: normal;
}

.filter-panel[b-tsn2pem1kj],
.payment-list-panel[b-tsn2pem1kj] {
    margin-top: 24px;
    padding: 22px;

    border: 1px solid var(--border);
    border-radius: 23px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(247, 250, 248, .97));
    box-shadow: var(--shadow);
}

.filter-heading[b-tsn2pem1kj],
.list-toolbar[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 17px;
}

.filter-heading > div > span[b-tsn2pem1kj],
.panel-kicker[b-tsn2pem1kj] {
    color: #9c7b38;
    font-size: .52rem;
    font-weight: 750;
    letter-spacing: .11em;
}

.filter-heading h2[b-tsn2pem1kj],
.list-toolbar h2[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 720;
}

.filter-heading p[b-tsn2pem1kj],
.list-toolbar p[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--muted);
    font-size: .63rem;
}

.clear-filter-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 6px;

    padding: 0 10px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 11px;

    color: var(--theme-muted);
    background: #f6f9f7;

    font-family: 'Kanit', sans-serif;
    font-size: .61rem;
    cursor: pointer;
}

.filter-grid[b-tsn2pem1kj] {
    align-items: center;
}

.payment-page[b-tsn2pem1kj]  .premium-field,
.payment-page[b-tsn2pem1kj]  .form-field {
    width: 100%;
}

.payment-page[b-tsn2pem1kj]  .premium-field .mud-input-outlined-border,
.payment-page[b-tsn2pem1kj]  .form-field .mud-input-outlined-border {
    border-color: rgba(7, 88, 67, .13);
}

.payment-page[b-tsn2pem1kj]  .search-button {
    min-height: 56px;
}

.toolbar-actions[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.payment-page[b-tsn2pem1kj]  .sort-select {
    width: 160px;
}

.payment-page[b-tsn2pem1kj]  .toolbar-add-button {
    min-height: 42px;
}

.payment-page[b-tsn2pem1kj]  .payment-table {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .08);
    border-radius: 16px;
}

.payment-page[b-tsn2pem1kj]  .payment-table .mud-table-head {
    background: #eef6f2;
}

.payment-page[b-tsn2pem1kj]  .payment-table .mud-table-cell {
    padding: 13px 10px;
    border-bottom-color: var(--theme-border);
    font-size: .65rem;
}

.permit-application-no[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;

    padding: 0 8px;

    border: 1px solid rgba(7, 88, 67, .11);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f0f8f4;

    font-size: .56rem;
    font-weight: 700;
    white-space: nowrap;
}

.person-profile[b-tsn2pem1kj] {
    display: flex;
    min-width: 185px;
    align-items: center;
    gap: 9px;
}

.person-avatar[b-tsn2pem1kj],
.view-avatar[b-tsn2pem1kj] {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;

    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(145deg, #2c83b1, #17597e);
    box-shadow: 0 8px 19px rgba(27, 96, 137, .20);

    font-size: .70rem;
    font-weight: 700;
}

.person-avatar.female[b-tsn2pem1kj],
.view-avatar.female[b-tsn2pem1kj] {
    background: linear-gradient(145deg, #a05ca0, #69406f);
    box-shadow: 0 8px 19px rgba(121, 65, 127, .20);
}

.person-avatar.other[b-tsn2pem1kj],
.view-avatar.other[b-tsn2pem1kj] {
    background: linear-gradient(145deg, var(--theme-light), #166558);
    box-shadow: 0 8px 19px rgba(25, 116, 99, .20);
}

.person-name[b-tsn2pem1kj] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.person-name strong[b-tsn2pem1kj],
.person-name small[b-tsn2pem1kj] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.person-name strong[b-tsn2pem1kj] {
    color: var(--theme-ink);
    font-size: .68rem;
}

.person-name small[b-tsn2pem1kj] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.national-id[b-tsn2pem1kj] {
    display: block;
    color: color-mix(in srgb, var(--theme-ink) 74%, var(--theme-primary));
    font-weight: 600;
    white-space: nowrap;
}

.verified-label[b-tsn2pem1kj] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;

    color: var(--theme-primary);
    font-size: .49rem;
}

.contact-cell[b-tsn2pem1kj],
.area-cell[b-tsn2pem1kj],
.date-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.contact-cell[b-tsn2pem1kj] {
    gap: 3px;
}

.contact-cell span[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 4px;

    color: var(--theme-muted);
    font-size: .55rem;
    white-space: nowrap;
}

.area-cell strong[b-tsn2pem1kj],
.date-cell strong[b-tsn2pem1kj] {
    color: #365248;
    font-size: .58rem;
}

.area-cell small[b-tsn2pem1kj],
.date-cell small[b-tsn2pem1kj] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .50rem;
}

.channel-chip[b-tsn2pem1kj],
.document-chip[b-tsn2pem1kj],
.status-chip[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .52rem;
    font-weight: 620;
    white-space: nowrap;
}

.channel-chip.counter[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.channel-chip.online[b-tsn2pem1kj] {
    color: #2d78a4;
    background: #e7f2f9;
}

.channel-chip.mobile[b-tsn2pem1kj] {
    color: #7458a2;
    background: #f0eafb;
}

.channel-chip.field[b-tsn2pem1kj] {
    color: #95671d;
    background: #fff1d7;
}

.document-chip[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.document-chip.incomplete[b-tsn2pem1kj] {
    color: #aa4a42;
    background: #fff0ef;
}

.status-chip[b-tsn2pem1kj] {
    color: var(--theme-muted);
    background: #edf2ef;
}

.status-chip i[b-tsn2pem1kj] {
    width: 7px;
    height: 7px;
    border-radius: 50%;

    background: currentColor;
    box-shadow: 0 0 0 4px rgba(100, 120, 111, .09);
}

.status-chip.pending[b-tsn2pem1kj] {
    color: #2d78a4;
    background: #e7f2f9;
}

.status-chip.need_info[b-tsn2pem1kj] {
    color: #9a691d;
    background: #fff1d6;
}

.status-chip.approved[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.status-chip.rejected[b-tsn2pem1kj] {
    color: #aa453e;
    background: #fff0ef;
}

.row-actions[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.payment-page[b-tsn2pem1kj]  .row-action {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.payment-page[b-tsn2pem1kj]  .row-action.view {
    color: #2d79a2;
}

.payment-page[b-tsn2pem1kj]  .row-action.edit {
    color: var(--theme-primary);
}

.payment-page[b-tsn2pem1kj]  .row-action.delete {
    color: #b54842;
}

.pagination-bar[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    margin-top: 17px;
    padding-top: 15px;

    border-top: 1px solid rgba(7, 88, 67, .08);

    color: var(--theme-muted);
    font-size: .58rem;
}

.payment-page[b-tsn2pem1kj]  .premium-pagination .mud-pagination-item {
    border-radius: 9px;
}

.empty-state[b-tsn2pem1kj] {
    display: flex;
    min-height: 420px;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    padding: 30px;
    text-align: center;
}

.empty-state > span[b-tsn2pem1kj] {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;

    border-radius: 22px;

    color: var(--theme-muted);
    background: #edf4f0;
}

.empty-state h3[b-tsn2pem1kj] {
    margin: 14px 0 0;
    color: #3d5a50;
    font-size: .89rem;
}

.empty-state p[b-tsn2pem1kj] {
    max-width: 390px;
    margin: 5px 0 17px;

    color: var(--theme-muted);
    font-size: .63rem;
    line-height: 1.6;
}

.modal-backdrop[b-tsn2pem1kj] {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(3, 37, 29, .62);
    backdrop-filter: blur(8px);
}

.payment-form-modal[b-tsn2pem1kj],
.payment-view-modal[b-tsn2pem1kj],
.delete-modal[b-tsn2pem1kj] {
    width: min(100%, 1120px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;

    border: 1px solid rgba(231, 207, 152, .28);
    border-radius: 25px;

    background: #fff;
    box-shadow: 0 32px 90px rgba(3, 37, 29, .34);

    animation: modalAppear-b-tsn2pem1kj .22s ease-out;
}

@keyframes modalAppear-b-tsn2pem1kj {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.payment-form-modal[b-tsn2pem1kj] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 18px 20px;

    border-bottom: 1px solid rgba(7, 88, 67, .09);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-bg) 42%, white), color-mix(in srgb, var(--theme-bg) 82%, white));
}

.modal-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-tsn2pem1kj] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;

    border-radius: 15px;

    color: color-mix(in srgb, var(--theme-accent) 68%, white);
    background: linear-gradient(145deg, var(--theme-primary), var(--theme-dark));
    box-shadow: 0 10px 24px rgba(4, 61, 47, .20);
}

.modal-heading > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.modal-heading small[b-tsn2pem1kj] {
    color: #9c7932;
    font-size: .52rem;
    font-weight: 760;
    letter-spacing: .10em;
}

.modal-heading h2[b-tsn2pem1kj] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: 1.05rem;
}

.modal-heading p[b-tsn2pem1kj] {
    margin: 2px 0 0;
    color: #8b9993;
    font-size: .57rem;
}

.modal-body[b-tsn2pem1kj] {
    overflow-y: auto;
    padding: 21px;

    background:
        radial-gradient(circle at 100% 0%, rgba(201, 166, 93, .08), transparent 20rem),
        #fff;
}

.form-section-title[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 9px;

    margin: 5px 0 13px;
    padding-bottom: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.form-section-title:not(:first-child)[b-tsn2pem1kj] {
    margin-top: 24px;
}

.form-section-title > span[b-tsn2pem1kj] {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;

    border-radius: 11px;

    color: #0b7154;
    background: #e8f5ef;
}

.form-section-title > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.form-section-title strong[b-tsn2pem1kj] {
    color: #2d4b40;
    font-size: .72rem;
}

.form-section-title small[b-tsn2pem1kj] {
    margin-top: 1px;
    color: var(--theme-muted);
    font-size: .52rem;
}

.switch-card[b-tsn2pem1kj] {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 10px 12px;

    border: 1px solid rgba(7, 88, 67, .13);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-card > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.switch-card strong[b-tsn2pem1kj] {
    color: #3b574d;
    font-size: .60rem;
}

.switch-card small[b-tsn2pem1kj] {
    margin-top: 2px;
    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.45;
}

.modal-footer[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;

    padding: 15px 20px;

    border-top: 1px solid rgba(7, 88, 67, .09);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.payment-page[b-tsn2pem1kj]  .cancel-button,
.payment-page[b-tsn2pem1kj]  .save-button,
.payment-page[b-tsn2pem1kj]  .delete-confirm-button {
    min-height: 42px;
    border-radius: 12px !important;
}

.payment-page[b-tsn2pem1kj]  .cancel-button {
    color: #657970 !important;
    border-color: rgba(7, 88, 67, .16) !important;
}

.payment-page[b-tsn2pem1kj]  .save-button {
    min-width: 170px;
}

.payment-view-modal[b-tsn2pem1kj] {
    width: min(100%, 740px);
    overflow-y: auto;
}

.view-cover[b-tsn2pem1kj] {
    position: relative;

    display: flex;
    min-height: 145px;
    align-items: flex-end;
    justify-content: center;

    background:
        radial-gradient(circle at 50% 120%, rgba(201, 166, 93, .26), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-primary) 82%, var(--theme-dark)), color-mix(in srgb, var(--theme-dark) 86%, black));
}

.view-close[b-tsn2pem1kj] {
    position: absolute;
    top: 13px;
    right: 13px;

    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;

    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;

    color: #fff;
    background: rgba(255, 255, 255, .07);

    cursor: pointer;
}

.view-avatar[b-tsn2pem1kj] {
    width: 112px;
    height: 112px;
    margin-bottom: -46px;

    border: 5px solid #fff;

    font-size: 1.35rem;
    font-weight: 800;
}

.view-content[b-tsn2pem1kj] {
    padding: 61px 24px 25px;
}

.view-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.view-heading small[b-tsn2pem1kj] {
    color: #9d7a35;
    font-size: .53rem;
    font-weight: 750;
    letter-spacing: .08em;
}

.view-heading h2[b-tsn2pem1kj] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.25rem;
}

.view-heading p[b-tsn2pem1kj] {
    margin: 3px 0 0;
    color: #87958f;
    font-size: .60rem;
}

.view-status-row[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.view-info-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 17px;
}

.view-info-grid > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 70px;
    justify-content: center;
    flex-direction: column;

    padding: 11px 13px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-info-grid span[b-tsn2pem1kj],
.view-address small[b-tsn2pem1kj],
.view-note small[b-tsn2pem1kj] {
    color: #8b9993;
    font-size: .52rem;
}

.view-info-grid strong[b-tsn2pem1kj] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .64rem;
}

.view-address[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    background: #f5f9f7;
}

.view-address > span[b-tsn2pem1kj] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;

    border-radius: 12px;

    color: #0a7154;
    background: #e6f4ed;
}

.view-address > div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.view-address strong[b-tsn2pem1kj] {
    margin-top: 3px;
    color: color-mix(in srgb, var(--theme-ink) 80%, white);
    font-size: .62rem;
    line-height: 1.7;
}

.view-note[b-tsn2pem1kj] {
    margin-top: 13px;
    padding: 13px;

    border: 1px dashed rgba(7, 88, 67, .15);
    border-radius: 13px;
}

.view-note p[b-tsn2pem1kj] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .61rem;
    line-height: 1.65;
}

.delete-modal[b-tsn2pem1kj] {
    width: min(100%, 440px);
    padding: 27px;
    text-align: center;
}

.delete-icon[b-tsn2pem1kj] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    margin: 0 auto;

    border-radius: 21px;

    color: #fff;
    background: linear-gradient(145deg, #e36b65, #ad3d38);
    box-shadow: 0 13px 30px rgba(173, 61, 56, .22);
}

.delete-modal h2[b-tsn2pem1kj] {
    margin: 17px 0 0;
    color: #3f3532;
    font-size: 1.08rem;
}

.delete-modal p[b-tsn2pem1kj] {
    margin: 8px 0 0;
    color: #7b716e;
    font-size: .65rem;
    line-height: 1.65;
}

.delete-modal p strong[b-tsn2pem1kj] {
    color: #963b36;
}

.delete-warning[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: 15px;
    padding: 10px;

    border: 1px solid rgba(186, 70, 62, .12);
    border-radius: 12px;

    color: #a34a43;
    background: #fff3f1;

    font-size: .57rem;
}

.delete-actions[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.payment-page[b-tsn2pem1kj]  .delete-confirm-button {
    color: #fff !important;
    background: linear-gradient(145deg, #d95f59, #a93c37) !important;
    box-shadow: 0 9px 21px rgba(169, 60, 55, .18);
}

@media (max-width: 1150px) {
    .payment-hero[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-action-panel[b-tsn2pem1kj] {
        max-width: 570px;
    }

    .list-toolbar[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-tsn2pem1kj] {
        justify-content: flex-end;
    }
}

@media (max-width: 760px) {
    .payment-page[b-tsn2pem1kj] {
        padding: 15px 12px 30px;
    }

    .payment-hero[b-tsn2pem1kj] {
        padding: 27px 21px;
        border-radius: 23px;
    }

    .hero-content h1[b-tsn2pem1kj] {
        font-size: 2.3rem;
    }

    .hero-meta[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-meta > span[b-tsn2pem1kj] {
        width: 100%;
    }

    .filter-heading[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar-actions[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }

    .payment-page[b-tsn2pem1kj]  .sort-select {
        width: 100%;
    }

    .pagination-bar[b-tsn2pem1kj] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-tsn2pem1kj] {
        align-items: end;
        padding: 0;
    }

    .payment-form-modal[b-tsn2pem1kj],
    .payment-view-modal[b-tsn2pem1kj] {
        width: 100%;
        max-height: 94dvh;
        border-radius: 23px 23px 0 0;
    }

    .delete-modal[b-tsn2pem1kj] {
        width: calc(100% - 24px);
        margin-bottom: 12px;
    }

    .view-info-grid[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .filter-panel[b-tsn2pem1kj],
    .payment-list-panel[b-tsn2pem1kj] {
        padding: 17px;
        border-radius: 19px;
    }

    .modal-header[b-tsn2pem1kj] {
        align-items: flex-start;
    }

    .modal-icon[b-tsn2pem1kj] {
        display: none;
    }

    .modal-footer[b-tsn2pem1kj] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payment-page[b-tsn2pem1kj]  .save-button {
        min-width: 0;
    }

    .view-heading[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .summary-card[b-tsn2pem1kj],
    .payment-form-modal[b-tsn2pem1kj],
    .payment-view-modal[b-tsn2pem1kj],
    .delete-modal[b-tsn2pem1kj] {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}


/* =========================================================
   PERMIT APPLICATION PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --permit-green: #0b7358;
    --permit-deep: #073d31;
    --permit-gold: var(--theme-accent);
    --permit-blue: #2f789f;
    --permit-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(34, 151, 111, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #075545 0%,
            #03392e 58%,
            #02271f 100%) !important;
}

.payment-page[b-tsn2pem1kj]  .hero-add-button,
.payment-page[b-tsn2pem1kj]  .toolbar-add-button,
.payment-page[b-tsn2pem1kj]  .save-button {
    color: #fff !important;

    background:
        linear-gradient(
            145deg,
            #178466,
            #095d49) !important;

    box-shadow:
        0 11px 24px rgba(8, 94, 73, .24) !important;
}

.summary-card.total[b-tsn2pem1kj] {
    --summary-accent: #0b7358;
    --summary-soft: #e5f4ee;
    --summary-border: rgba(11, 115, 88, .20);
}

.summary-card.reviewing[b-tsn2pem1kj] {
    --summary-accent: #7658a7;
    --summary-soft: #f0eafb;
    --summary-border: rgba(118, 88, 167, .20);
}

.summary-card.approved[b-tsn2pem1kj] {
    --summary-accent: #397a4c;
    --summary-soft: #e6f5eb;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-tsn2pem1kj] {
    --summary-accent: #b27b25;
    --summary-soft: #fff3dd;
    --summary-border: rgba(178, 123, 37, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    gap: 9px;
    margin-top: 18px;
}

.status-overview-card[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);

    min-height: 75px;
    align-items: center;
    gap: 9px;

    padding: 11px;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 14px;

    color: #3b5047;
    background: rgba(255, 255, 255, .90);

    box-shadow:
        0 9px 24px rgba(5, 62, 46, .05);

    text-align: left;
    cursor: pointer;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.status-overview-card:hover[b-tsn2pem1kj] {
    transform: translateY(-2px);
    border-color: rgba(11, 115, 88, .22);
}

.status-overview-card.selected[b-tsn2pem1kj] {
    border-color: rgba(11, 115, 88, .34);

    box-shadow:
        0 0 0 4px rgba(11, 115, 88, .075),
        0 13px 31px rgba(5, 62, 46, .10);
}

.status-overview-card > span[b-tsn2pem1kj] {
    display: grid;
    width: 45px;
    height: 45px;

    place-items: center;
    border-radius: 13px;

    color: #fff;
    background: #60716a;
}

.status-overview-card.draft > span[b-tsn2pem1kj] {
    background: #71817a;
}

.status-overview-card.submitted > span[b-tsn2pem1kj] {
    background: #2f789f;
}

.status-overview-card.reviewing > span[b-tsn2pem1kj] {
    background: #7658a7;
}

.status-overview-card.need-info > span[b-tsn2pem1kj] {
    background: #bf7a25;
}

.status-overview-card.approved > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.status-overview-card div[b-tsn2pem1kj] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-tsn2pem1kj] {
    color: #7f8f88;
    font-size: .46rem;
    line-height: 1.35;
}

.status-overview-card strong[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #30463d;
    font-size: .77rem;
}

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: var(--theme-muted);
    font-size: .42rem;
}

.project-cell[b-tsn2pem1kj],
.applicant-cell[b-tsn2pem1kj],
.status-document-cell[b-tsn2pem1kj],
.officer-cell[b-tsn2pem1kj],
.fee-cell[b-tsn2pem1kj],
.due-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-tsn2pem1kj] {
    min-width: 190px;
}

.project-cell strong[b-tsn2pem1kj],
.applicant-cell strong[b-tsn2pem1kj],
.officer-cell strong[b-tsn2pem1kj],
.fee-cell strong[b-tsn2pem1kj],
.due-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-tsn2pem1kj],
.applicant-cell small[b-tsn2pem1kj],
.officer-cell small[b-tsn2pem1kj],
.due-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.applicant-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-document-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.fee-cell span[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 5px;
    padding: 0 8px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.fee-cell span.paid[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.fee-cell span.unpaid[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.due-cell.due-soon strong[b-tsn2pem1kj],
.due-cell.due-soon small[b-tsn2pem1kj] {
    color: #b14a40;
}

.permit-type-chip[b-tsn2pem1kj],
.priority-chip[b-tsn2pem1kj],
.document-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.permit-type-chip.building[b-tsn2pem1kj],
.permit-type-chip.occupancy[b-tsn2pem1kj] {
    color: #0b7358;
    background: #e7f5ef;
}

.permit-type-chip.demolition[b-tsn2pem1kj] {
    color: #775f59;
    background: #f0e9e7;
}

.permit-type-chip.business[b-tsn2pem1kj],
.permit-type-chip.factory[b-tsn2pem1kj] {
    color: #705090;
    background: #f0eafb;
}

.permit-type-chip.food[b-tsn2pem1kj],
.permit-type-chip.market[b-tsn2pem1kj] {
    color: #a66b22;
    background: #fff0d9;
}

.permit-type-chip.sign[b-tsn2pem1kj] {
    color: #5966a1;
    background: #eceefa;
}

.permit-type-chip.road-excavation[b-tsn2pem1kj] {
    color: #99621f;
    background: #f8ecd9;
}

.permit-type-chip.public-space[b-tsn2pem1kj],
.permit-type-chip.event[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.permit-type-chip.waste[b-tsn2pem1kj] {
    color: #44784d;
    background: #e8f4ea;
}

.permit-type-chip.animal[b-tsn2pem1kj] {
    color: #756246;
    background: #f2ebdd;
}

.permit-type-chip.fuel[b-tsn2pem1kj] {
    color: #b14a40;
    background: #fff0ee;
}

.priority-chip.urgent[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #d15c4f,
            #a53a32);
}

.priority-chip.high[b-tsn2pem1kj] {
    color: #a66b22;
    background: #fff0d9;
}

.priority-chip.normal[b-tsn2pem1kj] {
    color: #3b7257;
    background: #e8f5ed;
}

.status-chip.draft[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.submitted[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.document-check[b-tsn2pem1kj],
.status-chip.inspection[b-tsn2pem1kj],
.status-chip.reviewing[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.need-info[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.status-chip.approved[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.document-chip.complete[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.document-chip.verifying[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.document-chip.incomplete[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.paid-switch-card[b-tsn2pem1kj] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.coordinate-preview[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;

    align-items: center;
    gap: 9px;

    margin-top: 10px;
    padding: 10px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 12px;

    background: #f5fafc;
}

.coordinate-preview > span[b-tsn2pem1kj] {
    display: grid;
    width: 42px;
    height: 42px;

    place-items: center;
    border-radius: 12px;

    color: #fff;
    background: #2f789f;
}

.coordinate-preview small[b-tsn2pem1kj] {
    display: block;

    color: #7d8d87;
    font-size: .41rem;
}

.coordinate-preview strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 3px;

    color: #345064;
    font-size: .50rem;
}

.coordinate-preview a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 35px;

    align-items: center;
    padding: 0 9px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 9px;

    color: #2f789f;
    background: #fff;

    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.photo-upload-card[b-tsn2pem1kj] {
    overflow: hidden;

    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .05);
}

.photo-upload-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px;

    border-bottom: 1px solid rgba(7, 88, 67, .07);
}

.photo-upload-heading > span[b-tsn2pem1kj] {
    display: grid;
    width: 36px;
    height: 36px;

    place-items: center;
    border-radius: 11px;

    color: #0b7358;
    background: #e7f5ef;
}

.photo-upload-heading div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.photo-upload-heading strong[b-tsn2pem1kj] {
    color: #395047;
    font-size: .52rem;
}

.photo-upload-heading small[b-tsn2pem1kj] {
    margin-top: 2px;

    color: #86958f;
    font-size: .39rem;
}

.photo-preview[b-tsn2pem1kj] {
    height: 190px;
    overflow: hidden;

    background: #f2f6f4;
}

.photo-preview img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.photo-empty[b-tsn2pem1kj] {
    display: flex;
    height: 100%;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;

    color: #8b9993;
}

.photo-empty .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.8rem;
}

.photo-empty strong[b-tsn2pem1kj] {
    font-size: .48rem;
}

.photo-empty small[b-tsn2pem1kj] {
    font-size: .38rem;
}

.photo-upload-actions[b-tsn2pem1kj] {
    display: flex;
    gap: 6px;

    padding: 9px;
}

.file-picker-button[b-tsn2pem1kj],
.remove-photo-button[b-tsn2pem1kj] {
    position: relative;

    display: inline-flex;
    min-height: 35px;

    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;

    padding: 0 9px;
    border: 1px solid rgba(11, 115, 88, .15);
    border-radius: 9px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .41rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker-button input[b-tsn2pem1kj] {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    opacity: 0;

    cursor: pointer;
}

.remove-photo-button[b-tsn2pem1kj] {
    color: #ad4037;
    border-color: rgba(173, 64, 55, .14);
    background: #fff1ef;
}

.privacy-note[b-tsn2pem1kj] {
    margin-top: 12px;
}

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1120px, calc(100vw - 28px)) !important;
}

.view-toolbar[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 12px;
}

.view-toolbar-actions[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.view-map-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #edf6fb;

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 650;
    text-decoration: none;
}

.valuation-identity-banner[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.project-summary-panel[b-tsn2pem1kj] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.project-summary-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-summary-heading small[b-tsn2pem1kj] {
    color: #9c7932;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.project-summary-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.project-summary-heading > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    color: #0b7358;
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 650;
}

.project-summary-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 11px;
}

.project-summary-grid > div[b-tsn2pem1kj] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: #fff;
}

.project-summary-grid small[b-tsn2pem1kj] {
    color: #0b7358;
    font-size: .43rem;
    font-weight: 700;
}

.project-summary-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 6px;

    color: #355047;
    font-size: .59rem;
}

.project-summary-grid p[b-tsn2pem1kj] {
    margin: 6px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.approval-location-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-tsn2pem1kj] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-tsn2pem1kj] {
    font-style: normal;
}

.approval-location-panel b[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.inspection-note-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-tsn2pem1kj] {
    min-height: 105px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .document-note[b-tsn2pem1kj] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid .decision-note[b-tsn2pem1kj] {
    border-color: rgba(199, 163, 93, .16);
    background: #fffbf2;
}

.inspection-note-grid small[b-tsn2pem1kj] {
    color: #9c7932;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-tsn2pem1kj] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.history-list article > div > em[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #5e6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-style: normal;
}

.attachment-grid[b-tsn2pem1kj] {
    display: grid;
    gap: 10px;
}

.three-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
}

.attachment-card[b-tsn2pem1kj] {
    position: relative;

    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(7, 88, 67, .09);
    border-radius: 13px;

    background: #fff;

    cursor: pointer;
}

.attachment-card img[b-tsn2pem1kj] {
    width: 100%;
    height: 190px;

    object-fit: cover;
}

.attachment-card > span[b-tsn2pem1kj] {
    display: flex;
    min-height: 39px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
}

.attachment-card.site > span[b-tsn2pem1kj] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.plan > span[b-tsn2pem1kj] {
    color: #7658a7;
    background: #f0eafb;
}

.attachment-card.document > span[b-tsn2pem1kj] {
    color: #9c7932;
    background: #f8efdc;
}

.attachment-empty[b-tsn2pem1kj] {
    display: flex;
    min-height: 180px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;

    border: 1px dashed rgba(7, 88, 67, .16);
    border-radius: 13px;

    color: #82918b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);

    font-size: .48rem;
}

.image-preview-backdrop[b-tsn2pem1kj] {
    position: fixed;
    z-index: 1400;
    inset: 0;

    display: grid;
    place-items: center;

    padding: 18px;

    background: rgba(4, 22, 18, .76);
    backdrop-filter: blur(9px);
}

.image-preview-modal[b-tsn2pem1kj] {
    width: min(1080px, calc(100vw - 30px));
    max-height: calc(100vh - 30px);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;

    background: #fff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, .38);
}

.image-preview-header[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 13px 15px;

    border-bottom: 1px solid rgba(7, 88, 67, .08);
}

.image-preview-header small[b-tsn2pem1kj] {
    color: #9c7932;
    font-size: .42rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.image-preview-header h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .68rem;
}

.image-preview-body[b-tsn2pem1kj] {
    display: grid;
    max-height: calc(100vh - 110px);

    overflow: auto;
    place-items: center;

    padding: 14px;

    background: #eef3f0;
}

.image-preview-body img[b-tsn2pem1kj] {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 12px;

    object-fit: contain;

    box-shadow:
        0 15px 42px rgba(0, 0, 0, .15);
}

@media (max-width: 1380px) {
    .status-overview[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .three-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .status-overview[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .payment-photo-upload-grid[b-tsn2pem1kj],
    .project-summary-grid[b-tsn2pem1kj],
    .inspection-note-grid[b-tsn2pem1kj],
    .three-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-tsn2pem1kj] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .coordinate-preview[b-tsn2pem1kj] {
        grid-template-columns:
            42px minmax(0, 1fr);
    }

    .coordinate-preview a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .status-overview[b-tsn2pem1kj],
    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
        min-height: 72px;
    }

    .view-toolbar[b-tsn2pem1kj] {
        align-items: stretch;
        flex-direction: column;
    }

    .view-toolbar-actions[b-tsn2pem1kj] {
        width: 100%;
        flex-direction: column;
    }

    .view-map-button[b-tsn2pem1kj],
    .payment-page[b-tsn2pem1kj]  .view-edit-button {
        width: 100%;
    }
}


/* =========================================================
   PERMIT SITE INSPECTION PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --inspection-green: #0c735a;
    --inspection-deep: #073e32;
    --inspection-gold: var(--theme-accent);
    --inspection-blue: #2d789f;
    --inspection-purple: #73569b;
    --inspection-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(199, 163, 93, .23),
            transparent 28%),
        radial-gradient(
            circle at 8% 112%,
            rgba(48, 166, 125, .22),
            transparent 36%),
        linear-gradient(
            138deg,
            #0d5949 0%,
            #073d32 58%,
            #042820 100%) !important;
}

.summary-card.today[b-tsn2pem1kj] {
    --summary-accent: #2d789f;
    --summary-soft: #e7f2f8;
    --summary-border: rgba(45, 120, 159, .20);
}

.summary-card.upcoming[b-tsn2pem1kj] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.progress[b-tsn2pem1kj] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.result[b-tsn2pem1kj] {
    --summary-accent: #36784b;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(54, 120, 75, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.scheduled > span[b-tsn2pem1kj] {
    background: #a36e24;
}

.status-overview-card.confirmed > span[b-tsn2pem1kj] {
    background: #2d789f;
}

.status-overview-card.in-progress > span[b-tsn2pem1kj] {
    background: #73569b;
}

.status-overview-card.completed > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.rescheduled > span[b-tsn2pem1kj] {
    background: #a5652b;
}

.status-overview-card.cancelled > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 12px;

    color: #0c735a;
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 8px;

    color: #0c735a;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-tsn2pem1kj],
.appointment-cell[b-tsn2pem1kj],
.team-cell[b-tsn2pem1kj],
.status-result-cell[b-tsn2pem1kj],
.applicant-cell[b-tsn2pem1kj],
.notification-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-tsn2pem1kj] {
    min-width: 190px;
}

.project-cell strong[b-tsn2pem1kj],
.appointment-cell strong[b-tsn2pem1kj],
.team-cell strong[b-tsn2pem1kj],
.applicant-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-tsn2pem1kj],
.appointment-cell small[b-tsn2pem1kj],
.team-cell small[b-tsn2pem1kj],
.applicant-cell small[b-tsn2pem1kj],
.notification-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.appointment-cell em[b-tsn2pem1kj],
.team-cell em[b-tsn2pem1kj],
.applicant-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2d789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.appointment-cell.overdue strong[b-tsn2pem1kj],
.appointment-cell.overdue small[b-tsn2pem1kj] {
    color: #b0443b;
}

.status-result-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.notification-cell[b-tsn2pem1kj] {
    align-items: flex-start;
}

.notification-cell > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 25px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.notification-cell > span.sent[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.notification-cell > span.pending[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.result-chip.pending[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.result-chip.pass[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.result-chip.conditional[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.result-chip.fail[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.scheduled[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.confirmed[b-tsn2pem1kj] {
    color: #2d789f;
    background: #e8f3f8;
}

.status-chip.in-progress[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.completed[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rescheduled[b-tsn2pem1kj] {
    color: #a5652b;
    background: #f8ecdd;
}

.status-chip.no-show[b-tsn2pem1kj] {
    color: #7a5d59;
    background: #f1e9e7;
}

.status-chip.cancelled[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.source-application-picker[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
    margin-bottom: 16px;
}

.source-application-card[b-tsn2pem1kj] {
    overflow: hidden;

    padding: 0;
    border: 1px solid rgba(12, 115, 90, .12);
    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 10px 25px rgba(5, 62, 46, .055);

    cursor: pointer;
    text-align: left;

    transition:
        transform .17s ease,
        border-color .17s ease,
        box-shadow .17s ease;
}

.source-application-card:hover[b-tsn2pem1kj] {
    transform: translateY(-2px);

    border-color: rgba(12, 115, 90, .28);

    box-shadow:
        0 15px 31px rgba(5, 62, 46, .11);
}

.source-application-card.selected[b-tsn2pem1kj] {
    border: 2px solid #0c735a;

    box-shadow:
        0 0 0 4px rgba(12, 115, 90, .08),
        0 16px 34px rgba(5, 62, 46, .13);
}

.source-picker-cover[b-tsn2pem1kj] {
    position: relative;

    display: grid;
    height: 130px;
    overflow: hidden;

    place-items: center;

    color: #0c735a;
    background:
        radial-gradient(
            circle,
            rgba(12, 115, 90, .13),
            transparent 58%),
        #edf5f2;
}

.source-picker-cover img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.source-picker-cover > span .mud-icon-root[b-tsn2pem1kj] {
    font-size: 2rem;
}

.source-priority[b-tsn2pem1kj] {
    position: absolute;
    top: 8px;
    right: 8px;

    display: inline-flex;
    min-height: 25px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;

    color: #fff;
    background: rgba(61, 74, 68, .86);

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-style: normal;
    font-weight: 700;

    backdrop-filter: blur(8px);
}

.source-priority.urgent[b-tsn2pem1kj] {
    background: rgba(183, 57, 48, .92);
}

.source-priority.high[b-tsn2pem1kj] {
    background: rgba(178, 118, 31, .92);
}

.source-priority.normal[b-tsn2pem1kj] {
    background: rgba(48, 112, 81, .90);
}

.source-picker-content[b-tsn2pem1kj] {
    padding: 10px;
}

.source-picker-content > small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .42rem;
    font-weight: 700;
}

.source-picker-content > strong[b-tsn2pem1kj] {
    display: -webkit-box;
    min-height: 38px;
    margin-top: 4px;
    overflow: hidden;

    color: #354740;
    font-family: 'Kanit', sans-serif;
    font-size: .57rem;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > p[b-tsn2pem1kj] {
    display: -webkit-box;
    min-height: 30px;
    margin: 5px 0 0;
    overflow: hidden;

    color: var(--theme-muted);
    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    line-height: 1.5;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.source-picker-content > div[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;

    margin-top: 8px;
}

.source-empty-alert[b-tsn2pem1kj] {
    margin-bottom: 16px;
}

.locked-application-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-application-cover[b-tsn2pem1kj] {
    display: grid;
    min-height: 220px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0c735a;
    background: #eaf3ef;
}

.locked-application-cover img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-application-cover .mud-icon-root[b-tsn2pem1kj] {
    font-size: 2.4rem;
}

.locked-application-content[b-tsn2pem1kj] {
    min-width: 0;
}

.locked-application-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-application-heading small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-application-heading h3[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-application-heading p[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #0c735a;
    font-size: .49rem;
    font-weight: 700;
}

.locked-application-badges[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-application-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-application-grid > div[b-tsn2pem1kj] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-application-grid > div.wide[b-tsn2pem1kj] {
    grid-column: span 2;
}

.locked-application-grid span[b-tsn2pem1kj] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-application-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.source-panel-actions[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-panel-actions a[b-tsn2pem1kj],
.source-panel-actions button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(12, 115, 90, .16);
    border-radius: 9px;

    color: #0c735a;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

.notification-switch-card[b-tsn2pem1kj] {
    display: flex;
    min-height: 56px;

    align-items: center;
    padding: 0 11px;

    border: 1px solid rgba(12, 115, 90, .10);
    border-radius: 12px;

    background: #f4faf7;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 10px;
}

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1140px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(12, 115, 90, .11);
    border-radius: 16px;

    background: rgba(12, 115, 90, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.source-application-detail[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(12, 115, 90, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(12, 115, 90, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-detail-icon[b-tsn2pem1kj] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.source-application-detail small[b-tsn2pem1kj] {
    color: #0c735a;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.source-application-detail h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .71rem;
}

.source-application-detail p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .51rem;
    line-height: 1.65;
}

.source-detail-meta[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(45, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(45, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-tsn2pem1kj] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-tsn2pem1kj] {
    color: #2d789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-tsn2pem1kj] {
    font-style: normal;
}

.approval-location-panel b[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #2d789f;
    font-size: .42rem;
}

.approval-location-panel a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(45, 120, 159, .18);
    border-radius: 10px;

    color: #2d789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.appointment-timeline-panel[b-tsn2pem1kj] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.appointment-timeline-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.appointment-timeline-heading small[b-tsn2pem1kj] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.appointment-timeline-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-tsn2pem1kj] {
    color: #2d789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.completed[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.appointment-time-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.appointment-time-grid > div[b-tsn2pem1kj] {
    min-height: 62px;
    padding: 9px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 10px;

    background: #fff;
}

.appointment-time-grid span[b-tsn2pem1kj] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.appointment-time-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
}

.inspection-note-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.inspection-note-grid > div[b-tsn2pem1kj] {
    min-height: 110px;
    padding: 12px;

    border: 1px solid rgba(12, 115, 90, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.inspection-note-grid .checklist-note[b-tsn2pem1kj] {
    border-color: rgba(45, 120, 159, .13);
    background: #f5fafc;
}

.inspection-note-grid .equipment-note[b-tsn2pem1kj] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.inspection-note-grid .result-note[b-tsn2pem1kj] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.inspection-note-grid .cancel-note[b-tsn2pem1kj] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.inspection-note-grid small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.inspection-note-grid p[b-tsn2pem1kj] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.overdue-inline-chip[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 24px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .40rem;
    font-weight: 700;
}

.five-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-tsn2pem1kj] {
    color: #0c735a;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.preparation > span[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.attachment-card.inspection > span[b-tsn2pem1kj] {
    color: #2d789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

@media (max-width: 1380px) {
    .source-application-picker[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-tsn2pem1kj],
    .five-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-application-panel[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-application-cover[b-tsn2pem1kj] {
        max-height: 310px;
    }

    .locked-application-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .appointment-time-grid[b-tsn2pem1kj],
    .five-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .source-application-picker[b-tsn2pem1kj],
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .inspection-note-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .appointment-time-grid[b-tsn2pem1kj],
    .five-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-tsn2pem1kj] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-tsn2pem1kj],
    .locked-application-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-application-grid > div.wide[b-tsn2pem1kj] {
        grid-column: auto;
    }

    .locked-application-heading[b-tsn2pem1kj] {
        flex-direction: column;
    }

    .locked-application-badges[b-tsn2pem1kj] {
        justify-content: flex-start;
    }
}


/* =========================================================
   PERMIT REVIEW & APPROVAL PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --approval-green: #0b7358;
    --approval-deep: #073d31;
    --approval-gold: var(--theme-accent);
    --approval-blue: #2f789f;
    --approval-purple: #73569b;
    --approval-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 86% 0%,
            rgba(199, 163, 93, .26),
            transparent 30%),
        radial-gradient(
            circle at 8% 112%,
            rgba(36, 145, 109, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #134f43 0%,
            #0b3b31 56%,
            #06271f 100%) !important;
}

.hero-source-card[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    align-items: center;
    gap: 9px;

    padding: 9px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;

    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .055);
}

.hero-source-card > .mud-icon-root[b-tsn2pem1kj] {
    padding: 8px;
    border-radius: 10px;

    color: #f2d999;
    background: rgba(242, 217, 153, .12);
}

.hero-source-card div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.hero-source-card small[b-tsn2pem1kj] {
    font-size: .42rem;
    opacity: .72;
}

.hero-source-card strong[b-tsn2pem1kj] {
    margin-top: 2px;
    font-size: .54rem;
}

.summary-card.waiting[b-tsn2pem1kj] {
    --summary-accent: #b27a25;
    --summary-soft: #fff2dc;
    --summary-border: rgba(178, 122, 37, .20);
}

.summary-card.reviewing[b-tsn2pem1kj] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.summary-card.approved[b-tsn2pem1kj] {
    --summary-accent: #397a4c;
    --summary-soft: #e7f5ec;
    --summary-border: rgba(57, 122, 76, .20);
}

.summary-card.fee[b-tsn2pem1kj] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.waiting > span[b-tsn2pem1kj] {
    background: #b27a25;
}

.status-overview-card.reviewing > span[b-tsn2pem1kj] {
    background: #73569b;
}

.status-overview-card.revision > span[b-tsn2pem1kj] {
    background: #a5652b;
}

.status-overview-card.approved > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.status-overview-card.overdue > span[b-tsn2pem1kj] {
    background: #9f4139;
}

.source-note[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 34px;

    align-items: center;
    gap: 6px;

    padding: 0 10px;
    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 999px;

    color: #0b7358;
    background: #edf7f3;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
}

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 155px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 12px;

    color: #0b7358;
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(11, 115, 88, .12);
    border-radius: 8px;

    color: #0b7358;
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .42rem;
    font-weight: 650;
}

.project-cell[b-tsn2pem1kj],
.inspection-result-cell[b-tsn2pem1kj],
.status-recommendation-cell[b-tsn2pem1kj],
.reviewer-cell[b-tsn2pem1kj],
.decision-cell[b-tsn2pem1kj],
.permit-fee-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.project-cell[b-tsn2pem1kj] {
    min-width: 190px;
}

.project-cell strong[b-tsn2pem1kj],
.inspection-result-cell strong[b-tsn2pem1kj],
.reviewer-cell strong[b-tsn2pem1kj],
.decision-cell strong[b-tsn2pem1kj],
.permit-fee-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.project-cell small[b-tsn2pem1kj],
.inspection-result-cell small[b-tsn2pem1kj],
.reviewer-cell small[b-tsn2pem1kj],
.decision-cell small[b-tsn2pem1kj],
.permit-fee-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.reviewer-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #73569b;
    background: #f0eafb;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.status-recommendation-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.decision-cell[b-tsn2pem1kj] {
    gap: 4px;
}

.decision-cell.overdue strong[b-tsn2pem1kj],
.decision-cell.overdue small[b-tsn2pem1kj] {
    color: #ad4037;
}

.permit-fee-cell > span[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.permit-fee-cell > span.paid[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.permit-fee-cell > span.unpaid[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip[b-tsn2pem1kj],
.recommendation-chip[b-tsn2pem1kj],
.final-decision-chip[b-tsn2pem1kj],
.inspection-result-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.review-status-chip[b-tsn2pem1kj] {
    gap: 5px;
}

.review-status-chip > i[b-tsn2pem1kj] {
    width: 6px;
    height: 6px;

    border-radius: 50%;
    background: currentColor;
}

.review-status-chip.waiting-review[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.review-status-chip.under-review[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.review-status-chip.need-revision[b-tsn2pem1kj] {
    color: #a5652b;
    background: #f8ecdd;
}

.review-status-chip.ready-for-decision[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.review-status-chip.decided[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.review-status-chip.cancelled[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.pending[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.recommendation-chip.approve[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.recommendation-chip.conditional[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.recommendation-chip.reject[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.recommendation-chip.revision[b-tsn2pem1kj] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.pending[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.final-decision-chip.approved[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.final-decision-chip.conditional-approved[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.final-decision-chip.rejected[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.final-decision-chip.returned[b-tsn2pem1kj] {
    color: #a5652b;
    background: #f8ecdd;
}

.final-decision-chip.cancelled[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.inspection-result-chip.pass[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.inspection-result-chip.conditional[b-tsn2pem1kj] {
    color: #a46c20;
    background: #fff0d8;
}

.inspection-result-chip.fail[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.locked-source-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);

    gap: 15px;
    margin-bottom: 16px;
    overflow: hidden;

    padding: 14px;

    border: 1px solid rgba(11, 115, 88, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .11),
            transparent 20rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.locked-source-cover[b-tsn2pem1kj] {
    display: grid;
    min-height: 225px;
    overflow: hidden;

    place-items: center;
    border-radius: 13px;

    color: #0b7358;
    background: #eaf3ef;
}

.locked-source-cover img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.locked-source-cover .mud-icon-root[b-tsn2pem1kj] {
    font-size: 2.4rem;
}

.locked-source-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.locked-source-heading small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.locked-source-heading h3[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #34483f;
    font-size: .81rem;
}

.locked-source-heading p[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #0b7358;
    font-size: .49rem;
    font-weight: 700;
}

.locked-source-badges[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.locked-source-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.locked-source-grid > div[b-tsn2pem1kj] {
    min-height: 58px;
    padding: 8px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 10px;

    background: #fff;
}

.locked-source-grid > div.wide[b-tsn2pem1kj] {
    grid-column: span 2;
}

.locked-source-grid span[b-tsn2pem1kj] {
    display: block;

    color: var(--theme-muted);
    font-size: .40rem;
}

.locked-source-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .49rem;
    line-height: 1.42;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1200px, calc(100vw - 28px)) !important;
}

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(11, 115, 88, .11);
    border-radius: 16px;

    background: rgba(11, 115, 88, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.inspection-source-detail[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.source-detail-icon[b-tsn2pem1kj] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);

    box-shadow:
        0 10px 22px rgba(47, 120, 159, .20);
}

.inspection-source-detail small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.inspection-source-detail h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .68rem;
    line-height: 1.5;
}

.inspection-source-detail p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.65;
}

.source-detail-meta[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;

    margin-top: 8px;
}

.source-detail-meta span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    color: #5d6f68;
    background: #edf3f0;

    font-size: .40rem;
    font-weight: 650;
}

.approval-location-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.approval-location-panel > span[b-tsn2pem1kj] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.approval-location-panel small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.approval-location-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .69rem;
}

.approval-location-panel p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
    line-height: 1.55;
}

.approval-location-panel p em[b-tsn2pem1kj] {
    font-style: normal;
}

.approval-location-panel b[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.approval-location-panel a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.decision-summary-panel[b-tsn2pem1kj] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(115, 86, 155, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(115, 86, 155, .09),
            transparent 18rem),
        #faf8fc;
}

.decision-summary-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.decision-summary-heading small[b-tsn2pem1kj] {
    color: #73569b;
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.decision-summary-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .72rem;
}

.due-badge[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;

    border-radius: 999px;

    font-size: .43rem;
    font-weight: 700;
}

.due-badge.normal[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.due-badge.overdue[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.decided[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.decision-summary-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.decision-summary-grid > div[b-tsn2pem1kj] {
    min-height: 100px;
    padding: 10px;

    border: 1px solid rgba(115, 86, 155, .07);
    border-radius: 11px;

    background: #fff;
}

.decision-summary-grid span[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.decision-summary-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: color-mix(in srgb, var(--theme-ink) 82%, white);
    font-size: .55rem;
    line-height: 1.45;
}

.decision-summary-grid p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: #687972;
    font-size: .43rem;
    line-height: 1.55;
}

.opinion-grid[b-tsn2pem1kj],
.condition-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 9px;
    margin-top: 13px;
}

.opinion-grid > div[b-tsn2pem1kj],
.condition-grid > div[b-tsn2pem1kj] {
    min-height: 112px;
    padding: 12px;

    border: 1px solid rgba(11, 115, 88, .08);
    border-radius: 12px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.opinion-grid .technical[b-tsn2pem1kj] {
    border-color: rgba(47, 120, 159, .13);
    background: #f5fafc;
}

.opinion-grid .health[b-tsn2pem1kj] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.opinion-grid .legal[b-tsn2pem1kj] {
    border-color: rgba(115, 86, 155, .13);
    background: #faf7fc;
}

.opinion-grid .summary[b-tsn2pem1kj] {
    border-color: rgba(199, 163, 93, .15);
    background: #fffbf2;
}

.condition-grid .condition[b-tsn2pem1kj] {
    border-color: rgba(57, 122, 76, .13);
    background: #f4faf6;
}

.condition-grid .revision[b-tsn2pem1kj] {
    border-color: rgba(165, 101, 43, .13);
    background: #fdf8f1;
}

.condition-grid .rejection[b-tsn2pem1kj] {
    border-color: rgba(181, 77, 67, .13);
    background: #fff7f5;
}

.opinion-grid small[b-tsn2pem1kj],
.condition-grid small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.opinion-grid p[b-tsn2pem1kj],
.condition-grid p[b-tsn2pem1kj] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .52rem;
    line-height: 1.72;
}

.six-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;
}

.attachment-card.source-site > span[b-tsn2pem1kj] {
    color: #0b7358;
    background: #e7f5ef;
}

.attachment-card.source-plan > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

.attachment-card.inspection > span[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.result > span[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.decision > span[b-tsn2pem1kj] {
    color: #987634;
    background: #f8efdc;
}

.attachment-card.permit > span[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

@media (max-width: 1380px) {
    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .decision-summary-grid[b-tsn2pem1kj],
    .six-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1050px) {
    .locked-source-panel[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .locked-source-cover[b-tsn2pem1kj] {
        max-height: 320px;
    }

    .locked-source-grid[b-tsn2pem1kj],
    .decision-summary-grid[b-tsn2pem1kj],
    .six-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 780px) {
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .opinion-grid[b-tsn2pem1kj],
    .condition-grid[b-tsn2pem1kj],
    .decision-summary-grid[b-tsn2pem1kj],
    .six-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .approval-location-panel[b-tsn2pem1kj] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .approval-location-panel a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-tsn2pem1kj],
    .locked-source-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .locked-source-grid > div.wide[b-tsn2pem1kj] {
        grid-column: auto;
    }

    .locked-source-heading[b-tsn2pem1kj] {
        flex-direction: column;
    }

    .locked-source-badges[b-tsn2pem1kj] {
        justify-content: flex-start;
    }
}


/* =========================================================
   LAND PARCEL REGISTRY PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --land-green: var(--theme-primary);
    --land-deep: var(--theme-dark);
    --land-gold: var(--theme-accent);
    --land-blue: #2f789f;
    --land-purple: #73569b;
    --land-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .27),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(70, 158, 102, .23),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.summary-card.total[b-tsn2pem1kj] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.area[b-tsn2pem1kj] {
    --summary-accent: #4d7c45;
    --summary-soft: #edf6e9;
    --summary-border: rgba(77, 124, 69, .20);
}

.summary-card.value[b-tsn2pem1kj] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.coordinate[b-tsn2pem1kj] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.active > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.transfer > span[b-tsn2pem1kj] {
    background: #b27a25;
}

.status-overview-card.disputed > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.status-overview-card.coordinate > span[b-tsn2pem1kj] {
    background: #2f789f;
}

.status-overview-card.missing > span[b-tsn2pem1kj] {
    background: #7d665f;
}

.status-overview-card.review > span[b-tsn2pem1kj] {
    background: #73569b;
}

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);

    min-width: 150px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 50px;
    height: 50px;

    overflow: hidden;
    place-items: center;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;

    background: transparent;
    cursor: pointer;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .48rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .40rem;
    font-weight: 650;
}

.owner-cell[b-tsn2pem1kj],
.area-cell[b-tsn2pem1kj],
.location-cell[b-tsn2pem1kj],
.value-cell[b-tsn2pem1kj],
.status-review-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 132px;
    flex-direction: column;
}

.owner-cell[b-tsn2pem1kj],
.location-cell[b-tsn2pem1kj] {
    min-width: 180px;
}

.owner-cell strong[b-tsn2pem1kj],
.area-cell strong[b-tsn2pem1kj],
.location-cell strong[b-tsn2pem1kj],
.value-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .54rem;
    line-height: 1.48;
}

.owner-cell small[b-tsn2pem1kj],
.area-cell small[b-tsn2pem1kj],
.location-cell small[b-tsn2pem1kj],
.value-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .43rem;
    line-height: 1.5;
}

.owner-cell em[b-tsn2pem1kj],
.value-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-style: normal;
    font-weight: 650;
}

.location-cell a[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;

    align-items: center;
    gap: 4px;

    margin-top: 6px;
    padding: 0 7px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 999px;

    color: #2f789f;
    background: #edf6fb;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.missing-coordinate[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    margin-top: 6px;
    padding: 0 7px;

    border-radius: 999px;

    color: #775f59;
    background: #f0e9e7;

    font-size: .38rem;
    font-style: normal;
    font-weight: 700;
}

.status-review-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.owner-type-chip[b-tsn2pem1kj],
.usage-chip[b-tsn2pem1kj],
.land-type-chip[b-tsn2pem1kj],
.coordinate-ready-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    gap: 4px;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .40rem;
    font-weight: 700;
}

.owner-type-chip.person[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-type-chip.company[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.owner-type-chip.government[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.owner-type-chip.community[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.residential[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-tsn2pem1kj] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.land-type-chip.chanote[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.land-type-chip.ns3k[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.land-type-chip.ns3[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.land-type-chip.sk1[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.land-type-chip.other[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.active[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.transfer-pending[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.disputed[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.leased[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.mortgaged[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.archived[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.review-badge[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;

    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.review-badge.normal[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.review-badge.due[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.review-badge.overdue[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.review-badge.none[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.row-map-action[b-tsn2pem1kj] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

.coordinate-form-panel[b-tsn2pem1kj] {
    overflow: hidden;

    margin-bottom: 16px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .13);
    border-radius: 16px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .09),
            transparent 18rem),
        #f5fafc;
}

.coordinate-action-card[b-tsn2pem1kj] {
    display: flex;
    min-height: 56px;

    align-items: center;
    justify-content: center;

    border: 1px solid rgba(47, 120, 159, .10);
    border-radius: 12px;

    background: #fff;
}

.coordinate-action-card a[b-tsn2pem1kj],
.coordinate-action-card span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.coordinate-action-card a[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.coordinate-action-card span[b-tsn2pem1kj] {
    color: #75867f;
    background: #edf2ef;
}

.map-preview[b-tsn2pem1kj],
.google-map-panel[b-tsn2pem1kj] {
    overflow: hidden;

    margin-top: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 15px;

    background: #fff;
}

.map-preview iframe[b-tsn2pem1kj] {
    display: block;
    width: 100%;
    height: 300px;

    border: 0;
}

.map-empty[b-tsn2pem1kj] {
    display: flex;
    min-height: 220px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;

    margin-top: 12px;
    border: 1px dashed rgba(47, 120, 159, .22);
    border-radius: 15px;

    color: #2f789f;
    background: rgba(255, 255, 255, .65);
}

.map-empty strong[b-tsn2pem1kj] {
    color: #40554c;
    font-size: .55rem;
}

.map-empty small[b-tsn2pem1kj] {
    color: #7e8d87;
    font-size: .42rem;
}

.area-summary-card[b-tsn2pem1kj] {
    display: flex;
    min-height: 58px;

    align-items: center;
    justify-content: space-between;
    gap: 10px;

    padding: 0 13px;
    border: 1px solid rgba(77, 124, 69, .12);
    border-radius: 12px;

    background: #f2f8ef;
}

.area-summary-card span[b-tsn2pem1kj] {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    color: #43763d;
    font-size: .44rem;
    font-weight: 700;
}

.area-summary-card strong[b-tsn2pem1kj] {
    color: #355047;
    font-size: .54rem;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;
}

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1220px, calc(100vw - 28px)) !important;
}

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1160px, calc(100vw - 28px)) !important;
}

.valuation-identity-banner[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #355047;
    font-size: .54rem;
    line-height: 1.45;
    text-align: center;
}

.coordinate-ready-chip[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.owner-summary-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);

    gap: 11px;
    align-items: center;

    margin-top: 14px;
    padding: 13px;

    border: 1px solid rgba(10, 114, 87, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .10),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.owner-summary-icon[b-tsn2pem1kj] {
    display: grid;
    width: 62px;
    height: 62px;

    place-items: center;
    border-radius: 18px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .20);
}

.owner-summary-panel small[b-tsn2pem1kj] {
    color: var(--theme-primary);
    font-size: .45rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-summary-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.owner-summary-panel p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: var(--theme-muted);
    font-size: .50rem;
}

.owner-summary-panel em[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #987634;
    font-size: .43rem;
    font-style: normal;
}

.area-value-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 9px;
    margin-top: 14px;
}

.area-value-grid article[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);

    min-height: 82px;
    align-items: center;
    gap: 9px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 13px;

    background: #fff;
}

.area-value-grid article > span[b-tsn2pem1kj] {
    display: grid;
    width: 46px;
    height: 46px;

    place-items: center;
    border-radius: 13px;

    color: #4d7c45;
    background: #edf6e9;
}

.area-value-grid article:nth-child(2) > span[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.area-value-grid article:nth-child(3) > span[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.area-value-grid article:nth-child(4) > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

.area-value-grid div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.area-value-grid small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .40rem;
}

.area-value-grid strong[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #34483f;
    font-size: .62rem;
}

.area-value-grid em[b-tsn2pem1kj] {
    color: #72837c;
    font-size: .38rem;
    font-style: normal;
}

.land-location-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.land-location-panel > span[b-tsn2pem1kj] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.land-location-panel small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.land-location-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .66rem;
}

.land-location-panel p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .49rem;
    line-height: 1.55;
}

.land-location-panel b[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.land-location-panel a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;

    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-tsn2pem1kj] {
    margin-top: 13px;
    padding: 0;
}

.map-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 12px 13px;
}

.map-heading small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .70rem;
}

.map-heading > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;

    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .40rem;
    font-weight: 700;
}

.google-map-panel iframe[b-tsn2pem1kj] {
    display: block;
    width: 100%;
    height: 360px;

    border: 0;
}

.map-not-available[b-tsn2pem1kj] {
    display: flex;
    min-height: 110px;

    align-items: center;
    justify-content: center;
    gap: 10px;

    margin-top: 13px;
    padding: 15px;

    border: 1px dashed rgba(181, 77, 67, .22);
    border-radius: 15px;

    color: #ad4037;
    background: #fff8f6;
}

.map-not-available div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.map-not-available strong[b-tsn2pem1kj] {
    color: #6e4944;
    font-size: .54rem;
}

.map-not-available small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #967c77;
    font-size: .42rem;
}

.boundary-panel[b-tsn2pem1kj] {
    margin-top: 14px;
    padding: 14px;

    border: 1px solid rgba(77, 124, 69, .10);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(77, 124, 69, .09),
            transparent 18rem),
        #f8fbf7;
}

.boundary-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.boundary-grid > div[b-tsn2pem1kj],
.access-grid > div[b-tsn2pem1kj] {
    min-height: 76px;
    padding: 10px;

    border: 1px solid rgba(77, 124, 69, .08);
    border-radius: 11px;

    background: #fff;
}

.boundary-grid span[b-tsn2pem1kj],
.access-grid span[b-tsn2pem1kj] {
    color: #4d7c45;
    font-size: .41rem;
    font-weight: 700;
}

.boundary-grid strong[b-tsn2pem1kj],
.access-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 6px;

    color: #45564f;
    font-size: .49rem;
    line-height: 1.55;
}

.boundary-grid .north[b-tsn2pem1kj] {
    border-top: 3px solid #2f789f;
}

.boundary-grid .east[b-tsn2pem1kj] {
    border-top: 3px solid #987634;
}

.boundary-grid .south[b-tsn2pem1kj] {
    border-top: 3px solid #4d7c45;
}

.boundary-grid .west[b-tsn2pem1kj] {
    border-top: 3px solid #73569b;
}

.access-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 8px;
}

.land-info-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.land-info-grid > div[b-tsn2pem1kj] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.land-info-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .40rem;
}

.land-info-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .49rem;
}

.remark-panel[b-tsn2pem1kj] {
    margin-top: 13px;
    padding: 13px;

    border: 1px solid rgba(199, 163, 93, .12);
    border-radius: 12px;

    background: #fffbf2;
}

.remark-panel small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
}

.remark-panel p[b-tsn2pem1kj] {
    margin: 7px 0 0;

    color: #60746c;
    font-size: .50rem;
    line-height: 1.7;
}

.four-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-tsn2pem1kj] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.document > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

@media (max-width: 1380px) {
    .payment-photo-upload-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }

    .area-value-grid[b-tsn2pem1kj],
    .boundary-grid[b-tsn2pem1kj],
    .land-info-grid[b-tsn2pem1kj],
    .four-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .google-map-panel iframe[b-tsn2pem1kj],
    .map-preview iframe[b-tsn2pem1kj] {
        height: 300px;
    }
}

@media (max-width: 780px) {
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .area-value-grid[b-tsn2pem1kj],
    .boundary-grid[b-tsn2pem1kj],
    .access-grid[b-tsn2pem1kj],
    .land-info-grid[b-tsn2pem1kj],
    .four-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .land-location-panel[b-tsn2pem1kj] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .land-location-panel a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .area-summary-card[b-tsn2pem1kj] {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
        min-height: 72px;
    }

    .map-heading[b-tsn2pem1kj] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-tsn2pem1kj],
    .map-preview iframe[b-tsn2pem1kj] {
        height: 260px;
    }
}


/* =========================================================
   LANDSMAPS INTERNAL LOOKUP INTEGRATION
   ========================================================= */

.hero-landsmaps-button[b-tsn2pem1kj] {
    min-height: 40px !important;

    border-color: rgba(242, 217, 153, .27) !important;
    border-radius: 11px !important;

    color: #f4dda6 !important;
    background: rgba(242, 217, 153, .08) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .45rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.hero-landsmaps-button:hover[b-tsn2pem1kj] {
    border-color: rgba(242, 217, 153, .46) !important;
    background: rgba(242, 217, 153, .15) !important;
}

.row-landsmaps-action[b-tsn2pem1kj] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(152, 118, 52, .15);
    border-radius: 9px;

    color: #987634;
    background: #fff7e8;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}

.row-landsmaps-action:hover[b-tsn2pem1kj] {
    transform: translateY(-1px);
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

.view-landsmaps-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .18);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .43rem;
    font-weight: 700;
    text-decoration: none;
}

.view-landsmaps-button:hover[b-tsn2pem1kj] {
    border-color: rgba(152, 118, 52, .30);
    background: #fff0d1;
}

@media (max-width: 650px) {
    .view-landsmaps-button[b-tsn2pem1kj] {
        width: 100%;
    }
}


/* =========================================================
   PROPERTY VALUATION PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --valuation-green: var(--theme-primary);
    --valuation-deep: var(--theme-dark);
    --valuation-gold: var(--theme-accent);
    --valuation-blue: #2f789f;
    --valuation-purple: #73569b;
    --valuation-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .28),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(72, 166, 113, .24),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.hero-map-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;

    color: #f4dda6;
    background: rgba(242, 217, 153, .08);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.total[b-tsn2pem1kj] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.appraised[b-tsn2pem1kj] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.market[b-tsn2pem1kj] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.tax[b-tsn2pem1kj] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.draft > span[b-tsn2pem1kj] {
    background: #718078;
}

.status-overview-card.review > span[b-tsn2pem1kj] {
    background: #73569b;
}

.status-overview-card.approved > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.rejected > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.status-overview-card.due > span[b-tsn2pem1kj] {
    background: #b27a25;
}

.status-overview-card.building > span[b-tsn2pem1kj] {
    background: #2f789f;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.valuation-insight-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(320px, .75fr);

    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-tsn2pem1kj] {
    padding: 15px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 18rem),
        #fff;

    box-shadow:
        0 14px 35px rgba(5, 62, 46, .065);
}

.insight-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    padding: 0 9px;
    border-radius: 999px;

    color: var(--theme-primary);
    background: #e7f5ef;

    font-size: .42rem;
    font-weight: 700;
}

.factor-guide-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.factor-guide-grid > div[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);

    min-height: 74px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;

    background: #f9fbfa;
}

.factor-guide-grid > div > span[b-tsn2pem1kj] {
    display: grid;
    width: 40px;
    height: 40px;

    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 11px;

    color: var(--theme-primary);
    background: #e7f5ef;
}

.factor-guide-grid strong[b-tsn2pem1kj] {
    color: #3c5047;
    font-size: .49rem;
}

.factor-guide-grid small[b-tsn2pem1kj] {
    color: #83918c;
    font-size: .39rem;
    line-height: 1.45;
}

.formula-list[b-tsn2pem1kj] {
    display: grid;
    gap: 8px;

    margin-top: 13px;
}

.formula-list > div[b-tsn2pem1kj] {
    min-height: 59px;
    padding: 9px 11px;

    border: 1px solid rgba(152, 118, 52, .10);
    border-radius: 10px;

    background: #fffbf3;
}

.formula-list small[b-tsn2pem1kj] {
    display: block;

    color: #987634;
    font-size: .39rem;
}

.formula-list strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #4c5e56;
    font-size: .47rem;
    line-height: 1.55;
}

/* =========================================================
   FILTER SUMMARY
   ========================================================= */

.filter-summary[b-tsn2pem1kj] {
    display: flex;
    min-height: 56px;

    align-items: center;
    flex-wrap: wrap;
    gap: 7px;

    padding: 8px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 11px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 4px;

    padding: 0 8px;
    border-radius: 999px;

    color: #65766f;
    background: #fff;

    font-size: .40rem;
}

.filter-summary strong[b-tsn2pem1kj] {
    color: var(--theme-primary);
}

/* =========================================================
   TABLE
   ========================================================= */

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);

    min-width: 168px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 52px;
    height: 52px;

    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #83918c;
    font-size: .39rem;
}

.parcel-owner-cell[b-tsn2pem1kj],
.method-year-cell[b-tsn2pem1kj],
.component-value-cell[b-tsn2pem1kj],
.total-value-cell[b-tsn2pem1kj],
.market-tax-cell[b-tsn2pem1kj],
.status-review-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 130px;
    flex-direction: column;
}

.parcel-owner-cell[b-tsn2pem1kj] {
    min-width: 190px;
}

.parcel-owner-cell strong[b-tsn2pem1kj],
.method-year-cell strong[b-tsn2pem1kj],
.component-value-cell strong[b-tsn2pem1kj],
.total-value-cell strong[b-tsn2pem1kj],
.market-tax-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .53rem;
    line-height: 1.48;
}

.parcel-owner-cell small[b-tsn2pem1kj],
.method-year-cell small[b-tsn2pem1kj],
.component-value-cell small[b-tsn2pem1kj],
.total-value-cell small[b-tsn2pem1kj],
.market-tax-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .42rem;
    line-height: 1.5;
}

.parcel-owner-cell em[b-tsn2pem1kj],
.component-value-cell em[b-tsn2pem1kj],
.total-value-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .38rem;
    font-style: normal;
    font-weight: 650;
}

.total-value-cell strong[b-tsn2pem1kj] {
    color: var(--theme-primary);
    font-size: .58rem;
}

.market-tax-cell strong[b-tsn2pem1kj] {
    color: #987634;
}

.method-chip[b-tsn2pem1kj],
.usage-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .39rem;
    font-weight: 700;
}

.method-chip.market-comparison[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.method-chip.official-reference[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.method-chip.cost[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.method-chip.income[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.method-chip.mass-appraisal[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.usage-chip.residential[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.usage-chip.agriculture[b-tsn2pem1kj] {
    color: #43763d;
    background: #edf6e9;
}

.usage-chip.commercial[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.usage-chip.industrial[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.usage-chip.public[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.usage-chip.vacant[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.draft[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.surveyed[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.calculated[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.status-chip.under-review[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.approved[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.rejected[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.cancelled[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

/* =========================================================
   SOURCE PARCEL & FORM
   ========================================================= */

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-parcel-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 13px;
    overflow: hidden;

    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-parcel-photo[b-tsn2pem1kj] {
    display: grid;
    min-height: 210px;
    overflow: hidden;

    place-items: center;
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-parcel-photo button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-parcel-photo img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    min-height: 210px;

    object-fit: cover;
}

.source-parcel-content[b-tsn2pem1kj] {
    min-width: 0;
}

.source-title-row[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .45rem;
}

.source-data-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-tsn2pem1kj] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.source-data-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    gap: 5px;

    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-actions a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 33px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-tsn2pem1kj] {
    color: #987634;
    border-color: rgba(152, 118, 52, .14);
    background: #fff9ed;
}

.source-actions a:nth-child(3)[b-tsn2pem1kj] {
    color: #2f789f;
    border-color: rgba(47, 120, 159, .14);
    background: #f4fafc;
}

.source-map-preview[b-tsn2pem1kj] {
    overflow: hidden;

    margin: -4px 0 16px;
    border: 1px solid rgba(47, 120, 159, .11);
    border-radius: 14px;

    background: #edf2ef;
}

.source-map-preview iframe[b-tsn2pem1kj] {
    display: block;
    width: 100%;
    height: 280px;

    border: 0;
}

.calculation-preview-panel[b-tsn2pem1kj] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .12),
            transparent 18rem),
        #fffbf3;
}

.calculation-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.calculation-heading small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.calculation-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #405249;
    font-size: .69rem;
}

.calculation-heading > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #987634;
    background: #fff1d4;

    font-size: .40rem;
    font-weight: 700;
}

.calculation-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.calculation-grid > div[b-tsn2pem1kj] {
    min-height: 82px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .08);
    border-radius: 11px;

    background: #fff;
}

.calculation-grid > div.highlight[b-tsn2pem1kj] {
    color: #fff;
    border-color: transparent;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    box-shadow:
        0 10px 22px rgba(5, 62, 46, .16);
}

.calculation-grid span[b-tsn2pem1kj] {
    display: block;

    color: #8b7b5b;
    font-size: .39rem;
}

.calculation-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 7px;

    color: #3f5249;
    font-size: .66rem;
}

.calculation-grid small[b-tsn2pem1kj] {
    display: block;
    margin-top: 2px;

    color: #8a9791;
    font-size: .36rem;
}

.calculation-grid .highlight span[b-tsn2pem1kj],
.calculation-grid .highlight strong[b-tsn2pem1kj],
.calculation-grid .highlight small[b-tsn2pem1kj] {
    color: #fff;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

/* =========================================================
   VIEW
   ========================================================= */

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1180px, calc(100vw - 28px)) !important;
}

.view-landsmaps-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(152, 118, 52, .16);
    border-radius: 10px;

    color: #987634;
    background: #fff8e9;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    text-decoration: none;
}

.valuation-identity-banner[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        70px
        repeat(4, minmax(0, 1fr));

    gap: 1px;
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 16px;

    background: rgba(10, 114, 87, .10);

    box-shadow:
        0 12px 30px rgba(5, 62, 46, .07);
}

.valuation-identity-banner > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 100px;

    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;

    padding: 12px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .08),
            transparent 12rem),
        #fff;
}

.valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
    color: #efdca8;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.valuation-banner-icon .mud-icon-root[b-tsn2pem1kj] {
    font-size: 1.7rem;
}

.valuation-identity-banner small[b-tsn2pem1kj] {
    color: var(--theme-muted);
    font-size: .42rem;
}

.valuation-identity-banner strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #355047;
    font-size: .53rem;
    line-height: 1.45;
    text-align: center;
}

.owner-location-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    gap: 10px;
    align-items: center;

    margin-top: 13px;
    padding: 13px;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 120, 159, .10),
            transparent 18rem),
        #f5fafc;
}

.owner-location-panel > span[b-tsn2pem1kj] {
    display: grid;
    width: 54px;
    height: 54px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.owner-location-panel small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .07em;
}

.owner-location-panel h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #344a42;
    font-size: .67rem;
}

.owner-location-panel p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: var(--theme-muted);
    font-size: .48rem;
    line-height: 1.55;
}

.owner-location-panel b[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #2f789f;
    font-size: .42rem;
}

.owner-location-panel a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 38px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 10px;
    border: 1px solid rgba(47, 120, 159, .18);
    border-radius: 10px;

    color: #2f789f;
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 650;
    text-decoration: none;
}

.google-map-panel[b-tsn2pem1kj] {
    overflow: hidden;

    margin-top: 13px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 14px;

    background: #fff;
}

.map-heading[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 11px 13px;
}

.map-heading small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.map-heading h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: #34483f;
    font-size: .69rem;
}

.map-heading > span[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .39rem;
    font-weight: 700;
}

.google-map-panel iframe[b-tsn2pem1kj] {
    display: block;
    width: 100%;
    height: 350px;

    border: 0;
}

.value-highlight-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.value-highlight-grid article[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);

    min-height: 88px;
    align-items: center;
    gap: 8px;

    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .08);
    border-radius: 12px;

    background: #fff;
}

.value-highlight-grid article > span[b-tsn2pem1kj] {
    display: grid;
    width: 44px;
    height: 44px;

    place-items: center;
    border-radius: 12px;
}

.value-highlight-grid .land-value > span[b-tsn2pem1kj] {
    color: #4d7c45;
    background: #edf6e9;
}

.value-highlight-grid .building-value > span[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.value-highlight-grid .total-appraised > span[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);
}

.value-highlight-grid .market-value > span[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.value-highlight-grid .tax-value > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

.value-highlight-grid div[b-tsn2pem1kj] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.value-highlight-grid small[b-tsn2pem1kj] {
    color: #87958f;
    font-size: .38rem;
}

.value-highlight-grid strong[b-tsn2pem1kj] {
    margin-top: 4px;

    overflow: hidden;
    color: #354940;
    font-size: .58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value-highlight-grid em[b-tsn2pem1kj] {
    color: #75867f;
    font-size: .36rem;
    font-style: normal;
}

.factor-detail-panel[b-tsn2pem1kj],
.building-detail-panel[b-tsn2pem1kj],
.comparable-panel[b-tsn2pem1kj],
.workflow-panel[b-tsn2pem1kj] {
    margin-top: 13px;
    padding: 14px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .06),
            transparent 18rem),
        #f9fbfa;
}

.factor-detail-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.factor-detail-grid > div[b-tsn2pem1kj],
.building-detail-grid > div[b-tsn2pem1kj],
.workflow-grid > div[b-tsn2pem1kj] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.factor-detail-grid span[b-tsn2pem1kj],
.building-detail-grid span[b-tsn2pem1kj],
.workflow-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.factor-detail-grid strong[b-tsn2pem1kj],
.building-detail-grid strong[b-tsn2pem1kj],
.workflow-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .48rem;
    line-height: 1.45;
}

.building-detail-grid[b-tsn2pem1kj],
.workflow-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 11px;
}

.comparable-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    margin-top: 11px;
}

.comparable-grid > div[b-tsn2pem1kj] {
    min-height: 90px;
    padding: 10px;
    border: 1px solid rgba(47, 120, 159, .08);
    border-radius: 10px;

    background: #fff;
}

.comparable-grid span[b-tsn2pem1kj] {
    display: block;

    color: #2f789f;
    font-size: .39rem;
    font-weight: 700;
}

.comparable-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 6px;

    color: #465951;
    font-size: .47rem;
    line-height: 1.58;
}

.comparable-empty[b-tsn2pem1kj] {
    grid-column: 1 / -1;

    display: grid;
    min-height: 90px;

    place-items: center;

    color: #84928d;
}

.rejection-note[b-tsn2pem1kj],
.internal-note[b-tsn2pem1kj] {
    margin-top: 9px;
    padding: 10px;
    border-radius: 10px;
}

.rejection-note[b-tsn2pem1kj] {
    border: 1px solid rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.internal-note[b-tsn2pem1kj] {
    border: 1px solid rgba(152, 118, 52, .12);
    background: #fffbf3;
}

.rejection-note strong[b-tsn2pem1kj] {
    color: #ad4037;
    font-size: .43rem;
}

.internal-note strong[b-tsn2pem1kj] {
    color: #987634;
    font-size: .43rem;
}

.rejection-note p[b-tsn2pem1kj],
.internal-note p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: #5f7169;
    font-size: .47rem;
    line-height: 1.65;
}

.five-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;
}

.attachment-card.land > span[b-tsn2pem1kj] {
    color: #4d7c45;
    background: #edf6e9;
}

.attachment-card.deed > span[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.map > span[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.attachment-card.survey > span[b-tsn2pem1kj] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.attachment-card.report > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .valuation-insight-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-data-grid[b-tsn2pem1kj],
    .calculation-grid[b-tsn2pem1kj],
    .factor-detail-grid[b-tsn2pem1kj],
    .building-detail-grid[b-tsn2pem1kj],
    .workflow-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .value-highlight-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .five-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }

    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            70px repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .factor-guide-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .source-parcel-panel[b-tsn2pem1kj] {
        grid-template-columns:
            190px minmax(0, 1fr);
    }

    .comparable-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }
}

@media (max-width: 780px) {
    .factor-guide-grid[b-tsn2pem1kj],
    .source-data-grid[b-tsn2pem1kj],
    .calculation-grid[b-tsn2pem1kj],
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .factor-detail-grid[b-tsn2pem1kj],
    .building-detail-grid[b-tsn2pem1kj],
    .workflow-grid[b-tsn2pem1kj],
    .value-highlight-grid[b-tsn2pem1kj],
    .five-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .source-parcel-panel[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-parcel-photo[b-tsn2pem1kj] {
        max-height: 300px;
    }

    .owner-location-panel[b-tsn2pem1kj] {
        grid-template-columns:
            50px minmax(0, 1fr);
    }

    .owner-location-panel a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .source-title-row[b-tsn2pem1kj],
    .calculation-heading[b-tsn2pem1kj],
    .map-heading[b-tsn2pem1kj] {
        align-items: flex-start;
        flex-direction: column;
    }

    .google-map-panel iframe[b-tsn2pem1kj],
    .source-map-preview iframe[b-tsn2pem1kj] {
        height: 280px;
    }
}

@media (max-width: 560px) {
    .valuation-identity-banner[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .valuation-identity-banner .valuation-banner-icon[b-tsn2pem1kj] {
        min-height: 72px;
    }

    .factor-guide-grid > div[b-tsn2pem1kj] {
        grid-template-columns:
            38px minmax(0, 1fr);
    }

    .source-actions[b-tsn2pem1kj] {
        flex-direction: column;
    }

    .source-actions a[b-tsn2pem1kj],
    .view-landsmaps-button[b-tsn2pem1kj] {
        width: 100%;
    }

    .google-map-panel iframe[b-tsn2pem1kj],
    .source-map-preview iframe[b-tsn2pem1kj] {
        height: 250px;
    }
}


/* =========================================================
   PROPERTY TAX ASSESSMENT NOTICE PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --tax-green: var(--theme-primary);
    --tax-deep: var(--theme-dark);
    --tax-gold: var(--theme-accent);
    --tax-blue: #2f789f;
    --tax-purple: #73569b;
    --tax-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(
            circle at 88% 4%,
            rgba(199, 163, 93, .29),
            transparent 30%),
        radial-gradient(
            circle at 7% 112%,
            rgba(72, 166, 113, .24),
            transparent 36%),
        linear-gradient(
            138deg,
            #155448 0%,
            #0a3c31 56%,
            #05271f 100%) !important;
}

.hero-valuation-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 40px;

    align-items: center;
    justify-content: center;
    gap: 6px;

    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;

    color: #f4dda6;
    background: rgba(242, 217, 153, .08);

    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.notices[b-tsn2pem1kj] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.tax[b-tsn2pem1kj] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.paid[b-tsn2pem1kj] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.balance[b-tsn2pem1kj] {
    --summary-accent: #b54d43;
    --summary-soft: #fff0ee;
    --summary-border: rgba(181, 77, 67, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.draft > span[b-tsn2pem1kj] {
    background: #718078;
}

.status-overview-card.issued > span[b-tsn2pem1kj] {
    background: #b27a25;
}

.status-overview-card.acknowledged > span[b-tsn2pem1kj] {
    background: #73569b;
}

.status-overview-card.partial > span[b-tsn2pem1kj] {
    background: #2f789f;
}

.status-overview-card.paid > span[b-tsn2pem1kj] {
    background: #397a4c;
}

.status-overview-card.overdue > span[b-tsn2pem1kj] {
    background: #b54d43;
}

.status-overview-card.objection > span[b-tsn2pem1kj] {
    background: #7b5a36;
}

/* =========================================================
   INSIGHTS
   ========================================================= */

.tax-insight-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(320px, .8fr);

    gap: 14px;
    margin-top: 14px;
}

.calculation-guide-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;
    margin-top: 13px;
}

.calculation-guide-grid > div[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);

    min-height: 78px;
    align-items: center;
    gap: 8px;

    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;

    background: #f9fbfa;
}

.calculation-guide-grid > div > span[b-tsn2pem1kj] {
    display: grid;
    width: 38px;
    height: 38px;

    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 12px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    font-size: .52rem;
    font-weight: 800;
}

.calculation-guide-grid strong[b-tsn2pem1kj] {
    color: #3c5047;
    font-size: .48rem;
}

.calculation-guide-grid small[b-tsn2pem1kj] {
    color: #83918c;
    font-size: .38rem;
    line-height: 1.45;
}

.mock-rate-warning[b-tsn2pem1kj] {
    margin-top: 11px !important;

    font-family: 'Kanit', sans-serif;
    font-size: .42rem !important;
    line-height: 1.65;
}

.collection-progress[b-tsn2pem1kj] {
    margin-top: 13px;
}

.progress-track[b-tsn2pem1kj] {
    height: 15px;
    overflow: hidden;

    border-radius: 999px;
    background: #edf2ef;

    box-shadow:
        inset 0 1px 3px rgba(5, 62, 46, .12);
}

.progress-track > span[b-tsn2pem1kj] {
    display: block;
    height: 100%;

    border-radius: inherit;
    background:
        linear-gradient(
            90deg,
            #178466,
            #38b886);

    transition: width .25s ease;
}

.collection-metrics[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
    margin-top: 12px;
}

.collection-metrics > div[b-tsn2pem1kj] {
    min-height: 65px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #f9fbfa;
}

.collection-metrics small[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .39rem;
}

.collection-metrics strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 6px;

    color: #354940;
    font-size: .55rem;
}

/* =========================================================
   TABLE
   ========================================================= */

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);

    min-width: 174px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 52px;
    height: 52px;

    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;

    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;

    color: var(--theme-primary);
    background: #edf7f3;

    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #987634;
    font-size: .39rem;
}

.taxpayer-cell[b-tsn2pem1kj],
.year-due-cell[b-tsn2pem1kj],
.property-value-cell[b-tsn2pem1kj],
.tax-amount-cell[b-tsn2pem1kj],
.payment-cell[b-tsn2pem1kj],
.status-objection-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.taxpayer-cell[b-tsn2pem1kj] {
    min-width: 190px;
}

.taxpayer-cell strong[b-tsn2pem1kj],
.year-due-cell strong[b-tsn2pem1kj],
.property-value-cell strong[b-tsn2pem1kj],
.tax-amount-cell strong[b-tsn2pem1kj],
.payment-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;

    color: #3c5047;
    font-size: .52rem;
    line-height: 1.48;
}

.taxpayer-cell small[b-tsn2pem1kj],
.year-due-cell small[b-tsn2pem1kj],
.property-value-cell small[b-tsn2pem1kj],
.tax-amount-cell small[b-tsn2pem1kj],
.payment-cell small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #84928d;
    font-size: .41rem;
    line-height: 1.5;
}

.taxpayer-cell em[b-tsn2pem1kj],
.property-value-cell em[b-tsn2pem1kj],
.tax-amount-cell em[b-tsn2pem1kj],
.payment-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    color: #2f789f;
    background: #e8f3f8;

    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.tax-amount-cell strong[b-tsn2pem1kj] {
    color: #987634;
    font-size: .57rem;
}

.payment-cell strong[b-tsn2pem1kj] {
    color: var(--theme-primary);
}

.payment-cell small[b-tsn2pem1kj] {
    color: #b54d43;
}

.status-objection-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.status-chip.issued[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.status-chip.acknowledged[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.status-chip.partial[b-tsn2pem1kj] {
    color: #2f789f;
    background: #e8f3f8;
}

.status-chip.paid[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.overdue[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.objection-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .37rem;
    font-weight: 700;
}

.objection-chip.submitted[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.objection-chip.under-review[b-tsn2pem1kj] {
    color: #6c4e96;
    background: #f0eafb;
}

.objection-chip.accepted[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.objection-chip.rejected[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.objection-chip.withdrawn[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.due-badge[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 22px;

    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;

    font-size: .37rem;
    font-style: normal;
    font-weight: 700;
}

.due-badge.normal[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.due-badge.urgent[b-tsn2pem1kj] {
    color: #9d671c;
    background: #fff0d8;
}

.due-badge.overdue[b-tsn2pem1kj] {
    color: #ad4037;
    background: #fff0ee;
}

.due-badge.paid[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.due-badge.none[b-tsn2pem1kj] {
    color: #687872;
    background: #edf1ef;
}

.row-action.print[b-tsn2pem1kj] {
    color: #73569b !important;
    background: #f0eafb !important;
}

.row-map-action[b-tsn2pem1kj] {
    display: inline-grid;
    width: 32px;
    height: 32px;

    place-items: center;
    border: 1px solid rgba(47, 120, 159, .14);
    border-radius: 9px;

    color: #2f789f;
    background: #edf6fb;

    text-decoration: none;
}

/* =========================================================
   SOURCE & CALCULATION FORM
   ========================================================= */

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-assessment-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);

    gap: 13px;
    overflow: hidden;

    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(10, 114, 87, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-tsn2pem1kj] {
    display: grid;
    min-height: 210px;
    overflow: hidden;

    place-items: center;
    border-radius: 12px;

    color: var(--theme-primary);
    background: #eaf4ef;
}

.source-photo button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;

    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.source-photo img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    min-height: 210px;

    object-fit: cover;
}

.source-content[b-tsn2pem1kj] {
    min-width: 0;
}

.source-title-row[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.source-title-row small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-title-row h3[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .70rem;
}

.source-title-row p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #7c8d86;
    font-size: .45rem;
}

.approved-source-chip[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 28px;

    align-items: center;
    gap: 5px;

    padding: 0 8px;
    border-radius: 999px;

    color: #34734b;
    background: #e7f5ec;

    font-size: .40rem;
    font-weight: 700;
    white-space: nowrap;
}

.source-data-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 7px;
    margin-top: 12px;
}

.source-data-grid > div[b-tsn2pem1kj] {
    min-height: 64px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 10px;

    background: #fff;
}

.source-data-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .38rem;
}

.source-data-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .47rem;
    line-height: 1.45;
}

.source-address[b-tsn2pem1kj] {
    display: flex;
    align-items: flex-start;
    gap: 5px;

    margin-top: 9px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;

    font-size: .42rem;
    line-height: 1.55;
}

.source-actions[b-tsn2pem1kj] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin-top: 9px;
}

.source-actions a[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 33px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #fff;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.source-actions a:nth-child(2)[b-tsn2pem1kj] {
    color: #2f789f;
    border-color: rgba(47, 120, 159, .14);
    background: #f4fafc;
}

.source-actions a:nth-child(3)[b-tsn2pem1kj] {
    color: #987634;
    border-color: rgba(152, 118, 52, .14);
    background: #fff9ed;
}

.source-actions a:nth-child(4)[b-tsn2pem1kj] {
    color: #73569b;
    border-color: rgba(115, 86, 155, .14);
    background: #f8f3ff;
}

.payment-calculation-preview[b-tsn2pem1kj] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .12),
            transparent 18rem),
        #fffbf3;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;
}

/* =========================================================
   VIEW MODAL & PRINTABLE NOTICE
   ========================================================= */

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1180px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 24px);
    overflow: hidden;
}

.view-modal-toolbar[b-tsn2pem1kj] {
    display: flex;
    min-height: 66px;

    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 10px 13px;
    border-bottom: 1px solid rgba(10, 114, 87, .08);

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(199, 163, 93, .09),
            transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-modal-toolbar > div:last-child[b-tsn2pem1kj] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.view-modal-toolbar small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.view-modal-toolbar h2[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.view-map-button[b-tsn2pem1kj],
.view-landsmaps-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 36px;

    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 9px;
    border-radius: 9px;

    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.view-map-button[b-tsn2pem1kj] {
    color: #2f789f;
    border: 1px solid rgba(47, 120, 159, .14);
    background: #edf6fb;
}

.view-landsmaps-button[b-tsn2pem1kj] {
    color: #987634;
    border: 1px solid rgba(152, 118, 52, .15);
    background: #fff7e8;
}

.view-print-button[b-tsn2pem1kj] {
    color: #fff !important;
    border-radius: 9px !important;
    background:
        linear-gradient(
            145deg,
            #73569b,
            #523976) !important;

    font-family: 'Kanit', sans-serif !important;
    font-size: .41rem !important;
    text-transform: none !important;
}

.view-scroll[b-tsn2pem1kj] {
    max-height: calc(100vh - 94px);
    overflow: auto;
    padding: 16px;

    background: #e9efec;
}

.print-notice[b-tsn2pem1kj] {
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 34px 38px;

    border: 1px solid rgba(10, 72, 56, .12);
    border-radius: 4px;

    color: #263c33;
    background: #fff;

    font-family: 'Kanit', sans-serif;

    box-shadow:
        0 22px 55px rgba(5, 62, 46, .14);
}

.notice-header[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) 180px;

    align-items: center;
    gap: 14px;

    padding-bottom: 18px;
    border-bottom: 3px double var(--theme-primary);
}

.municipal-seal[b-tsn2pem1kj] {
    display: grid;
    width: 78px;
    height: 78px;

    place-items: center;
    border: 3px solid var(--theme-primary);
    border-radius: 50%;

    color: var(--theme-primary);
    background: #f3faf7;
}

.municipal-seal .mud-icon-root[b-tsn2pem1kj] {
    font-size: 2rem;
}

.notice-organization[b-tsn2pem1kj] {
    text-align: center;
}

.notice-organization small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .11em;
}

.notice-organization h1[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: #173e35;
    font-size: 1.25rem;
    line-height: 1.25;
}

.notice-organization p[b-tsn2pem1kj] {
    margin: 5px 0 0;

    color: #64766e;
    font-size: .50rem;
}

.notice-number[b-tsn2pem1kj] {
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .15);
    border-radius: 10px;

    background: #f5faf8;
    text-align: center;
}

.notice-number span[b-tsn2pem1kj],
.notice-number small[b-tsn2pem1kj] {
    display: block;

    color: #778980;
    font-size: .40rem;
}

.notice-number strong[b-tsn2pem1kj] {
    display: block;
    margin: 5px 0;

    color: var(--theme-primary);
    font-size: .58rem;
}

.notice-status-strip[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        minmax(130px, .7fr)
        repeat(3, minmax(0, 1fr));

    gap: 8px;
    align-items: center;

    margin-top: 14px;
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.notice-status-strip > div[b-tsn2pem1kj] {
    padding-left: 9px;
    border-left: 1px solid rgba(10, 114, 87, .10);
}

.notice-status-strip > div span[b-tsn2pem1kj] {
    display: block;

    color: #83918b;
    font-size: .38rem;
}

.notice-status-strip > div strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #354940;
    font-size: .46rem;
}

.notice-recipient[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 150px;

    gap: 10px;
    align-items: center;

    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 11px;

    background: #f5fafc;
}

.recipient-icon[b-tsn2pem1kj] {
    display: grid;
    width: 58px;
    height: 58px;

    place-items: center;
    border-radius: 16px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #3a86af,
            #245f82);
}

.notice-recipient small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .40rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.notice-recipient h2[b-tsn2pem1kj] {
    margin: 3px 0 0;

    color: var(--theme-ink);
    font-size: .72rem;
}

.notice-recipient p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #6f8078;
    font-size: .43rem;
}

.recipient-status[b-tsn2pem1kj] {
    padding: 9px;
    border-radius: 9px;

    background: #fff;
    text-align: center;
}

.recipient-status span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.recipient-status strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;

    color: #73569b;
    font-size: .45rem;
}

.notice-property[b-tsn2pem1kj],
.notice-calculation[b-tsn2pem1kj],
.notice-payment[b-tsn2pem1kj],
.notice-officers[b-tsn2pem1kj] {
    margin-top: 16px;
}

.section-title[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);

    align-items: center;
    gap: 8px;

    margin-bottom: 10px;
}

.section-title > span[b-tsn2pem1kj] {
    display: grid;
    width: 34px;
    height: 34px;

    place-items: center;
    border-radius: 10px;

    color: #fff;
    background:
        linear-gradient(
            145deg,
            #178466,
            #0a5543);

    font-size: .48rem;
    font-weight: 800;
}

.section-title small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .39rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.section-title h3[b-tsn2pem1kj] {
    margin: 2px 0 0;

    color: var(--theme-ink);
    font-size: .61rem;
}

.property-photo-data[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);

    gap: 10px;
}

.notice-photo[b-tsn2pem1kj] {
    display: grid;
    min-height: 178px;
    overflow: hidden;

    place-items: center;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    color: var(--theme-primary);
    background: #edf5f1;
}

.notice-photo img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    min-height: 178px;

    object-fit: cover;
}

.property-data-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
}

.property-data-grid > div[b-tsn2pem1kj] {
    min-height: 80px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;

    background: #f9fbfa;
}

.property-data-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.property-data-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .45rem;
    line-height: 1.48;
}

.notice-address[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;

    gap: 7px;
    align-items: center;

    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;

    color: #2f789f;
    background: #f4fafc;
}

.notice-address div[b-tsn2pem1kj] {
    display: flex;
    flex-direction: column;
}

.notice-address span[b-tsn2pem1kj] {
    font-size: .37rem;
}

.notice-address strong[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #455950;
    font-size: .44rem;
}

.notice-address small[b-tsn2pem1kj] {
    margin-top: 3px;

    color: #2f789f;
    font-size: .36rem;
}

.notice-address a[b-tsn2pem1kj] {
    padding: 6px 8px;
    border-radius: 7px;

    color: #2f789f;
    background: #fff;

    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.tax-calculation-table[b-tsn2pem1kj] {
    overflow: hidden;

    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 10px;
}

.tax-calculation-table > div[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;

    min-height: 42px;
    align-items: center;

    border-bottom: 1px solid rgba(10, 114, 87, .07);
}

.tax-calculation-table > div:last-child[b-tsn2pem1kj] {
    border-bottom: 0;
}

.tax-calculation-table span[b-tsn2pem1kj],
.tax-calculation-table strong[b-tsn2pem1kj] {
    padding: 8px 10px;

    font-size: .43rem;
}

.tax-calculation-table strong[b-tsn2pem1kj] {
    border-left: 1px solid rgba(10, 114, 87, .07);

    color: #354940;
    text-align: right;
}

.tax-calculation-table .table-header[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #17725a,
            #0a5543);
}

.tax-calculation-table .table-header span[b-tsn2pem1kj] {
    font-weight: 700;
}

.tax-calculation-table .subtotal[b-tsn2pem1kj] {
    background: #f4faf7;
}

.tax-calculation-table .grand-total[b-tsn2pem1kj] {
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #987634,
            #765520);
}

.tax-calculation-table .grand-total strong[b-tsn2pem1kj] {
    color: #fff;
    border-left-color: rgba(255, 255, 255, .15);

    font-size: .55rem;
}

.amount-in-words[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;

    gap: 9px;
    align-items: center;

    margin-top: 8px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .12);
    border-radius: 9px;

    background: #fffbf3;
}

.amount-in-words span[b-tsn2pem1kj] {
    color: #987634;
    font-size: .41rem;
    font-weight: 700;
}

.amount-in-words strong[b-tsn2pem1kj] {
    color: #6e5225;
    font-size: .58rem;
    text-align: center;
}

.amount-in-words small[b-tsn2pem1kj] {
    color: #9b8b6a;
    font-size: .35rem;
}

.payment-summary-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 8px;
}

.payment-summary-grid article[b-tsn2pem1kj] {
    min-height: 87px;
    padding: 11px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;

    background: #f9fbfa;
}

.payment-summary-grid article.paid[b-tsn2pem1kj] {
    border-color: rgba(47, 120, 159, .12);
    background: #f4fafc;
}

.payment-summary-grid article.balance[b-tsn2pem1kj] {
    border-color: rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.payment-summary-grid span[b-tsn2pem1kj] {
    display: block;

    color: #84928c;
    font-size: .39rem;
}

.payment-summary-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 7px;

    color: #354940;
    font-size: .68rem;
}

.payment-summary-grid article.paid strong[b-tsn2pem1kj] {
    color: #2f789f;
}

.payment-summary-grid article.balance strong[b-tsn2pem1kj] {
    color: #b54d43;
}

.payment-summary-grid small[b-tsn2pem1kj] {
    display: block;

    color: #798a83;
    font-size: .36rem;
}

.payment-info-grid[b-tsn2pem1kj],
.officer-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 7px;
    margin-top: 8px;
}

.payment-info-grid > div[b-tsn2pem1kj],
.officer-grid > div[b-tsn2pem1kj] {
    min-height: 67px;
    padding: 9px;

    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;

    background: #f9fbfa;
}

.payment-info-grid span[b-tsn2pem1kj],
.officer-grid span[b-tsn2pem1kj] {
    display: block;

    color: #87958f;
    font-size: .37rem;
}

.payment-info-grid strong[b-tsn2pem1kj],
.officer-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #354940;
    font-size: .44rem;
}

.officer-grid[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.officer-grid > div[b-tsn2pem1kj] {
    min-height: 110px;
    padding-top: 18px;

    text-align: center;
}

.officer-grid > div[b-tsn2pem1kj]::before {
    display: block;
    width: 80%;
    height: 1px;

    margin: 0 auto 11px;

    background: rgba(48, 71, 61, .28);
    content: "";
}

.officer-grid em[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;

    color: #87958f;
    font-size: .35rem;
    font-style: normal;
}

.notice-warning[b-tsn2pem1kj] {
    margin-top: 11px;
    padding: 10px;

    border-radius: 9px;
}

.notice-warning.cancelled[b-tsn2pem1kj] {
    border: 1px solid rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.notice-warning.remark[b-tsn2pem1kj] {
    border: 1px solid rgba(152, 118, 52, .12);
    background: #fffbf3;
}

.notice-warning strong[b-tsn2pem1kj] {
    color: #704f2c;
    font-size: .42rem;
}

.notice-warning p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #5e7068;
    font-size: .42rem;
    line-height: 1.6;
}

.notice-footer[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px;

    gap: 12px;
    align-items: center;

    margin-top: 16px;
    padding-top: 14px;
    border-top: 3px double var(--theme-primary);
}

.notice-footer strong[b-tsn2pem1kj] {
    color: var(--theme-primary);
    font-size: .43rem;
}

.notice-footer p[b-tsn2pem1kj] {
    margin: 4px 0 0;

    color: #62756c;
    font-size: .39rem;
    line-height: 1.6;
}

.notice-qr-placeholder[b-tsn2pem1kj] {
    display: grid;
    min-height: 90px;

    place-items: center;
    border: 1px dashed rgba(10, 114, 87, .24);
    border-radius: 9px;

    color: var(--theme-primary);
    background: #f5faf8;
}

.notice-qr-placeholder span[b-tsn2pem1kj] {
    font-size: .33rem;
    font-weight: 700;
}

.mock-notice[b-tsn2pem1kj] {
    margin-top: 12px;
    padding: 6px;

    border-radius: 7px;

    color: #ad4037;
    background: #fff0ee;

    font-size: .35rem;
    font-weight: 700;
    text-align: center;
}

.google-map-panel[b-tsn2pem1kj] {
    overflow: hidden;

    width: min(900px, 100%);
    margin: 14px auto 0;

    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 14px;

    background: #fff;
}

.google-map-panel iframe[b-tsn2pem1kj] {
    display: block;
    width: 100%;
    height: 350px;

    border: 0;
}

.payment-view-modal .history-panel[b-tsn2pem1kj],
.payment-view-modal .attachment-panel[b-tsn2pem1kj] {
    width: min(900px, 100%);
    margin-right: auto;
    margin-left: auto;
}

.seven-columns[b-tsn2pem1kj] {
    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.notice > span[b-tsn2pem1kj] {
    color: #987634;
    background: #fff4df;
}

.attachment-card.payment > span[b-tsn2pem1kj] {
    color: #34734b;
    background: #e7f5ec;
}

.attachment-card.valuation > span[b-tsn2pem1kj] {
    color: #73569b;
    background: #f0eafb;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .tax-insight-grid[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .calculation-guide-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .source-data-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .seven-columns[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .source-assessment-panel[b-tsn2pem1kj] {
        grid-template-columns: 190px minmax(0, 1fr);
    }

    .notice-header[b-tsn2pem1kj] {
        grid-template-columns: 70px minmax(0, 1fr);
    }

    .notice-number[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .notice-status-strip[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .property-photo-data[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
    }

    .property-data-grid[b-tsn2pem1kj] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 780px) {
    .calculation-guide-grid[b-tsn2pem1kj],
    .collection-metrics[b-tsn2pem1kj],
    .source-data-grid[b-tsn2pem1kj],
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .payment-summary-grid[b-tsn2pem1kj],
    .payment-info-grid[b-tsn2pem1kj],
    .officer-grid[b-tsn2pem1kj],
    .seven-columns[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }

    .source-assessment-panel[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-title-row[b-tsn2pem1kj],
    .calculation-heading[b-tsn2pem1kj],
    .view-modal-toolbar[b-tsn2pem1kj] {
        align-items: flex-start;
        flex-direction: column;
    }

    .view-modal-toolbar > div:last-child[b-tsn2pem1kj] {
        width: 100%;
    }

    .print-notice[b-tsn2pem1kj] {
        padding: 22px 18px;
    }

    .notice-recipient[b-tsn2pem1kj] {
        grid-template-columns: 52px minmax(0, 1fr);
    }

    .recipient-status[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .tax-calculation-table > div[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr) 150px;
    }

    .notice-address[b-tsn2pem1kj] {
        grid-template-columns: 28px minmax(0, 1fr);
    }

    .notice-address a[b-tsn2pem1kj] {
        grid-column: 1 / -1;
    }

    .notice-footer[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
    }

    .notice-qr-placeholder[b-tsn2pem1kj] {
        width: 120px;
    }
}

@media (max-width: 560px) {
    .calculation-guide-grid[b-tsn2pem1kj],
    .property-data-grid[b-tsn2pem1kj],
    .notice-status-strip[b-tsn2pem1kj] {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .source-actions[b-tsn2pem1kj] {
        flex-direction: column;
    }

    .source-actions a[b-tsn2pem1kj],
    .view-map-button[b-tsn2pem1kj],
    .view-landsmaps-button[b-tsn2pem1kj] {
        width: 100%;
    }

    .notice-header[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .municipal-seal[b-tsn2pem1kj] {
        margin: 0 auto;
    }

    .tax-calculation-table > div[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
    }

    .tax-calculation-table strong[b-tsn2pem1kj] {
        border-top: 1px solid rgba(10, 114, 87, .07);
        border-left: 0;
    }

    .amount-in-words[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .google-map-panel iframe[b-tsn2pem1kj],
    .source-map-preview iframe[b-tsn2pem1kj] {
        height: 250px;
    }
}

/* =========================================================
   PRINT
   ========================================================= */

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm;
    }

    body *[b-tsn2pem1kj] {
        visibility: hidden !important;
    }

    #tax-assessment-print-area[b-tsn2pem1kj],
    #tax-assessment-print-area *[b-tsn2pem1kj] {
        visibility: visible !important;
    }

    #tax-assessment-print-area[b-tsn2pem1kj] {
        position: absolute;
        inset: 0 auto auto 0;

        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;

        border: 0;
        border-radius: 0;

        box-shadow: none;
    }

    .no-print[b-tsn2pem1kj] {
        display: none !important;
    }

    .modal-backdrop[b-tsn2pem1kj],
    .payment-view-modal[b-tsn2pem1kj],
    .view-scroll[b-tsn2pem1kj] {
        position: static !important;

        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;

        padding: 0 !important;
        border: 0 !important;
        background: #fff !important;

        box-shadow: none !important;
    }

    .notice-header[b-tsn2pem1kj],
    .notice-status-strip[b-tsn2pem1kj],
    .notice-recipient[b-tsn2pem1kj],
    .notice-property[b-tsn2pem1kj],
    .notice-calculation[b-tsn2pem1kj],
    .notice-payment[b-tsn2pem1kj],
    .notice-officers[b-tsn2pem1kj],
    .notice-footer[b-tsn2pem1kj] {
        break-inside: avoid;
    }

    .mock-notice[b-tsn2pem1kj] {
        border: 1px solid #999;
        color: #555;
        background: #fff;
    }
}


/* =========================================================
   PROPERTY TAX PAYMENT PREMIUM EXTENSIONS
   ========================================================= */

.payment-page[b-tsn2pem1kj] {
    --payment-green: var(--theme-primary);
    --payment-deep: var(--theme-dark);
    --payment-gold: var(--theme-accent);
    --payment-blue: #2f789f;
    --payment-purple: #73569b;
    --payment-red: #b54d43;
}

.payment-hero[b-tsn2pem1kj] {
    background:
        radial-gradient(circle at 88% 4%, rgba(199, 163, 93, .30), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72, 166, 113, .25), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%) !important;
}

.hero-assessment-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 11px;
    border: 1px solid rgba(242, 217, 153, .24);
    border-radius: 11px;
    color: #f4dda6;
    background: rgba(242, 217, 153, .08);
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.summary-card.transactions[b-tsn2pem1kj] {
    --summary-accent: var(--theme-primary);
    --summary-soft: #e7f5ef;
    --summary-border: rgba(10, 114, 87, .20);
}

.summary-card.collected[b-tsn2pem1kj] {
    --summary-accent: #987634;
    --summary-soft: #fff4df;
    --summary-border: rgba(152, 118, 52, .20);
}

.summary-card.digital[b-tsn2pem1kj] {
    --summary-accent: #2f789f;
    --summary-soft: #e8f3f8;
    --summary-border: rgba(47, 120, 159, .20);
}

.summary-card.verifying[b-tsn2pem1kj] {
    --summary-accent: #73569b;
    --summary-soft: #f0eafb;
    --summary-border: rgba(115, 86, 155, .20);
}

.payment-page[b-tsn2pem1kj]  .summary-card .summary-icon .mud-icon-root {
    color: var(--summary-accent) !important;
}

.status-overview-card.pending > span[b-tsn2pem1kj] { background: #b27a25; }
.status-overview-card.verifying > span[b-tsn2pem1kj] { background: #73569b; }
.status-overview-card.completed > span[b-tsn2pem1kj] { background: #397a4c; }
.status-overview-card.failed > span[b-tsn2pem1kj] { background: #b54d43; }
.status-overview-card.refunded > span[b-tsn2pem1kj] { background: #2f789f; }
.status-overview-card.cancelled > span[b-tsn2pem1kj] { background: #718078; }

/* =========================================================
   INSIGHT PANELS
   ========================================================= */

.payment-insight-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
    gap: 14px;
    margin-top: 14px;
}

.channel-guide-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 13px;
}

.channel-guide-grid > div[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 80px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 11px;
    background: #f9fbfa;
}

.channel-guide-grid > div > span[b-tsn2pem1kj] {
    display: grid;
    width: 42px;
    height: 42px;
    grid-row: 1 / span 2;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.channel-guide-grid strong[b-tsn2pem1kj] {
    color: #3c5047;
    font-size: .48rem;
}

.channel-guide-grid small[b-tsn2pem1kj] {
    color: #83918c;
    font-size: .38rem;
    line-height: 1.45;
}

.revenue-list[b-tsn2pem1kj] {
    display: grid;
    gap: 8px;
    margin-top: 13px;
}

.revenue-list > div[b-tsn2pem1kj] {
    display: flex;
    min-height: 55px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid rgba(152, 118, 52, .10);
    border-radius: 10px;
    background: #fffbf3;
}

.revenue-list small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .40rem;
}

.revenue-list strong[b-tsn2pem1kj] {
    color: #4c5e56;
    font-size: .48rem;
}

/* =========================================================
   TABLE
   ========================================================= */

.payment-code-photo-cell[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    min-width: 178px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-tsn2pem1kj] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.payment-photo-mini button[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.payment-photo-mini img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .39rem;
}

.assessment-payer-cell[b-tsn2pem1kj],
.channel-date-cell[b-tsn2pem1kj],
.amount-cell[b-tsn2pem1kj],
.balance-cell[b-tsn2pem1kj],
.reference-cell[b-tsn2pem1kj],
.status-verification-cell[b-tsn2pem1kj] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.assessment-payer-cell[b-tsn2pem1kj] { min-width: 190px; }

.assessment-payer-cell strong[b-tsn2pem1kj],
.channel-date-cell strong[b-tsn2pem1kj],
.amount-cell strong[b-tsn2pem1kj],
.balance-cell strong[b-tsn2pem1kj],
.reference-cell strong[b-tsn2pem1kj] {
    margin-top: 4px;
    color: #3c5047;
    font-size: .52rem;
    line-height: 1.48;
}

.assessment-payer-cell small[b-tsn2pem1kj],
.channel-date-cell small[b-tsn2pem1kj],
.amount-cell small[b-tsn2pem1kj],
.balance-cell small[b-tsn2pem1kj],
.reference-cell small[b-tsn2pem1kj] {
    margin-top: 3px;
    color: #84928d;
    font-size: .41rem;
    line-height: 1.5;
}

.assessment-payer-cell em[b-tsn2pem1kj],
.amount-cell em[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.amount-cell strong[b-tsn2pem1kj] {
    color: var(--theme-primary);
    font-size: .57rem;
}

.balance-cell strong[b-tsn2pem1kj] { color: #987634; }
.balance-cell small[b-tsn2pem1kj] { color: #b54d43; }
.reference-cell strong[b-tsn2pem1kj] { color: #73569b; }

.channel-chip[b-tsn2pem1kj],
.verification-chip[b-tsn2pem1kj] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .38rem;
    font-weight: 700;
}

.channel-chip.counter[b-tsn2pem1kj] { color: var(--theme-primary); background: #e7f5ef; }
.channel-chip.bank-transfer[b-tsn2pem1kj] { color: #2f789f; background: #e8f3f8; }
.channel-chip.qr-payment[b-tsn2pem1kj] { color: #73569b; background: #f0eafb; }
.channel-chip.mobile-banking[b-tsn2pem1kj] { color: #987634; background: #fff4df; }
.channel-chip.post[b-tsn2pem1kj],
.channel-chip.other[b-tsn2pem1kj] { color: #687872; background: #edf1ef; }

.verification-chip.not-required[b-tsn2pem1kj] { color: #687872; background: #edf1ef; }
.verification-chip.waiting[b-tsn2pem1kj] { color: #987634; background: #fff4df; }
.verification-chip.verified[b-tsn2pem1kj] { color: #34734b; background: #e7f5ec; }
.verification-chip.rejected[b-tsn2pem1kj] { color: #ad4037; background: #fff0ee; }

.status-chip.pending[b-tsn2pem1kj] { color: #9d671c; background: #fff0d8; }
.status-chip.verifying[b-tsn2pem1kj] { color: #6c4e96; background: #f0eafb; }
.status-chip.completed[b-tsn2pem1kj] { color: #34734b; background: #e7f5ec; }
.status-chip.failed[b-tsn2pem1kj] { color: #ad4037; background: #fff0ee; }
.status-chip.refunded[b-tsn2pem1kj] { color: #2f789f; background: #e8f3f8; }
.status-chip.cancelled[b-tsn2pem1kj] { color: #687872; background: #edf1ef; }

.status-verification-cell[b-tsn2pem1kj] {
    align-items: flex-start;
    gap: 5px;
}

.row-assessment-action[b-tsn2pem1kj] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(152, 118, 52, .14);
    border-radius: 9px;
    color: #987634;
    background: #fff7e8;
    text-decoration: none;
}

/* =========================================================
   SOURCE ASSESSMENT & PAYMENT FORM
   ========================================================= */

.payment-form-modal[b-tsn2pem1kj] {
    width: min(1240px, calc(100vw - 28px)) !important;
}

.source-assessment-panel[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 13px;
    overflow: hidden;
    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10, 114, 87, .09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-balance-chip[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: #b54d43;
    background: #fff0ee;
    font-size: .41rem;
    font-weight: 700;
    white-space: nowrap;
}

.payment-calculation-preview[b-tsn2pem1kj] {
    margin: 4px 0 17px;
    padding: 14px;
    border: 1px solid rgba(152, 118, 52, .13);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199, 163, 93, .12), transparent 18rem),
        #fffbf3;
}

.payment-photo-upload-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

/* =========================================================
   VIEW / RECEIPT
   ========================================================= */

.payment-view-modal[b-tsn2pem1kj] {
    width: min(1180px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 24px);
    overflow: hidden;
}

.view-assessment-button[b-tsn2pem1kj] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(152, 118, 52, .14);
    border-radius: 9px;
    color: #987634;
    background: #fff7e8;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.print-receipt[b-tsn2pem1kj] {
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 34px 38px;
    border: 1px solid rgba(10, 72, 56, .12);
    border-radius: 4px;
    color: #263c33;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    box-shadow: 0 22px 55px rgba(5, 62, 46, .14);
}

.receipt-header[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) 190px;
    align-items: center;
    gap: 14px;
    padding-bottom: 18px;
    border-bottom: 3px double var(--theme-primary);
}

.receipt-organization[b-tsn2pem1kj] { text-align: center; }

.receipt-organization small[b-tsn2pem1kj] {
    color: #987634;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .11em;
}

.receipt-organization h1[b-tsn2pem1kj] {
    margin: 5px 0 0;
    color: #173e35;
    font-size: 1.20rem;
    line-height: 1.25;
}

.receipt-organization p[b-tsn2pem1kj] {
    margin: 5px 0 0;
    color: #64766e;
    font-size: .50rem;
}

.receipt-number[b-tsn2pem1kj] {
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .15);
    border-radius: 10px;
    background: #f5faf8;
    text-align: center;
}

.receipt-number span[b-tsn2pem1kj],
.receipt-number small[b-tsn2pem1kj] {
    display: block;
    color: #778980;
    font-size: .39rem;
}

.receipt-number strong[b-tsn2pem1kj] {
    display: block;
    margin: 5px 0;
    color: var(--theme-primary);
    font-size: .55rem;
}

.receipt-status-strip[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(130px, .7fr) repeat(3, minmax(0, 1fr));
    gap: 8px;
    align-items: center;
    margin-top: 14px;
    padding: 10px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.receipt-status-strip > div[b-tsn2pem1kj] {
    padding-left: 9px;
    border-left: 1px solid rgba(10, 114, 87, .10);
}

.receipt-status-strip > div span[b-tsn2pem1kj] {
    display: block;
    color: #83918b;
    font-size: .38rem;
}

.receipt-status-strip > div strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;
    color: #354940;
    font-size: .46rem;
}

.receipt-payer[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 150px;
    gap: 10px;
    align-items: center;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(47, 120, 159, .12);
    border-radius: 11px;
    background: #f5fafc;
}

.payer-icon[b-tsn2pem1kj] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(145deg, #3a86af, #245f82);
}

.receipt-payer small[b-tsn2pem1kj] {
    color: #2f789f;
    font-size: .40rem;
    font-weight: 700;
}

.receipt-payer h2[b-tsn2pem1kj] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .72rem;
}

.receipt-payer p[b-tsn2pem1kj] {
    margin: 4px 0 0;
    color: #6f8078;
    font-size: .43rem;
}

.verification-box[b-tsn2pem1kj] {
    padding: 9px;
    border-radius: 9px;
    background: #fff;
    text-align: center;
}

.verification-box span[b-tsn2pem1kj] {
    display: block;
    color: #87958f;
    font-size: .37rem;
}

.verification-box strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 4px;
    color: #73569b;
    font-size: .45rem;
}

.receipt-assessment[b-tsn2pem1kj],
.receipt-payment-detail[b-tsn2pem1kj],
.receipt-transaction[b-tsn2pem1kj],
.receipt-officers[b-tsn2pem1kj] {
    margin-top: 16px;
}

.assessment-photo-data[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 10px;
}

.receipt-photo[b-tsn2pem1kj] {
    display: grid;
    min-height: 178px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf5f1;
}

.receipt-photo img[b-tsn2pem1kj] {
    width: 100%;
    height: 100%;
    min-height: 178px;
    object-fit: cover;
}

.assessment-data-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.assessment-data-grid > div[b-tsn2pem1kj],
.transaction-grid > div[b-tsn2pem1kj] {
    min-height: 78px;
    padding: 9px;
    border: 1px solid rgba(10, 114, 87, .07);
    border-radius: 9px;
    background: #f9fbfa;
}

.assessment-data-grid span[b-tsn2pem1kj],
.transaction-grid span[b-tsn2pem1kj] {
    display: block;
    color: #87958f;
    font-size: .37rem;
}

.assessment-data-grid strong[b-tsn2pem1kj],
.transaction-grid strong[b-tsn2pem1kj] {
    display: block;
    margin-top: 5px;
    color: #354940;
    font-size: .44rem;
    line-height: 1.48;
}

.receipt-address[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(47, 120, 159, .09);
    border-radius: 9px;
    color: #2f789f;
    background: #f4fafc;
}

.receipt-address div[b-tsn2pem1kj] { display: flex; flex-direction: column; }
.receipt-address span[b-tsn2pem1kj] { font-size: .37rem; }
.receipt-address strong[b-tsn2pem1kj] { margin-top: 3px; color: #455950; font-size: .44rem; }
.receipt-address small[b-tsn2pem1kj] { margin-top: 3px; color: #2f789f; font-size: .36rem; }
.receipt-address a[b-tsn2pem1kj] {
    padding: 6px 8px;
    border-radius: 7px;
    color: #2f789f;
    background: #fff;
    font-size: .38rem;
    font-weight: 700;
    text-decoration: none;
}

.receipt-amount-table[b-tsn2pem1kj] {
    overflow: hidden;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 10px;
}

.receipt-amount-table > div[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    min-height: 42px;
    align-items: center;
    border-bottom: 1px solid rgba(10, 114, 87, .07);
}

.receipt-amount-table > div:last-child[b-tsn2pem1kj] { border-bottom: 0; }
.receipt-amount-table span[b-tsn2pem1kj],
.receipt-amount-table strong[b-tsn2pem1kj] { padding: 8px 10px; font-size: .43rem; }
.receipt-amount-table strong[b-tsn2pem1kj] {
    border-left: 1px solid rgba(10, 114, 87, .07);
    color: #354940;
    text-align: right;
}

.receipt-amount-table .table-header[b-tsn2pem1kj] {
    color: #fff;
    background: linear-gradient(145deg, #17725a, #0a5543);
}

.receipt-amount-table .table-header span[b-tsn2pem1kj] { font-weight: 700; }

.receipt-amount-table .grand-total[b-tsn2pem1kj] {
    color: #fff;
    background: linear-gradient(145deg, #987634, #765520);
}

.receipt-amount-table .grand-total strong[b-tsn2pem1kj] {
    color: #fff;
    border-left-color: rgba(255, 255, 255, .15);
    font-size: .55rem;
}

.balance-summary-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
}

.balance-summary-grid article[b-tsn2pem1kj] {
    min-height: 87px;
    padding: 11px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 10px;
    background: #f9fbfa;
}

.balance-summary-grid article.received[b-tsn2pem1kj] {
    border-color: rgba(47, 120, 159, .12);
    background: #f4fafc;
}

.balance-summary-grid article.remaining[b-tsn2pem1kj] {
    border-color: rgba(181, 77, 67, .12);
    background: #fff7f5;
}

.balance-summary-grid span[b-tsn2pem1kj] { display: block; color: #84928c; font-size: .39rem; }
.balance-summary-grid strong[b-tsn2pem1kj] { display: block; margin-top: 7px; color: #354940; font-size: .68rem; }
.balance-summary-grid article.received strong[b-tsn2pem1kj] { color: #2f789f; }
.balance-summary-grid article.remaining strong[b-tsn2pem1kj] { color: #b54d43; }
.balance-summary-grid small[b-tsn2pem1kj] { display: block; color: #798a83; font-size: .36rem; }

.transaction-grid[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.receipt-note[b-tsn2pem1kj] {
    margin-top: 11px;
    padding: 10px;
    border: 1px solid rgba(152, 118, 52, .12);
    border-radius: 9px;
    background: #fffbf3;
}

.receipt-note strong[b-tsn2pem1kj] { color: #987634; font-size: .42rem; }
.receipt-note p[b-tsn2pem1kj] { margin: 4px 0 0; color: #5e7068; font-size: .42rem; line-height: 1.6; }

.receipt-footer[b-tsn2pem1kj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 3px double var(--theme-primary);
}

.receipt-footer strong[b-tsn2pem1kj] { color: var(--theme-primary); font-size: .43rem; }
.receipt-footer p[b-tsn2pem1kj] { margin: 4px 0 0; color: #62756c; font-size: .39rem; line-height: 1.6; }

.receipt-qr-placeholder[b-tsn2pem1kj] {
    display: grid;
    min-height: 90px;
    place-items: center;
    border: 1px dashed rgba(10, 114, 87, .24);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #f5faf8;
}

.receipt-qr-placeholder span[b-tsn2pem1kj] { font-size: .33rem; font-weight: 700; }

.mock-receipt[b-tsn2pem1kj] {
    margin-top: 12px;
    padding: 6px;
    border-radius: 7px;
    color: #ad4037;
    background: #fff0ee;
    font-size: .35rem;
    font-weight: 700;
    text-align: center;
}

.payment-view-modal .history-panel[b-tsn2pem1kj],
.payment-view-modal .attachment-panel[b-tsn2pem1kj],
.payment-view-modal .google-map-panel[b-tsn2pem1kj] {
    width: min(900px, 100%);
    margin-right: auto;
    margin-left: auto;
}

.eight-columns[b-tsn2pem1kj] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.attachment-card.evidence > span[b-tsn2pem1kj] { color: #73569b; background: #f0eafb; }
.attachment-card.receipt > span[b-tsn2pem1kj] { color: #34734b; background: #e7f5ec; }
.attachment-card.notice > span[b-tsn2pem1kj] { color: #987634; background: #fff4df; }
.attachment-card.valuation > span[b-tsn2pem1kj] { color: #2f789f; background: #e8f3f8; }

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1380px) {
    .payment-insight-grid[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .channel-guide-grid[b-tsn2pem1kj] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .source-data-grid[b-tsn2pem1kj] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .eight-columns[b-tsn2pem1kj] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 980px) {
    .source-assessment-panel[b-tsn2pem1kj] { grid-template-columns: 190px minmax(0, 1fr); }
    .receipt-header[b-tsn2pem1kj] { grid-template-columns: 70px minmax(0, 1fr); }
    .receipt-number[b-tsn2pem1kj] { grid-column: 1 / -1; }
    .receipt-status-strip[b-tsn2pem1kj] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .assessment-photo-data[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .assessment-data-grid[b-tsn2pem1kj] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
    .channel-guide-grid[b-tsn2pem1kj],
    .source-data-grid[b-tsn2pem1kj],
    .payment-photo-upload-grid[b-tsn2pem1kj],
    .balance-summary-grid[b-tsn2pem1kj],
    .transaction-grid[b-tsn2pem1kj],
    .officer-grid[b-tsn2pem1kj],
    .eight-columns[b-tsn2pem1kj] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .source-assessment-panel[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .source-title-row[b-tsn2pem1kj],
    .calculation-heading[b-tsn2pem1kj],
    .view-modal-toolbar[b-tsn2pem1kj] { align-items: flex-start; flex-direction: column; }
    .view-modal-toolbar > div:last-child[b-tsn2pem1kj] { width: 100%; }
    .print-receipt[b-tsn2pem1kj] { padding: 22px 18px; }
    .receipt-payer[b-tsn2pem1kj] { grid-template-columns: 52px minmax(0, 1fr); }
    .verification-box[b-tsn2pem1kj] { grid-column: 1 / -1; }
    .receipt-amount-table > div[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr) 150px; }
    .receipt-address[b-tsn2pem1kj] { grid-template-columns: 28px minmax(0, 1fr); }
    .receipt-address a[b-tsn2pem1kj] { grid-column: 1 / -1; }
    .receipt-footer[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .receipt-qr-placeholder[b-tsn2pem1kj] { width: 120px; }
}

@media (max-width: 560px) {
    .channel-guide-grid[b-tsn2pem1kj],
    .assessment-data-grid[b-tsn2pem1kj],
    .receipt-status-strip[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .source-actions[b-tsn2pem1kj] { flex-direction: column; }
    .source-actions a[b-tsn2pem1kj],
    .view-assessment-button[b-tsn2pem1kj],
    .view-map-button[b-tsn2pem1kj] { width: 100%; }
    .receipt-header[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); text-align: center; }
    .municipal-seal[b-tsn2pem1kj] { margin: 0 auto; }
    .receipt-amount-table > div[b-tsn2pem1kj] { grid-template-columns: minmax(0, 1fr); }
    .receipt-amount-table strong[b-tsn2pem1kj] { border-top: 1px solid rgba(10, 114, 87, .07); border-left: 0; }
    .google-map-panel iframe[b-tsn2pem1kj],
    .source-map-preview iframe[b-tsn2pem1kj] { height: 250px; }
}

/* =========================================================
   PRINT RECEIPT
   ========================================================= */

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm;
    }

    body *[b-tsn2pem1kj] { visibility: hidden !important; }

    #tax-payment-print-area[b-tsn2pem1kj],
    #tax-payment-print-area *[b-tsn2pem1kj] { visibility: visible !important; }

    #tax-payment-print-area[b-tsn2pem1kj] {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .no-print[b-tsn2pem1kj] { display: none !important; }

    .modal-backdrop[b-tsn2pem1kj],
    .payment-view-modal[b-tsn2pem1kj],
    .view-scroll[b-tsn2pem1kj] {
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;
        padding: 0 !important;
        border: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .receipt-header[b-tsn2pem1kj],
    .receipt-status-strip[b-tsn2pem1kj],
    .receipt-payer[b-tsn2pem1kj],
    .receipt-assessment[b-tsn2pem1kj],
    .receipt-payment-detail[b-tsn2pem1kj],
    .receipt-transaction[b-tsn2pem1kj],
    .receipt-officers[b-tsn2pem1kj],
    .receipt-footer[b-tsn2pem1kj] { break-inside: avoid; }

    .mock-receipt[b-tsn2pem1kj] {
        border: 1px solid #999;
        color: #555;
        background: #fff;
    }
}
/* /Components/Pages/02Specialized/02AccountBalanceWallet/DailyReconciliations.razor.rz.scp.css */
:root[b-xo28gds050] {
    --rc-green: var(--theme-primary);
    --rc-deep: var(--theme-dark);
    --rc-gold: var(--theme-accent);
    --rc-blue: #2f789f;
    --rc-purple: #73569b;
    --rc-red: #b54d43;
    --rc-orange: #c46a2b;
    --rc-text: var(--theme-ink);
    --rc-muted: var(--theme-muted);
    --rc-border: rgba(10,114,87,.10);
    --rc-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.reconciliation-page[b-xo28gds050] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--rc-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.reconciliation-page[b-xo28gds050]  .reconciliation-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.reconciliation-hero[b-xo28gds050] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-xo28gds050] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-xo28gds050] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-xo28gds050],
.hero-action-panel[b-xo28gds050] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-xo28gds050] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-xo28gds050] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-xo28gds050] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-xo28gds050] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-xo28gds050] {
    margin-top: 3px;
    font-size: .58rem;
}

.reconciliation-hero h1[b-xo28gds050] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.reconciliation-hero p[b-xo28gds050] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-xo28gds050] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-xo28gds050] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-xo28gds050] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-xo28gds050] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-xo28gds050] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-xo28gds050] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-xo28gds050] {
    font-size: .51rem;
}

.hero-status small[b-xo28gds050] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.reconciliation-page[b-xo28gds050]  .hero-add-button,
.reconciliation-page[b-xo28gds050]  .toolbar-add-button,
.reconciliation-page[b-xo28gds050]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .44rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.reconciliation-page[b-xo28gds050]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-xo28gds050],
.hero-refresh-button[b-xo28gds050] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-xo28gds050] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-xo28gds050] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-xo28gds050] {
    opacity: .55;
    cursor: wait;
}

.reconciliation-page[b-xo28gds050]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.reconciliation-page[b-xo28gds050]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-xo28gds050] {
    margin-top: 2px !important;
}

.summary-card[b-xo28gds050] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--rc-shadow);
}

.summary-card.system[b-xo28gds050] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-xo28gds050] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-xo28gds050] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-xo28gds050] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-xo28gds050] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-xo28gds050] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-xo28gds050] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-xo28gds050] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-xo28gds050] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-xo28gds050] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-xo28gds050] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-xo28gds050] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-xo28gds050] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-xo28gds050] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-xo28gds050],
.status-overview-card.selected[b-xo28gds050] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-xo28gds050] {
    background: #f5faf7;
}

.status-overview-card > span[b-xo28gds050] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-xo28gds050] { background:#687872; }
.status-overview-card.reviewing > span[b-xo28gds050] { background:#987634; }
.status-overview-card.difference > span[b-xo28gds050] { background:#b54d43; }
.status-overview-card.approved > span[b-xo28gds050] { background:#2f789f; }
.status-overview-card.closed > span[b-xo28gds050] { background:#34734b; }
.status-overview-card.voided > span[b-xo28gds050] { background:#687872; }
.status-overview-card.today > span[b-xo28gds050] { background:#73569b; }

.status-overview-card div[b-xo28gds050] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-xo28gds050] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-xo28gds050] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHT */

.insight-grid[b-xo28gds050] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-xo28gds050] {
    padding: 15px;
    border: 1px solid var(--rc-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--rc-shadow);
}

.insight-heading[b-xo28gds050] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-xo28gds050] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-xo28gds050] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-xo28gds050] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.variance-grid[b-xo28gds050] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-xo28gds050] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-xo28gds050] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-xo28gds050] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-xo28gds050] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-xo28gds050] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-xo28gds050] {
    display: block;
    color: #3c5047;
    font-size: .47rem;
}

.variance-card small[b-xo28gds050] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .38rem;
}

.closing-progress[b-xo28gds050] {
    margin-top: 13px;
}

.progress-track[b-xo28gds050] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-xo28gds050] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-xo28gds050] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-xo28gds050] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-xo28gds050] {
    display: block;
    color: #87958f;
    font-size: .39rem;
}

.progress-metrics strong[b-xo28gds050] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .55rem;
}

/* FILTER & TABLE */

.filter-panel[b-xo28gds050],
.reconciliation-list-panel[b-xo28gds050] {
    margin-top: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--rc-shadow);
}

.filter-panel[b-xo28gds050] {
    padding: 15px;
}

.filter-heading[b-xo28gds050],
.list-toolbar[b-xo28gds050] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-xo28gds050],
.panel-kicker[b-xo28gds050] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-xo28gds050],
.list-toolbar h2[b-xo28gds050] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-xo28gds050],
.list-toolbar p[b-xo28gds050] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-xo28gds050] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-xo28gds050] {
    margin-top: 8px !important;
}

.reconciliation-page[b-xo28gds050]  .premium-field,
.reconciliation-page[b-xo28gds050]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.reconciliation-page[b-xo28gds050]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-xo28gds050] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-xo28gds050] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-xo28gds050] {
    color: var(--theme-primary);
}

.reconciliation-list-panel[b-xo28gds050] {
    overflow: hidden;
}

.list-toolbar[b-xo28gds050] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.reconciliation-page[b-xo28gds050]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-xo28gds050] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-xo28gds050] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-xo28gds050] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-xo28gds050] {
    margin: 0;
    font-size: .43rem;
}

.reconciliation-page[b-xo28gds050]  .reconciliation-table {
    font-family: 'Kanit',sans-serif;
}

.reconciliation-page[b-xo28gds050]  .reconciliation-table .mud-table-head {
    background: #f1f7f4;
}

.reconciliation-page[b-xo28gds050]  .reconciliation-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-xo28gds050] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-xo28gds050] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-xo28gds050] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-xo28gds050] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-xo28gds050] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .44rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-xo28gds050] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .37rem;
}

.date-shift-cell[b-xo28gds050],
.counter-cashier-cell[b-xo28gds050],
.money-cell[b-xo28gds050],
.difference-cell[b-xo28gds050],
.transaction-status-cell[b-xo28gds050] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-xo28gds050] {
    min-width: 175px;
}

.date-shift-cell strong[b-xo28gds050],
.counter-cashier-cell strong[b-xo28gds050],
.money-cell strong[b-xo28gds050],
.difference-cell strong[b-xo28gds050],
.transaction-status-cell strong[b-xo28gds050] {
    color: #3c5047;
    font-size: .50rem;
    line-height: 1.48;
}

.date-shift-cell small[b-xo28gds050],
.counter-cashier-cell small[b-xo28gds050],
.money-cell small[b-xo28gds050],
.difference-cell small[b-xo28gds050] {
    margin-top: 3px;
    color: #84928d;
    font-size: .39rem;
}

.date-shift-cell em[b-xo28gds050],
.counter-cashier-cell em[b-xo28gds050] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .35rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-xo28gds050] { color:var(--theme-primary); }
.money-cell.actual strong[b-xo28gds050] { color:#2f789f; }

.difference-cell.matched strong[b-xo28gds050] { color:#34734b; }
.difference-cell.over strong[b-xo28gds050] { color:#987634; }
.difference-cell.short strong[b-xo28gds050] { color:#b54d43; }

.status-chip[b-xo28gds050],
.match-chip[b-xo28gds050] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .37rem;
    font-weight: 700;
}

.status-chip i[b-xo28gds050] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-xo28gds050] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-xo28gds050] { color:#987634; background:#fff4df; }
.status-chip.difference[b-xo28gds050] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-xo28gds050] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-xo28gds050] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-xo28gds050] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-xo28gds050] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-xo28gds050] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-xo28gds050] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-xo28gds050] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.reconciliation-page[b-xo28gds050]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.reconciliation-page[b-xo28gds050]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.reconciliation-page[b-xo28gds050]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.reconciliation-page[b-xo28gds050]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.reconciliation-page[b-xo28gds050]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-xo28gds050] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-xo28gds050] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

/* MODALS */

.modal-backdrop[b-xo28gds050],
.image-preview-backdrop[b-xo28gds050] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.reconciliation-form-modal[b-xo28gds050],
.reconciliation-view-modal[b-xo28gds050],
.delete-modal[b-xo28gds050],
.image-preview-modal[b-xo28gds050] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-xo28gds050],
.view-toolbar[b-xo28gds050],
.image-preview-header[b-xo28gds050] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-xo28gds050] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-xo28gds050] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-xo28gds050],
.view-toolbar small[b-xo28gds050],
.image-preview-header small[b-xo28gds050] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-xo28gds050],
.view-toolbar h2[b-xo28gds050],
.image-preview-header h3[b-xo28gds050] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.modal-heading p[b-xo28gds050] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.41rem;
}

.modal-body[b-xo28gds050],
.view-scroll[b-xo28gds050] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-xo28gds050] {
    background: #e9efec;
}

.modal-footer[b-xo28gds050] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.reconciliation-page[b-xo28gds050]  .cancel-button,
.reconciliation-page[b-xo28gds050]  .save-button,
.reconciliation-page[b-xo28gds050]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.42rem !important;
    text-transform:none !important;
}

.form-section-title[b-xo28gds050] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-xo28gds050] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-xo28gds050] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-xo28gds050] {
    display:block;
    color:#3c5047;
    font-size:.52rem;
}

.form-section-title small[b-xo28gds050] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.39rem;
}

.open-transactions-button[b-xo28gds050] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-xo28gds050] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-xo28gds050],
.calculation-heading[b-xo28gds050] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-xo28gds050],
.calculation-heading small[b-xo28gds050] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-xo28gds050],
.calculation-heading h3[b-xo28gds050] {
    margin: 3px 0 0;
    color: #354940;
    font-size: .67rem;
}

.source-summary-heading > span[b-xo28gds050],
.calculation-heading > span[b-xo28gds050] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .40rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-xo28gds050] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-xo28gds050] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-xo28gds050] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-xo28gds050] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-xo28gds050] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.source-summary-grid strong[b-xo28gds050] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.54rem;
}

.system-amount-grid[b-xo28gds050] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-xo28gds050] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-xo28gds050] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-xo28gds050] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-xo28gds050] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-xo28gds050] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-xo28gds050] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-xo28gds050] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-xo28gds050] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-xo28gds050] {
    display:block;
    color:#84928d;
    font-size:.36rem;
}

.system-amount-card strong[b-xo28gds050] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.48rem;
}

.reconciliation-calculation-preview[b-xo28gds050] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-xo28gds050] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-xo28gds050] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-xo28gds050] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-xo28gds050] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-xo28gds050] {
    display:block;
    color:#8b7b74;
    font-size:.39rem;
}

.calculation-grid strong[b-xo28gds050] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:.64rem;
}

.calculation-grid small[b-xo28gds050] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.36rem;
}

.calculation-grid .short span[b-xo28gds050],
.calculation-grid .short strong[b-xo28gds050],
.calculation-grid .short small[b-xo28gds050] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-xo28gds050] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-xo28gds050] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-xo28gds050] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-xo28gds050] {
    display:block;
    color:#3c5047;
    font-size:.46rem;
}

.photo-upload-heading small[b-xo28gds050] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.35rem;
}

.photo-preview[b-xo28gds050] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-xo28gds050] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-xo28gds050] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-xo28gds050] {
    color:#40544b;
    font-size:.46rem;
}

.photo-empty small[b-xo28gds050] {
    font-size:.34rem;
}

.photo-upload-actions[b-xo28gds050] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-xo28gds050],
.remove-photo-button[b-xo28gds050] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-xo28gds050] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-xo28gds050] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-xo28gds050] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-xo28gds050],
.detail-transaction-table[b-xo28gds050] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-xo28gds050],
.source-transaction-row[b-xo28gds050] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-xo28gds050] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-xo28gds050],
.source-transaction-row > span[b-xo28gds050] {
    padding:7px;
    font-size:.37rem;
}

.source-transaction-row[b-xo28gds050] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-xo28gds050] {
    border-bottom:0;
}

.mini-photo-button[b-xo28gds050] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-xo28gds050],
.source-transaction-more[b-xo28gds050] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.40rem;
    text-align:center;
}

.mock-rule-warning[b-xo28gds050] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.42rem !important;
}

/* VIEW & PRINT */

.reconciliation-view-modal[b-xo28gds050] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-xo28gds050] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-xo28gds050] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.reconciliation-page[b-xo28gds050]  .view-edit-button,
.reconciliation-page[b-xo28gds050]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.40rem !important;
    text-transform:none !important;
}

.reconciliation-page[b-xo28gds050]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-reconciliation[b-xo28gds050] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-xo28gds050] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-xo28gds050] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-xo28gds050] {
    text-align:center;
}

.document-organization small[b-xo28gds050] {
    color:#987634;
    font-size:.48rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-xo28gds050] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.20rem;
}

.document-organization p[b-xo28gds050] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.50rem;
}

.document-number-box[b-xo28gds050] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-xo28gds050],
.document-number-box small[b-xo28gds050] {
    display:block;
    color:#778980;
    font-size:.40rem;
}

.document-number-box strong[b-xo28gds050] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.50rem;
    word-break:break-word;
}

.document-status-strip[b-xo28gds050] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-xo28gds050] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-xo28gds050] {
    display:block;
    color:#83918b;
    font-size:.38rem;
}

.document-status-strip > div strong[b-xo28gds050] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.43rem;
}

.scope-panel[b-xo28gds050] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-xo28gds050] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-xo28gds050] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.scope-panel p[b-xo28gds050] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
}

.scope-reference-box[b-xo28gds050] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-xo28gds050] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.scope-reference-box strong[b-xo28gds050] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.47rem;
}

.scope-reference-box small[b-xo28gds050] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-xo28gds050],
.transaction-summary-section[b-xo28gds050],
.source-transaction-section[b-xo28gds050],
.review-section[b-xo28gds050] {
    margin-top:16px;
}

.section-title[b-xo28gds050] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-xo28gds050] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.48rem;
    font-weight:800;
}

.section-title small[b-xo28gds050] {
    color:#987634;
    font-size:.39rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-xo28gds050] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.61rem;
}

.comparison-table[b-xo28gds050] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-xo28gds050],
.comparison-row[b-xo28gds050],
.comparison-total[b-xo28gds050] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-xo28gds050] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-xo28gds050],
.comparison-row span[b-xo28gds050],
.comparison-total span[b-xo28gds050] {
    padding:8px 9px;
    font-size:.39rem;
}

.comparison-row[b-xo28gds050] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-xo28gds050],
.comparison-total span:not(:first-child)[b-xo28gds050] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-xo28gds050] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-xo28gds050] { color:#34734b; }
.difference-text.over[b-xo28gds050] { color:#987634; }
.difference-text.short[b-xo28gds050] { color:#b54d43; }

.transaction-summary-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-xo28gds050] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-xo28gds050] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-xo28gds050] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-xo28gds050] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-xo28gds050] { background:#f4fafc; }

.transaction-summary-grid span[b-xo28gds050] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.transaction-summary-grid strong[b-xo28gds050] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.66rem;
}

.transaction-summary-grid small[b-xo28gds050] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.detail-transaction-header[b-xo28gds050],
.detail-transaction-row[b-xo28gds050] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-xo28gds050] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-xo28gds050],
.detail-transaction-row span[b-xo28gds050] {
    padding:8px 7px;
    font-size:.38rem;
}

.detail-transaction-row[b-xo28gds050] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-xo28gds050] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-xo28gds050] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.review-grid strong[b-xo28gds050] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.43rem;
}

.review-note-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-xo28gds050] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-xo28gds050] {
    color:#2f789f;
    font-size:.41rem;
}

.review-note-grid p[b-xo28gds050] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.40rem;
    line-height:1.6;
}

.document-footer[b-xo28gds050] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-xo28gds050] {
    color:var(--theme-primary);
    font-size:.43rem;
}

.document-footer p[b-xo28gds050] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.39rem;
    line-height:1.6;
}

.qr-placeholder[b-xo28gds050] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-xo28gds050] {
    font-size:.33rem;
    font-weight:700;
}

.mock-document-label[b-xo28gds050] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.35rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-xo28gds050],
.attachment-panel[b-xo28gds050] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-xo28gds050] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-xo28gds050] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-xo28gds050] {
    margin:3px 0 0;
    color:#34483f;
    font-size:.65rem;
}

.section-heading > span[b-xo28gds050] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.39rem;
    font-weight:700;
}

.history-list[b-xo28gds050] {
    display:grid;
    gap:7px;
}

.history-item[b-xo28gds050] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-xo28gds050] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-xo28gds050] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-xo28gds050] {
    color:#3c5047;
    font-size:.46rem;
}

.history-item small[b-xo28gds050],
.history-item em[b-xo28gds050] {
    color:#84928d;
    font-size:.36rem;
    font-style:normal;
}

.history-item p[b-xo28gds050] {
    margin:4px 0;
    color:#5e7068;
    font-size:.41rem;
    line-height:1.55;
}

.attachment-grid[b-xo28gds050] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-xo28gds050] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-xo28gds050] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-xo28gds050] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-xo28gds050] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-xo28gds050] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-xo28gds050] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-xo28gds050] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-xo28gds050] { background:rgba(52,115,75,.89); }

.attachment-empty[b-xo28gds050] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-xo28gds050] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-xo28gds050] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-xo28gds050] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-xo28gds050] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-xo28gds050] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-xo28gds050] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.delete-modal p[b-xo28gds050] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.45rem;
    line-height:1.7;
}

.delete-modal p strong[b-xo28gds050] {
    color:#b54d43;
}

.delete-warning[b-xo28gds050] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.40rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-xo28gds050] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.reconciliation-page[b-xo28gds050]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-xo28gds050] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-xo28gds050] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-xo28gds050] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-xo28gds050] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-xo28gds050] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-xo28gds050] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .reconciliation-hero[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-xo28gds050] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-xo28gds050] {
        grid-column:1 / -1;
    }

    .document-header[b-xo28gds050] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-xo28gds050] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-xo28gds050] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-xo28gds050] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .reconciliation-page[b-xo28gds050] {
        padding-top:10px;
    }

    .reconciliation-page[b-xo28gds050]  .reconciliation-container {
        padding-inline:10px !important;
    }

    .reconciliation-hero[b-xo28gds050] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-xo28gds050],
    .list-toolbar[b-xo28gds050],
    .source-summary-heading[b-xo28gds050],
    .calculation-heading[b-xo28gds050],
    .view-toolbar[b-xo28gds050],
    .section-heading[b-xo28gds050] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-xo28gds050],
    .variance-grid[b-xo28gds050],
    .progress-metrics[b-xo28gds050],
    .source-summary-grid[b-xo28gds050],
    .system-amount-grid[b-xo28gds050],
    .calculation-grid[b-xo28gds050],
    .photo-upload-grid[b-xo28gds050],
    .transaction-summary-grid[b-xo28gds050],
    .review-grid[b-xo28gds050],
    .review-note-grid[b-xo28gds050],
    .attachment-grid[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-xo28gds050] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-xo28gds050] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-xo28gds050] {
        width:100%;
    }

    .print-reconciliation[b-xo28gds050] {
        padding:22px 18px;
    }

    .document-footer[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-xo28gds050] {
        grid-column:auto;
    }

    .status-overview[b-xo28gds050],
    .document-status-strip[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-xo28gds050] {
        width:100%;
    }

    .document-header[b-xo28gds050] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-xo28gds050] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-xo28gds050] {
        visibility:hidden !important;
    }

    #daily-reconciliation-print-area[b-xo28gds050],
    #daily-reconciliation-print-area *[b-xo28gds050] {
        visibility:visible !important;
    }

    #daily-reconciliation-print-area[b-xo28gds050] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-xo28gds050] {
        display:none !important;
    }

    .modal-backdrop[b-xo28gds050],
    .reconciliation-view-modal[b-xo28gds050],
    .view-scroll[b-xo28gds050] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-xo28gds050],
    .document-status-strip[b-xo28gds050],
    .scope-panel[b-xo28gds050],
    .amount-comparison-section[b-xo28gds050],
    .transaction-summary-section[b-xo28gds050],
    .source-transaction-section[b-xo28gds050],
    .review-section[b-xo28gds050],
    .document-footer[b-xo28gds050] {
        break-inside:avoid;
    }

    .mock-document-label[b-xo28gds050] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}
/* /Components/Pages/02Specialized/02AccountBalanceWallet/InvoiceFees.razor.rz.scp.css */
:root[b-qujyji9v6c] {
    --iv-green: var(--theme-primary);
    --iv-deep: var(--theme-dark);
    --iv-gold: var(--theme-accent);
    --iv-blue: #2f789f;
    --iv-purple: #73569b;
    --iv-red: #b54d43;
    --iv-orange: #c46a2b;
    --iv-text: var(--theme-ink);
    --iv-muted: var(--theme-muted);
    --iv-border: rgba(10, 114, 87, .10);
    --iv-shadow: 0 14px 35px rgba(5, 62, 46, .07);
}

.invoice-page[b-qujyji9v6c] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--iv-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10, 114, 87, .07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199, 163, 93, .06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.invoice-page[b-qujyji9v6c]  .invoice-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.invoice-hero[b-qujyji9v6c] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199, 163, 93, .29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72, 166, 113, .24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5, 62, 46, .19);
}

.hero-pattern[b-qujyji9v6c] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-qujyji9v6c] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-qujyji9v6c],
.hero-action-panel[b-qujyji9v6c] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-qujyji9v6c] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-qujyji9v6c] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-qujyji9v6c] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-qujyji9v6c] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-qujyji9v6c] {
    margin-top: 3px;
    font-size: .58rem;
}

.invoice-hero h1[b-qujyji9v6c] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.invoice-hero p[b-qujyji9v6c] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-qujyji9v6c] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-qujyji9v6c] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-qujyji9v6c] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-qujyji9v6c] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-qujyji9v6c] {
    font-size: .51rem;
}

.hero-status small[b-qujyji9v6c] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.invoice-page[b-qujyji9v6c]  .hero-add-button,
.invoice-page[b-qujyji9v6c]  .toolbar-add-button,
.invoice-page[b-qujyji9v6c]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg, var(--theme-accent), #987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .44rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.invoice-page[b-qujyji9v6c]  .hero-add-button {
    min-height: 41px;
}

.hero-payment-button[b-qujyji9v6c],
.hero-refresh-button[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-payment-button[b-qujyji9v6c] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-qujyji9v6c] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-qujyji9v6c] {
    opacity: .55;
    cursor: wait;
}

.invoice-page[b-qujyji9v6c]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.invoice-page[b-qujyji9v6c]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
}

/* SUMMARY */

.summary-grid[b-qujyji9v6c] {
    margin-top: 2px !important;
}

.summary-card[b-qujyji9v6c] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--iv-shadow);
}

.summary-card.invoice-count[b-qujyji9v6c] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.billed[b-qujyji9v6c] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-card.paid[b-qujyji9v6c] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.balance[b-qujyji9v6c] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-line[b-qujyji9v6c] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-qujyji9v6c] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-qujyji9v6c] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-qujyji9v6c] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-qujyji9v6c] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-qujyji9v6c] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-qujyji9v6c] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-qujyji9v6c] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-qujyji9v6c],
.status-overview-card.selected[b-qujyji9v6c] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-qujyji9v6c] {
    background: #f5faf7;
}

.status-overview-card > span[b-qujyji9v6c] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-qujyji9v6c] { background:#718078; }
.status-overview-card.issued > span[b-qujyji9v6c] { background:#b27a25; }
.status-overview-card.partial > span[b-qujyji9v6c] { background:#2f789f; }
.status-overview-card.paid > span[b-qujyji9v6c] { background:#397a4c; }
.status-overview-card.overdue > span[b-qujyji9v6c] { background:#b54d43; }
.status-overview-card.due-soon > span[b-qujyji9v6c] { background:#c46a2b; }
.status-overview-card.cancelled > span[b-qujyji9v6c] { background:#6f7a76; }

.status-overview-card div[b-qujyji9v6c] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-qujyji9v6c] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-qujyji9v6c] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHT */

.invoice-insight-grid[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-qujyji9v6c] {
    padding: 15px;
    border: 1px solid var(--iv-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--iv-shadow);
}

.insight-heading[b-qujyji9v6c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-qujyji9v6c] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-qujyji9v6c] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.revenue-category-grid[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.revenue-category-card[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 66px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 11px;
    background: #f9fbfa;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
}

.revenue-category-card > span[b-qujyji9v6c] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.revenue-category-card.permit > span[b-qujyji9v6c] { color:#987634; background:#fff4df; }
.revenue-category-card.appointment > span[b-qujyji9v6c] { color:#2f789f; background:#e8f3f8; }
.revenue-category-card.repair > span[b-qujyji9v6c] { color:var(--theme-primary); background:#e7f5ef; }
.revenue-category-card.market > span[b-qujyji9v6c] { color:#73569b; background:#f0eafb; }
.revenue-category-card.waste > span[b-qujyji9v6c] { color:#687872; background:#edf1ef; }
.revenue-category-card.health > span[b-qujyji9v6c] { color:#b35d72; background:#fff0f4; }
.revenue-category-card.tax > span[b-qujyji9v6c] { color:#b54d43; background:#fff0ee; }
.revenue-category-card.asset > span[b-qujyji9v6c] { color:#7b5a36; background:#f8eee3; }

.revenue-category-card strong[b-qujyji9v6c] {
    display: block;
    color: #3c5047;
    font-size: .45rem;
}

.revenue-category-card small[b-qujyji9v6c] {
    display: block;
    margin-top: 3px;
    color: #83918c;
    font-size: .36rem;
}

.collection-progress[b-qujyji9v6c] {
    margin-top: 13px;
}

.progress-track[b-qujyji9v6c] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-qujyji9v6c] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
    transition: width .25s ease;
}

.collection-metrics[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.collection-metrics > div[b-qujyji9v6c] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.collection-metrics small[b-qujyji9v6c] {
    display: block;
    color: #87958f;
    font-size: .39rem;
}

.collection-metrics strong[b-qujyji9v6c] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .55rem;
}

/* FILTER & LIST */

.filter-panel[b-qujyji9v6c],
.invoice-list-panel[b-qujyji9v6c] {
    margin-top: 14px;
    border: 1px solid var(--iv-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--iv-shadow);
}

.filter-panel[b-qujyji9v6c] {
    padding: 15px;
}

.filter-heading[b-qujyji9v6c],
.list-toolbar[b-qujyji9v6c] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-qujyji9v6c],
.panel-kicker[b-qujyji9v6c] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-qujyji9v6c],
.list-toolbar h2[b-qujyji9v6c] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-qujyji9v6c],
.list-toolbar p[b-qujyji9v6c] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-qujyji9v6c] {
    margin-top: 8px !important;
}

.invoice-page[b-qujyji9v6c]  .premium-field,
.invoice-page[b-qujyji9v6c]  .form-field,
.invoice-page[b-qujyji9v6c]  .line-field {
    font-family: 'Kanit', sans-serif !important;
}

.invoice-page[b-qujyji9v6c]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-qujyji9v6c] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-qujyji9v6c] {
    color: var(--theme-primary);
}

.invoice-list-panel[b-qujyji9v6c] {
    overflow: hidden;
}

.list-toolbar[b-qujyji9v6c] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.invoice-page[b-qujyji9v6c]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-qujyji9v6c] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-qujyji9v6c] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-qujyji9v6c] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-qujyji9v6c] {
    margin: 0;
    font-size: .43rem;
}

.invoice-page[b-qujyji9v6c]  .invoice-table {
    font-family: 'Kanit', sans-serif;
}

.invoice-page[b-qujyji9v6c]  .invoice-table .mud-table-head {
    background: #f1f7f4;
}

.invoice-page[b-qujyji9v6c]  .invoice-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

.invoice-code-photo-cell[b-qujyji9v6c] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 178px;
    align-items: center;
    gap: 8px;
}

.invoice-photo-mini[b-qujyji9v6c] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.invoice-photo-mini button[b-qujyji9v6c] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.invoice-photo-mini img[b-qujyji9v6c] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.invoice-code-photo-cell strong[b-qujyji9v6c] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.invoice-code-photo-cell small[b-qujyji9v6c] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .39rem;
}

.payer-service-cell[b-qujyji9v6c],
.module-source-cell[b-qujyji9v6c],
.issue-due-cell[b-qujyji9v6c],
.invoice-total-cell[b-qujyji9v6c],
.payment-balance-cell[b-qujyji9v6c] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.payer-service-cell[b-qujyji9v6c] {
    min-width: 190px;
}

.payer-service-cell strong[b-qujyji9v6c],
.module-source-cell strong[b-qujyji9v6c],
.issue-due-cell strong[b-qujyji9v6c],
.invoice-total-cell strong[b-qujyji9v6c],
.payment-balance-cell strong[b-qujyji9v6c] {
    margin-top: 4px;
    color: #3c5047;
    font-size: .51rem;
    line-height: 1.48;
}

.payer-service-cell small[b-qujyji9v6c],
.module-source-cell small[b-qujyji9v6c],
.issue-due-cell small[b-qujyji9v6c],
.invoice-total-cell small[b-qujyji9v6c],
.payment-balance-cell small[b-qujyji9v6c] {
    margin-top: 3px;
    color: #84928d;
    font-size: .40rem;
    line-height: 1.5;
}

.payer-service-cell em[b-qujyji9v6c],
.invoice-total-cell em[b-qujyji9v6c],
.payment-balance-cell em[b-qujyji9v6c] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.invoice-total-cell strong[b-qujyji9v6c] {
    color: #987634;
    font-size: .57rem;
}

.payment-balance-cell strong[b-qujyji9v6c] {
    color: var(--theme-primary);
}

.payment-balance-cell small[b-qujyji9v6c] {
    color: #b54d43;
}

.module-chip[b-qujyji9v6c],
.source-module-chip[b-qujyji9v6c],
.status-chip[b-qujyji9v6c],
.due-badge[b-qujyji9v6c] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .38rem;
    font-weight: 700;
}

.module-chip.permit[b-qujyji9v6c],
.source-module-chip.permit[b-qujyji9v6c] { color:#987634; background:#fff4df; }
.module-chip.appointment[b-qujyji9v6c],
.source-module-chip.appointment[b-qujyji9v6c] { color:#2f789f; background:#e8f3f8; }
.module-chip.repair[b-qujyji9v6c],
.source-module-chip.repair[b-qujyji9v6c] { color:var(--theme-primary); background:#e7f5ef; }
.module-chip.market[b-qujyji9v6c],
.source-module-chip.market[b-qujyji9v6c] { color:#73569b; background:#f0eafb; }
.module-chip.waste[b-qujyji9v6c],
.source-module-chip.waste[b-qujyji9v6c] { color:#687872; background:#edf1ef; }
.module-chip.health[b-qujyji9v6c],
.source-module-chip.health[b-qujyji9v6c] { color:#b35d72; background:#fff0f4; }
.module-chip.tax[b-qujyji9v6c],
.source-module-chip.tax[b-qujyji9v6c] { color:#b54d43; background:#fff0ee; }
.module-chip.asset[b-qujyji9v6c],
.source-module-chip.asset[b-qujyji9v6c] { color:#7b5a36; background:#f8eee3; }

.status-chip i[b-qujyji9v6c] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-qujyji9v6c] { color:#687872; background:#edf1ef; }
.status-chip.issued[b-qujyji9v6c] { color:#9d671c; background:#fff0d8; }
.status-chip.partial[b-qujyji9v6c] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-qujyji9v6c] { color:#34734b; background:#e7f5ec; }
.status-chip.overdue[b-qujyji9v6c] { color:#ad4037; background:#fff0ee; }
.status-chip.cancelled[b-qujyji9v6c],
.status-chip.void[b-qujyji9v6c] { color:#687872; background:#edf1ef; }

.due-badge[b-qujyji9v6c] {
    margin-top: 5px;
    font-style: normal;
}
.due-badge.normal[b-qujyji9v6c] { color:#34734b; background:#e7f5ec; }
.due-badge.urgent[b-qujyji9v6c] { color:#9d671c; background:#fff0d8; }
.due-badge.overdue[b-qujyji9v6c] { color:#ad4037; background:#fff0ee; }
.due-badge.paid[b-qujyji9v6c] { color:#34734b; background:#e7f5ec; }
.due-badge.none[b-qujyji9v6c] { color:#687872; background:#edf1ef; }

.row-actions[b-qujyji9v6c] {
    display: flex;
    min-width: 182px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.invoice-page[b-qujyji9v6c]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.invoice-page[b-qujyji9v6c]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.invoice-page[b-qujyji9v6c]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.invoice-page[b-qujyji9v6c]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.invoice-page[b-qujyji9v6c]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-payment-action[b-qujyji9v6c] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-qujyji9v6c] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

/* MODALS */

.modal-backdrop[b-qujyji9v6c],
.image-preview-backdrop[b-qujyji9v6c] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.invoice-form-modal[b-qujyji9v6c],
.invoice-view-modal[b-qujyji9v6c],
.delete-modal[b-qujyji9v6c],
.image-preview-modal[b-qujyji9v6c] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-qujyji9v6c],
.image-preview-header[b-qujyji9v6c],
.view-modal-toolbar[b-qujyji9v6c] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-qujyji9v6c] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-qujyji9v6c] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-qujyji9v6c],
.view-modal-toolbar small[b-qujyji9v6c],
.image-preview-header small[b-qujyji9v6c] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-qujyji9v6c],
.view-modal-toolbar h2[b-qujyji9v6c],
.image-preview-header h3[b-qujyji9v6c] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.modal-heading p[b-qujyji9v6c] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.41rem;
}

.modal-body[b-qujyji9v6c],
.view-scroll[b-qujyji9v6c] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.modal-footer[b-qujyji9v6c] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.invoice-page[b-qujyji9v6c]  .cancel-button,
.invoice-page[b-qujyji9v6c]  .save-button,
.invoice-page[b-qujyji9v6c]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.42rem !important;
    text-transform:none !important;
}

.form-section-title[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.line-section-title[b-qujyji9v6c] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-qujyji9v6c] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-qujyji9v6c] {
    display:block;
    color:#3c5047;
    font-size:.52rem;
}

.form-section-title small[b-qujyji9v6c] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.39rem;
}

.add-line-button[b-qujyji9v6c] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

/* SOURCE */

.source-service-panel[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10,114,87,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-qujyji9v6c] {
    display:grid;
    min-height:210px;
    overflow:hidden;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#eaf4ef;
}

.source-photo button[b-qujyji9v6c] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-photo img[b-qujyji9v6c] {
    width:100%;
    height:100%;
    min-height:210px;
    object-fit:cover;
}

.source-content[b-qujyji9v6c] {
    min-width:0;
}

.source-title-row[b-qujyji9v6c] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.source-title-row small[b-qujyji9v6c] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.source-title-row h3[b-qujyji9v6c] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.70rem;
}

.source-title-row p[b-qujyji9v6c] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.45rem;
}

.source-data-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:12px;
}

.source-data-grid > div[b-qujyji9v6c] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.source-data-grid span[b-qujyji9v6c] {
    display:block;
    color:#87958f;
    font-size:.38rem;
}

.source-data-grid strong[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.47rem;
    line-height:1.45;
}

.source-address[b-qujyji9v6c] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:9px;
    padding:9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:9px;
    color:#2f789f;
    background:#f4fafc;
    font-size:.42rem;
    line-height:1.55;
}

.source-actions[b-qujyji9v6c] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.source-actions a[b-qujyji9v6c] {
    display:inline-flex;
    min-height:33px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:9px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.source-actions a:nth-child(2)[b-qujyji9v6c] {
    color:#2f789f;
    border-color:rgba(47,120,159,.14);
    background:#f4fafc;
}

.source-map-preview[b-qujyji9v6c] {
    overflow:hidden;
    margin:-4px 0 16px;
    border:1px solid rgba(47,120,159,.11);
    border-radius:14px;
    background:#edf2ef;
}

.source-map-preview iframe[b-qujyji9v6c] {
    display:block;
    width:100%;
    height:280px;
    border:0;
}

/* LINE EDITOR */

.fee-line-editor[b-qujyji9v6c] {
    overflow-x:auto;
    padding:8px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fee-line-header[b-qujyji9v6c],
.fee-line-row[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:
        minmax(180px,1.1fr)
        minmax(240px,1.6fr)
        minmax(90px,.6fr)
        minmax(90px,.6fr)
        minmax(120px,.8fr)
        minmax(120px,.8fr)
        minmax(120px,.8fr)
        40px;
    gap:7px;
    min-width:1120px;
    align-items:center;
}

.fee-line-header[b-qujyji9v6c] {
    padding:7px 8px;
    color:#65766f;
    font-size:.37rem;
    font-weight:700;
}

.fee-line-row[b-qujyji9v6c] {
    margin-top:6px;
    padding:8px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.line-code-fields[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:1fr;
    gap:5px;
}

.line-net-amount[b-qujyji9v6c] {
    min-height:48px;
    padding:7px;
    border:1px solid rgba(152,118,52,.10);
    border-radius:9px;
    background:#fff9ed;
}

.line-net-amount span[b-qujyji9v6c] {
    display:block;
    color:#8d7d5d;
    font-size:.35rem;
}

.line-net-amount strong[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.52rem;
}

.invoice-page[b-qujyji9v6c]  .remove-line-button {
    color:#b54d43 !important;
    background:#fff0ee !important;
    border-radius:9px !important;
}

/* CALC & PHOTOS */

.invoice-calculation-preview[b-qujyji9v6c] {
    margin:4px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-heading[b-qujyji9v6c] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.calculation-heading small[b-qujyji9v6c] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.calculation-heading h3[b-qujyji9v6c] {
    margin:3px 0 0;
    color:#405249;
    font-size:.69rem;
}

.calculation-heading > span[b-qujyji9v6c] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.40rem;
    font-weight:700;
}

.calculation-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-qujyji9v6c] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.highlight[b-qujyji9v6c] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#a9833b,#765520);
}

.calculation-grid > div.balance-preview.outstanding[b-qujyji9v6c] {
    background:#fff6f4;
    border-color:rgba(181,77,67,.12);
}

.calculation-grid span[b-qujyji9v6c] {
    display:block;
    color:#8b7b74;
    font-size:.39rem;
}

.calculation-grid strong[b-qujyji9v6c] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:.64rem;
}

.calculation-grid small[b-qujyji9v6c] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.36rem;
}

.calculation-grid .highlight span[b-qujyji9v6c],
.calculation-grid .highlight strong[b-qujyji9v6c],
.calculation-grid .highlight small[b-qujyji9v6c] {
    color:#fff;
}

.calculation-grid .outstanding strong[b-qujyji9v6c] {
    color:#b54d43;
}

.invoice-photo-upload-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.photo-upload-card[b-qujyji9v6c] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-qujyji9v6c] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-qujyji9v6c] {
    display:block;
    color:#3c5047;
    font-size:.48rem;
}

.photo-upload-heading small[b-qujyji9v6c] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.37rem;
}

.photo-preview[b-qujyji9v6c] {
    display:grid;
    min-height:190px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-qujyji9v6c] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.photo-empty[b-qujyji9v6c] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-qujyji9v6c] {
    color:#40544b;
    font-size:.48rem;
}

.photo-empty small[b-qujyji9v6c] {
    font-size:.36rem;
}

.photo-upload-actions[b-qujyji9v6c] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-qujyji9v6c],
.remove-photo-button[b-qujyji9v6c] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-qujyji9v6c] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-qujyji9v6c] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-qujyji9v6c] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

.mock-rule-warning[b-qujyji9v6c] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.42rem !important;
}

/* VIEW / PRINT */

.invoice-view-modal[b-qujyji9v6c] {
    width:min(1180px,calc(100vw - 28px));
}

.view-modal-toolbar > div:last-child[b-qujyji9v6c] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-payment-button[b-qujyji9v6c],
.view-source-button[b-qujyji9v6c] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.view-payment-button[b-qujyji9v6c] {
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.view-source-button[b-qujyji9v6c] {
    color:#2f789f;
    border:1px solid rgba(47,120,159,.14);
    background:#edf6fb;
}

.invoice-page[b-qujyji9v6c]  .view-edit-button,
.invoice-page[b-qujyji9v6c]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.40rem !important;
    text-transform:none !important;
}

.invoice-page[b-qujyji9v6c]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.view-scroll[b-qujyji9v6c] {
    background:#e9efec;
}

.print-invoice[b-qujyji9v6c] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.invoice-document-header[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 180px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-qujyji9v6c] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.invoice-organization[b-qujyji9v6c] {
    text-align:center;
}

.invoice-organization small[b-qujyji9v6c] {
    color:#987634;
    font-size:.48rem;
    font-weight:700;
    letter-spacing:.11em;
}

.invoice-organization h1[b-qujyji9v6c] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.25rem;
}

.invoice-organization p[b-qujyji9v6c] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.50rem;
}

.invoice-number-box[b-qujyji9v6c] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.invoice-number-box span[b-qujyji9v6c],
.invoice-number-box small[b-qujyji9v6c] {
    display:block;
    color:#778980;
    font-size:.40rem;
}

.invoice-number-box strong[b-qujyji9v6c] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.58rem;
}

.document-status-strip[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:minmax(130px,.7fr) repeat(3,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-qujyji9v6c] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-qujyji9v6c] {
    display:block;
    color:#83918b;
    font-size:.38rem;
}

.document-status-strip > div strong[b-qujyji9v6c] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.45rem;
}

.payer-panel[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.payer-panel small[b-qujyji9v6c] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.payer-panel h2[b-qujyji9v6c] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.payer-panel p[b-qujyji9v6c] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
    line-height:1.55;
}

.service-reference-box[b-qujyji9v6c] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.service-reference-box span[b-qujyji9v6c] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.service-reference-box strong[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.50rem;
}

.service-reference-box small[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.invoice-line-section[b-qujyji9v6c],
.payment-summary-section[b-qujyji9v6c],
.approval-section[b-qujyji9v6c] {
    margin-top:16px;
}

.section-title[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-qujyji9v6c] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.48rem;
    font-weight:800;
}

.section-title small[b-qujyji9v6c] {
    color:#987634;
    font-size:.39rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-qujyji9v6c] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.61rem;
}

.invoice-line-table[b-qujyji9v6c] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.line-table-header[b-qujyji9v6c],
.line-table-row[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:45px 100px minmax(0,1fr) 95px 105px 95px 110px;
    min-width:760px;
    align-items:center;
}

.line-table-header[b-qujyji9v6c] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.line-table-header span[b-qujyji9v6c],
.line-table-row > span[b-qujyji9v6c] {
    padding:8px 7px;
    font-size:.38rem;
}

.line-table-row[b-qujyji9v6c] {
    min-height:54px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.line-table-row:last-child[b-qujyji9v6c] {
    border-bottom:0;
}

.line-table-row > span:not(:first-child)[b-qujyji9v6c] {
    border-left:1px solid rgba(10,114,87,.06);
}

.line-table-row strong[b-qujyji9v6c] {
    display:block;
    color:#3c5047;
    font-size:.41rem;
}

.line-table-row small[b-qujyji9v6c] {
    display:block;
    margin-top:3px;
    color:#87958f;
    font-size:.33rem;
}

.invoice-summary-section[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:14px;
    margin-top:13px;
}

.summary-spacer[b-qujyji9v6c] {
    display:flex;
    min-height:170px;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#f9fbfa;
}

.summary-spacer strong[b-qujyji9v6c] {
    color:var(--theme-primary);
    font-size:.42rem;
}

.summary-spacer p[b-qujyji9v6c] {
    margin:4px 0 0;
    color:#63756d;
    font-size:.40rem;
    line-height:1.6;
}

.summary-spacer a[b-qujyji9v6c] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.37rem;
    font-weight:700;
    text-decoration:none;
}

.invoice-totals[b-qujyji9v6c] {
    overflow:hidden;
    border:1px solid rgba(152,118,52,.13);
    border-radius:10px;
}

.invoice-totals > div[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 135px;
    min-height:39px;
    align-items:center;
    border-bottom:1px solid rgba(152,118,52,.08);
}

.invoice-totals > div:last-child[b-qujyji9v6c] {
    border-bottom:0;
}

.invoice-totals span[b-qujyji9v6c],
.invoice-totals strong[b-qujyji9v6c] {
    padding:7px 9px;
    font-size:.42rem;
}

.invoice-totals strong[b-qujyji9v6c] {
    border-left:1px solid rgba(152,118,52,.08);
    text-align:right;
}

.invoice-totals .grand-total[b-qujyji9v6c] {
    color:#fff;
    background:linear-gradient(145deg,#987634,#765520);
}

.invoice-totals .grand-total strong[b-qujyji9v6c] {
    color:#fff;
    font-size:.54rem;
    border-left-color:rgba(255,255,255,.13);
}

.payment-summary-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.payment-summary-grid article[b-qujyji9v6c] {
    min-height:87px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.payment-summary-grid article.paid[b-qujyji9v6c] {
    border-color:rgba(47,120,159,.12);
    background:#f4fafc;
}

.payment-summary-grid article.balance[b-qujyji9v6c] {
    border-color:rgba(181,77,67,.12);
    background:#fff7f5;
}

.payment-summary-grid span[b-qujyji9v6c] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.payment-summary-grid strong[b-qujyji9v6c] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.68rem;
}

.payment-summary-grid article.paid strong[b-qujyji9v6c] { color:#2f789f; }
.payment-summary-grid article.balance strong[b-qujyji9v6c] { color:#b54d43; }

.payment-summary-grid small[b-qujyji9v6c] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.payment-info-grid[b-qujyji9v6c],
.officer-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
    margin-top:8px;
}

.payment-info-grid > div[b-qujyji9v6c],
.officer-grid > div[b-qujyji9v6c] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.payment-info-grid span[b-qujyji9v6c],
.officer-grid span[b-qujyji9v6c] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.payment-info-grid strong[b-qujyji9v6c],
.officer-grid strong[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.44rem;
}

.officer-grid[b-qujyji9v6c] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.officer-grid > div[b-qujyji9v6c] {
    min-height:110px;
    padding-top:18px;
    text-align:center;
}

.officer-grid > div[b-qujyji9v6c]::before {
    display:block;
    width:80%;
    height:1px;
    margin:0 auto 11px;
    background:rgba(48,71,61,.28);
    content:"";
}

.officer-grid em[b-qujyji9v6c] {
    display:block;
    margin-top:5px;
    color:#87958f;
    font-size:.35rem;
    font-style:normal;
}

.document-note[b-qujyji9v6c] {
    margin-top:11px;
    padding:10px;
    border-radius:9px;
}

.document-note.cancelled[b-qujyji9v6c] {
    border:1px solid rgba(181,77,67,.12);
    background:#fff7f5;
}

.document-note.voided[b-qujyji9v6c] {
    border:1px solid rgba(104,120,114,.14);
    background:#f2f5f3;
}

.document-note strong[b-qujyji9v6c] {
    color:#704f2c;
    font-size:.42rem;
}

.document-note p[b-qujyji9v6c] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.42rem;
}

.invoice-document-footer[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.invoice-document-footer strong[b-qujyji9v6c] {
    color:var(--theme-primary);
    font-size:.43rem;
}

.invoice-document-footer p[b-qujyji9v6c] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.39rem;
    line-height:1.6;
}

.qr-placeholder[b-qujyji9v6c] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-qujyji9v6c] {
    font-size:.33rem;
    font-weight:700;
}

.mock-document-label[b-qujyji9v6c] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.35rem;
    font-weight:700;
    text-align:center;
}

.google-map-panel[b-qujyji9v6c],
.history-panel[b-qujyji9v6c],
.attachment-panel[b-qujyji9v6c] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.google-map-panel[b-qujyji9v6c] {
    overflow:hidden;
    padding:0;
}

.section-heading[b-qujyji9v6c] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.google-map-panel .section-heading[b-qujyji9v6c] {
    padding:11px 13px;
}

.section-heading small[b-qujyji9v6c] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-qujyji9v6c] {
    margin:3px 0 0;
    color:#34483f;
    font-size:.65rem;
}

.section-heading > span[b-qujyji9v6c] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.39rem;
    font-weight:700;
}

.google-map-panel iframe[b-qujyji9v6c] {
    display:block;
    width:100%;
    height:350px;
    border:0;
}

.history-list[b-qujyji9v6c] {
    display:grid;
    gap:7px;
}

.history-item[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-qujyji9v6c] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-qujyji9v6c] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-qujyji9v6c] {
    color:#3c5047;
    font-size:.46rem;
}

.history-item small[b-qujyji9v6c],
.history-item em[b-qujyji9v6c] {
    color:#84928d;
    font-size:.36rem;
    font-style:normal;
}

.history-item p[b-qujyji9v6c] {
    margin:4px 0;
    color:#5e7068;
    font-size:.41rem;
    line-height:1.55;
}

.attachment-grid[b-qujyji9v6c] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-qujyji9v6c] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-qujyji9v6c] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-qujyji9v6c] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.source-primary > span[b-qujyji9v6c] { background:rgba(10,114,87,.89); }
.attachment-card.source-document > span[b-qujyji9v6c] { background:rgba(152,118,52,.89); }
.attachment-card.source-map > span[b-qujyji9v6c] { background:rgba(47,120,159,.89); }
.attachment-card.invoice > span[b-qujyji9v6c] { background:rgba(115,86,155,.89); }
.attachment-card.payment > span[b-qujyji9v6c] { background:rgba(52,115,75,.89); }

.attachment-empty[b-qujyji9v6c] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

.image-preview-modal[b-qujyji9v6c] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-qujyji9v6c] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-qujyji9v6c] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

/* DELETE */

.delete-modal[b-qujyji9v6c] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-qujyji9v6c] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-qujyji9v6c] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.delete-modal p[b-qujyji9v6c] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.45rem;
    line-height:1.7;
}

.delete-modal p strong[b-qujyji9v6c] {
    color:#b54d43;
}

.delete-warning[b-qujyji9v6c] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.40rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-qujyji9v6c] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.invoice-page[b-qujyji9v6c]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1450px) {
    .status-overview[b-qujyji9v6c] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .revenue-category-grid[b-qujyji9v6c] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .calculation-grid[b-qujyji9v6c] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .invoice-insight-grid[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-data-grid[b-qujyji9v6c] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attachment-grid[b-qujyji9v6c] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .invoice-hero[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-qujyji9v6c] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-qujyji9v6c] {
        grid-column:1 / -1;
    }

    .source-service-panel[b-qujyji9v6c] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .invoice-document-header[b-qujyji9v6c] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .invoice-number-box[b-qujyji9v6c] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-qujyji9v6c] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .payer-panel[b-qujyji9v6c],
    .invoice-summary-section[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .attachment-grid[b-qujyji9v6c] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .invoice-page[b-qujyji9v6c] {
        padding-top:10px;
    }

    .invoice-page[b-qujyji9v6c]  .invoice-container {
        padding-inline:10px !important;
    }

    .invoice-hero[b-qujyji9v6c] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-qujyji9v6c],
    .list-toolbar[b-qujyji9v6c],
    .source-title-row[b-qujyji9v6c],
    .calculation-heading[b-qujyji9v6c],
    .view-modal-toolbar[b-qujyji9v6c],
    .section-heading[b-qujyji9v6c] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-qujyji9v6c] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .revenue-category-grid[b-qujyji9v6c],
    .collection-metrics[b-qujyji9v6c],
    .source-data-grid[b-qujyji9v6c],
    .calculation-grid[b-qujyji9v6c],
    .invoice-photo-upload-grid[b-qujyji9v6c],
    .payment-summary-grid[b-qujyji9v6c],
    .payment-info-grid[b-qujyji9v6c],
    .officer-grid[b-qujyji9v6c],
    .attachment-grid[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-service-panel[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.line-section-title[b-qujyji9v6c] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .add-line-button[b-qujyji9v6c] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-modal-toolbar > div:last-child[b-qujyji9v6c] {
        width:100%;
    }

    .print-invoice[b-qujyji9v6c] {
        padding:22px 18px;
    }

    .invoice-document-footer[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .google-map-panel iframe[b-qujyji9v6c],
    .source-map-preview iframe[b-qujyji9v6c] {
        height:280px;
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-qujyji9v6c] {
        grid-column:auto;
    }

    .status-overview[b-qujyji9v6c],
    .revenue-category-grid[b-qujyji9v6c],
    .document-status-strip[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-actions[b-qujyji9v6c] {
        flex-direction:column;
    }

    .source-actions a[b-qujyji9v6c],
    .view-payment-button[b-qujyji9v6c],
    .view-source-button[b-qujyji9v6c] {
        width:100%;
    }

    .invoice-document-header[b-qujyji9v6c] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-qujyji9v6c] {
        margin:0 auto;
    }

    .line-table-header[b-qujyji9v6c],
    .line-table-row[b-qujyji9v6c] {
        min-width:760px;
    }

    .google-map-panel iframe[b-qujyji9v6c],
    .source-map-preview iframe[b-qujyji9v6c] {
        height:250px;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-qujyji9v6c] {
        visibility:hidden !important;
    }

    #invoice-fee-print-area[b-qujyji9v6c],
    #invoice-fee-print-area *[b-qujyji9v6c] {
        visibility:visible !important;
    }

    #invoice-fee-print-area[b-qujyji9v6c] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-qujyji9v6c] {
        display:none !important;
    }

    .modal-backdrop[b-qujyji9v6c],
    .invoice-view-modal[b-qujyji9v6c],
    .view-scroll[b-qujyji9v6c] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .invoice-document-header[b-qujyji9v6c],
    .document-status-strip[b-qujyji9v6c],
    .payer-panel[b-qujyji9v6c],
    .invoice-line-section[b-qujyji9v6c],
    .invoice-summary-section[b-qujyji9v6c],
    .payment-summary-section[b-qujyji9v6c],
    .approval-section[b-qujyji9v6c],
    .invoice-document-footer[b-qujyji9v6c] {
        break-inside:avoid;
    }

    .mock-document-label[b-qujyji9v6c] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}
/* /Components/Pages/02Specialized/02AccountBalanceWallet/ReceivePayments.razor.rz.scp.css */
:root[b-affbbtoes7] {
    --iv-green: var(--theme-primary);
    --iv-deep: var(--theme-dark);
    --iv-gold: var(--theme-accent);
    --iv-blue: #2f789f;
    --iv-purple: #73569b;
    --iv-red: #b54d43;
    --iv-orange: #c46a2b;
    --iv-text: var(--theme-ink);
    --iv-muted: var(--theme-muted);
    --iv-border: rgba(10, 114, 87, .10);
    --iv-shadow: 0 14px 35px rgba(5, 62, 46, .07);
}

.payment-page[b-affbbtoes7] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--iv-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10, 114, 87, .07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199, 163, 93, .06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.payment-page[b-affbbtoes7]  .payment-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.payment-hero[b-affbbtoes7] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199, 163, 93, .29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72, 166, 113, .24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5, 62, 46, .19);
}

.hero-pattern[b-affbbtoes7] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-affbbtoes7] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-affbbtoes7],
.hero-action-panel[b-affbbtoes7] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-affbbtoes7] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-affbbtoes7] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-affbbtoes7] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-affbbtoes7] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-affbbtoes7] {
    margin-top: 3px;
    font-size: .58rem;
}

.payment-hero h1[b-affbbtoes7] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.payment-hero p[b-affbbtoes7] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-affbbtoes7] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-affbbtoes7] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-affbbtoes7] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-affbbtoes7] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-affbbtoes7] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-affbbtoes7] {
    font-size: .51rem;
}

.hero-status small[b-affbbtoes7] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.payment-page[b-affbbtoes7]  .hero-add-button,
.payment-page[b-affbbtoes7]  .toolbar-add-button,
.payment-page[b-affbbtoes7]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg, var(--theme-accent), #987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .44rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.payment-page[b-affbbtoes7]  .hero-add-button {
    min-height: 41px;
}

.hero-payment-button[b-affbbtoes7],
.hero-refresh-button[b-affbbtoes7] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-payment-button[b-affbbtoes7] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-affbbtoes7] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-affbbtoes7] {
    opacity: .55;
    cursor: wait;
}

.payment-page[b-affbbtoes7]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.payment-page[b-affbbtoes7]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
}

/* SUMMARY */

.summary-grid[b-affbbtoes7] {
    margin-top: 2px !important;
}

.summary-card[b-affbbtoes7] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--iv-shadow);
}

.summary-card.invoice-count[b-affbbtoes7] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.billed[b-affbbtoes7] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-card.paid[b-affbbtoes7] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.balance[b-affbbtoes7] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-line[b-affbbtoes7] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-affbbtoes7] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-affbbtoes7] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-affbbtoes7] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-affbbtoes7] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-affbbtoes7] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-affbbtoes7] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-affbbtoes7] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-affbbtoes7],
.status-overview-card.selected[b-affbbtoes7] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-affbbtoes7] {
    background: #f5faf7;
}

.status-overview-card > span[b-affbbtoes7] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-affbbtoes7] { background:#718078; }
.status-overview-card.issued > span[b-affbbtoes7] { background:#b27a25; }
.status-overview-card.partial > span[b-affbbtoes7] { background:#2f789f; }
.status-overview-card.paid > span[b-affbbtoes7] { background:#397a4c; }
.status-overview-card.overdue > span[b-affbbtoes7] { background:#b54d43; }
.status-overview-card.due-soon > span[b-affbbtoes7] { background:#c46a2b; }
.status-overview-card.cancelled > span[b-affbbtoes7] { background:#6f7a76; }

.status-overview-card div[b-affbbtoes7] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-affbbtoes7] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-affbbtoes7] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHT */

.invoice-insight-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-affbbtoes7] {
    padding: 15px;
    border: 1px solid var(--iv-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--iv-shadow);
}

.insight-heading[b-affbbtoes7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-affbbtoes7] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-affbbtoes7] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-affbbtoes7] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.revenue-category-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.revenue-category-card[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 66px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 11px;
    background: #f9fbfa;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
}

.revenue-category-card > span[b-affbbtoes7] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.revenue-category-card.permit > span[b-affbbtoes7] { color:#987634; background:#fff4df; }
.revenue-category-card.appointment > span[b-affbbtoes7] { color:#2f789f; background:#e8f3f8; }
.revenue-category-card.repair > span[b-affbbtoes7] { color:var(--theme-primary); background:#e7f5ef; }
.revenue-category-card.market > span[b-affbbtoes7] { color:#73569b; background:#f0eafb; }
.revenue-category-card.waste > span[b-affbbtoes7] { color:#687872; background:#edf1ef; }
.revenue-category-card.health > span[b-affbbtoes7] { color:#b35d72; background:#fff0f4; }
.revenue-category-card.tax > span[b-affbbtoes7] { color:#b54d43; background:#fff0ee; }
.revenue-category-card.asset > span[b-affbbtoes7] { color:#7b5a36; background:#f8eee3; }

.revenue-category-card strong[b-affbbtoes7] {
    display: block;
    color: #3c5047;
    font-size: .45rem;
}

.revenue-category-card small[b-affbbtoes7] {
    display: block;
    margin-top: 3px;
    color: #83918c;
    font-size: .36rem;
}

.collection-progress[b-affbbtoes7] {
    margin-top: 13px;
}

.progress-track[b-affbbtoes7] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-affbbtoes7] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
    transition: width .25s ease;
}

.collection-metrics[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.collection-metrics > div[b-affbbtoes7] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.collection-metrics small[b-affbbtoes7] {
    display: block;
    color: #87958f;
    font-size: .39rem;
}

.collection-metrics strong[b-affbbtoes7] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .55rem;
}

/* FILTER & LIST */

.filter-panel[b-affbbtoes7],
.payment-list-panel[b-affbbtoes7] {
    margin-top: 14px;
    border: 1px solid var(--iv-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--iv-shadow);
}

.filter-panel[b-affbbtoes7] {
    padding: 15px;
}

.filter-heading[b-affbbtoes7],
.list-toolbar[b-affbbtoes7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-affbbtoes7],
.panel-kicker[b-affbbtoes7] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-affbbtoes7],
.list-toolbar h2[b-affbbtoes7] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-affbbtoes7],
.list-toolbar p[b-affbbtoes7] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-affbbtoes7] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-affbbtoes7] {
    margin-top: 8px !important;
}

.payment-page[b-affbbtoes7]  .premium-field,
.payment-page[b-affbbtoes7]  .form-field,
.payment-page[b-affbbtoes7]  .line-field {
    font-family: 'Kanit', sans-serif !important;
}

.payment-page[b-affbbtoes7]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-affbbtoes7] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-affbbtoes7] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-affbbtoes7] {
    color: var(--theme-primary);
}

.payment-list-panel[b-affbbtoes7] {
    overflow: hidden;
}

.list-toolbar[b-affbbtoes7] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.payment-page[b-affbbtoes7]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-affbbtoes7] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-affbbtoes7] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-affbbtoes7] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-affbbtoes7] {
    margin: 0;
    font-size: .43rem;
}

.payment-page[b-affbbtoes7]  .payment-table {
    font-family: 'Kanit', sans-serif;
}

.payment-page[b-affbbtoes7]  .payment-table .mud-table-head {
    background: #f1f7f4;
}

.payment-page[b-affbbtoes7]  .payment-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

.invoice-code-photo-cell[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 178px;
    align-items: center;
    gap: 8px;
}

.invoice-photo-mini[b-affbbtoes7] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.invoice-photo-mini button[b-affbbtoes7] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.invoice-photo-mini img[b-affbbtoes7] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.invoice-code-photo-cell strong[b-affbbtoes7] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.invoice-code-photo-cell small[b-affbbtoes7] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .39rem;
}

.payer-service-cell[b-affbbtoes7],
.module-source-cell[b-affbbtoes7],
.issue-due-cell[b-affbbtoes7],
.invoice-total-cell[b-affbbtoes7],
.payment-balance-cell[b-affbbtoes7] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.payer-service-cell[b-affbbtoes7] {
    min-width: 190px;
}

.payer-service-cell strong[b-affbbtoes7],
.module-source-cell strong[b-affbbtoes7],
.issue-due-cell strong[b-affbbtoes7],
.invoice-total-cell strong[b-affbbtoes7],
.payment-balance-cell strong[b-affbbtoes7] {
    margin-top: 4px;
    color: #3c5047;
    font-size: .51rem;
    line-height: 1.48;
}

.payer-service-cell small[b-affbbtoes7],
.module-source-cell small[b-affbbtoes7],
.issue-due-cell small[b-affbbtoes7],
.invoice-total-cell small[b-affbbtoes7],
.payment-balance-cell small[b-affbbtoes7] {
    margin-top: 3px;
    color: #84928d;
    font-size: .40rem;
    line-height: 1.5;
}

.payer-service-cell em[b-affbbtoes7],
.invoice-total-cell em[b-affbbtoes7],
.payment-balance-cell em[b-affbbtoes7] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.invoice-total-cell strong[b-affbbtoes7] {
    color: #987634;
    font-size: .57rem;
}

.payment-balance-cell strong[b-affbbtoes7] {
    color: var(--theme-primary);
}

.payment-balance-cell small[b-affbbtoes7] {
    color: #b54d43;
}

.module-chip[b-affbbtoes7],
.source-module-chip[b-affbbtoes7],
.status-chip[b-affbbtoes7],
.due-badge[b-affbbtoes7] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .38rem;
    font-weight: 700;
}

.module-chip.permit[b-affbbtoes7],
.source-module-chip.permit[b-affbbtoes7] { color:#987634; background:#fff4df; }
.module-chip.appointment[b-affbbtoes7],
.source-module-chip.appointment[b-affbbtoes7] { color:#2f789f; background:#e8f3f8; }
.module-chip.repair[b-affbbtoes7],
.source-module-chip.repair[b-affbbtoes7] { color:var(--theme-primary); background:#e7f5ef; }
.module-chip.market[b-affbbtoes7],
.source-module-chip.market[b-affbbtoes7] { color:#73569b; background:#f0eafb; }
.module-chip.waste[b-affbbtoes7],
.source-module-chip.waste[b-affbbtoes7] { color:#687872; background:#edf1ef; }
.module-chip.health[b-affbbtoes7],
.source-module-chip.health[b-affbbtoes7] { color:#b35d72; background:#fff0f4; }
.module-chip.tax[b-affbbtoes7],
.source-module-chip.tax[b-affbbtoes7] { color:#b54d43; background:#fff0ee; }
.module-chip.asset[b-affbbtoes7],
.source-module-chip.asset[b-affbbtoes7] { color:#7b5a36; background:#f8eee3; }

.status-chip i[b-affbbtoes7] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-affbbtoes7] { color:#687872; background:#edf1ef; }
.status-chip.issued[b-affbbtoes7] { color:#9d671c; background:#fff0d8; }
.status-chip.partial[b-affbbtoes7] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-affbbtoes7] { color:#34734b; background:#e7f5ec; }
.status-chip.overdue[b-affbbtoes7] { color:#ad4037; background:#fff0ee; }
.status-chip.cancelled[b-affbbtoes7],
.status-chip.void[b-affbbtoes7] { color:#687872; background:#edf1ef; }

.due-badge[b-affbbtoes7] {
    margin-top: 5px;
    font-style: normal;
}
.due-badge.normal[b-affbbtoes7] { color:#34734b; background:#e7f5ec; }
.due-badge.urgent[b-affbbtoes7] { color:#9d671c; background:#fff0d8; }
.due-badge.overdue[b-affbbtoes7] { color:#ad4037; background:#fff0ee; }
.due-badge.paid[b-affbbtoes7] { color:#34734b; background:#e7f5ec; }
.due-badge.none[b-affbbtoes7] { color:#687872; background:#edf1ef; }

.row-actions[b-affbbtoes7] {
    display: flex;
    min-width: 182px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.payment-page[b-affbbtoes7]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.payment-page[b-affbbtoes7]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.payment-page[b-affbbtoes7]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.payment-page[b-affbbtoes7]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.payment-page[b-affbbtoes7]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-payment-action[b-affbbtoes7] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-affbbtoes7] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

/* MODALS */

.modal-backdrop[b-affbbtoes7],
.image-preview-backdrop[b-affbbtoes7] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.payment-form-modal[b-affbbtoes7],
.payment-view-modal[b-affbbtoes7],
.delete-modal[b-affbbtoes7],
.image-preview-modal[b-affbbtoes7] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-affbbtoes7],
.image-preview-header[b-affbbtoes7],
.view-modal-toolbar[b-affbbtoes7] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-affbbtoes7] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-affbbtoes7] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-affbbtoes7],
.view-modal-toolbar small[b-affbbtoes7],
.image-preview-header small[b-affbbtoes7] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-affbbtoes7],
.view-modal-toolbar h2[b-affbbtoes7],
.image-preview-header h3[b-affbbtoes7] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.modal-heading p[b-affbbtoes7] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.41rem;
}

.modal-body[b-affbbtoes7],
.view-scroll[b-affbbtoes7] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.modal-footer[b-affbbtoes7] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.payment-page[b-affbbtoes7]  .cancel-button,
.payment-page[b-affbbtoes7]  .save-button,
.payment-page[b-affbbtoes7]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.42rem !important;
    text-transform:none !important;
}

.form-section-title[b-affbbtoes7] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.line-section-title[b-affbbtoes7] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-affbbtoes7] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-affbbtoes7] {
    display:block;
    color:#3c5047;
    font-size:.52rem;
}

.form-section-title small[b-affbbtoes7] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.39rem;
}

.add-line-button[b-affbbtoes7] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

/* SOURCE */

.invoice-source-panel[b-affbbtoes7] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10,114,87,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-affbbtoes7] {
    display:grid;
    min-height:210px;
    overflow:hidden;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#eaf4ef;
}

.source-photo button[b-affbbtoes7] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-photo img[b-affbbtoes7] {
    width:100%;
    height:100%;
    min-height:210px;
    object-fit:cover;
}

.source-content[b-affbbtoes7] {
    min-width:0;
}

.source-title-row[b-affbbtoes7] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.source-title-row small[b-affbbtoes7] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.source-title-row h3[b-affbbtoes7] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.70rem;
}

.source-title-row p[b-affbbtoes7] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.45rem;
}

.source-data-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:12px;
}

.source-data-grid > div[b-affbbtoes7] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.source-data-grid span[b-affbbtoes7] {
    display:block;
    color:#87958f;
    font-size:.38rem;
}

.source-data-grid strong[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.47rem;
    line-height:1.45;
}

.source-address[b-affbbtoes7] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:9px;
    padding:9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:9px;
    color:#2f789f;
    background:#f4fafc;
    font-size:.42rem;
    line-height:1.55;
}

.source-actions[b-affbbtoes7] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.source-actions a[b-affbbtoes7] {
    display:inline-flex;
    min-height:33px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:9px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.source-actions a:nth-child(2)[b-affbbtoes7] {
    color:#2f789f;
    border-color:rgba(47,120,159,.14);
    background:#f4fafc;
}

.source-map-preview[b-affbbtoes7] {
    overflow:hidden;
    margin:-4px 0 16px;
    border:1px solid rgba(47,120,159,.11);
    border-radius:14px;
    background:#edf2ef;
}

.source-map-preview iframe[b-affbbtoes7] {
    display:block;
    width:100%;
    height:280px;
    border:0;
}

/* LINE EDITOR */

.fee-line-editor[b-affbbtoes7] {
    overflow-x:auto;
    padding:8px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fee-line-header[b-affbbtoes7],
.fee-line-row[b-affbbtoes7] {
    display:grid;
    grid-template-columns:
        minmax(180px,1.1fr)
        minmax(240px,1.6fr)
        minmax(90px,.6fr)
        minmax(90px,.6fr)
        minmax(120px,.8fr)
        minmax(120px,.8fr)
        minmax(120px,.8fr)
        40px;
    gap:7px;
    min-width:1120px;
    align-items:center;
}

.fee-line-header[b-affbbtoes7] {
    padding:7px 8px;
    color:#65766f;
    font-size:.37rem;
    font-weight:700;
}

.fee-line-row[b-affbbtoes7] {
    margin-top:6px;
    padding:8px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.line-code-fields[b-affbbtoes7] {
    display:grid;
    grid-template-columns:1fr;
    gap:5px;
}

.line-net-amount[b-affbbtoes7] {
    min-height:48px;
    padding:7px;
    border:1px solid rgba(152,118,52,.10);
    border-radius:9px;
    background:#fff9ed;
}

.line-net-amount span[b-affbbtoes7] {
    display:block;
    color:#8d7d5d;
    font-size:.35rem;
}

.line-net-amount strong[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.52rem;
}

.payment-page[b-affbbtoes7]  .remove-line-button {
    color:#b54d43 !important;
    background:#fff0ee !important;
    border-radius:9px !important;
}

/* CALC & PHOTOS */

.payment-calculation-preview[b-affbbtoes7] {
    margin:4px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-heading[b-affbbtoes7] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.calculation-heading small[b-affbbtoes7] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.calculation-heading h3[b-affbbtoes7] {
    margin:3px 0 0;
    color:#405249;
    font-size:.69rem;
}

.calculation-heading > span[b-affbbtoes7] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.40rem;
    font-weight:700;
}

.calculation-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-affbbtoes7] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.highlight[b-affbbtoes7] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#a9833b,#765520);
}

.calculation-grid > div.balance-preview.outstanding[b-affbbtoes7] {
    background:#fff6f4;
    border-color:rgba(181,77,67,.12);
}

.calculation-grid span[b-affbbtoes7] {
    display:block;
    color:#8b7b74;
    font-size:.39rem;
}

.calculation-grid strong[b-affbbtoes7] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:.64rem;
}

.calculation-grid small[b-affbbtoes7] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.36rem;
}

.calculation-grid .highlight span[b-affbbtoes7],
.calculation-grid .highlight strong[b-affbbtoes7],
.calculation-grid .highlight small[b-affbbtoes7] {
    color:#fff;
}

.calculation-grid .outstanding strong[b-affbbtoes7] {
    color:#b54d43;
}

.payment-photo-upload-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.photo-upload-card[b-affbbtoes7] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-affbbtoes7] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-affbbtoes7] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-affbbtoes7] {
    display:block;
    color:#3c5047;
    font-size:.48rem;
}

.photo-upload-heading small[b-affbbtoes7] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.37rem;
}

.photo-preview[b-affbbtoes7] {
    display:grid;
    min-height:190px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-affbbtoes7] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.photo-empty[b-affbbtoes7] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-affbbtoes7] {
    color:#40544b;
    font-size:.48rem;
}

.photo-empty small[b-affbbtoes7] {
    font-size:.36rem;
}

.photo-upload-actions[b-affbbtoes7] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-affbbtoes7],
.remove-photo-button[b-affbbtoes7] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-affbbtoes7] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-affbbtoes7] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-affbbtoes7] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

.mock-rule-warning[b-affbbtoes7] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.42rem !important;
}

/* VIEW / PRINT */

.payment-view-modal[b-affbbtoes7] {
    width:min(1180px,calc(100vw - 28px));
}

.view-modal-toolbar > div:last-child[b-affbbtoes7] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-invoice-button[b-affbbtoes7],
.view-source-button[b-affbbtoes7] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.view-invoice-button[b-affbbtoes7] {
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.view-source-button[b-affbbtoes7] {
    color:#2f789f;
    border:1px solid rgba(47,120,159,.14);
    background:#edf6fb;
}

.payment-page[b-affbbtoes7]  .view-edit-button,
.payment-page[b-affbbtoes7]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.40rem !important;
    text-transform:none !important;
}

.payment-page[b-affbbtoes7]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.view-scroll[b-affbbtoes7] {
    background:#e9efec;
}

.print-receipt[b-affbbtoes7] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.receipt-document-header[b-affbbtoes7] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 180px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-affbbtoes7] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.receipt-organization[b-affbbtoes7] {
    text-align:center;
}

.receipt-organization small[b-affbbtoes7] {
    color:#987634;
    font-size:.48rem;
    font-weight:700;
    letter-spacing:.11em;
}

.receipt-organization h1[b-affbbtoes7] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.25rem;
}

.receipt-organization p[b-affbbtoes7] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.50rem;
}

.receipt-number-box[b-affbbtoes7] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.receipt-number-box span[b-affbbtoes7],
.receipt-number-box small[b-affbbtoes7] {
    display:block;
    color:#778980;
    font-size:.40rem;
}

.receipt-number-box strong[b-affbbtoes7] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.58rem;
}

.receipt-status-strip[b-affbbtoes7] {
    display:grid;
    grid-template-columns:minmax(130px,.7fr) repeat(3,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.receipt-status-strip > div[b-affbbtoes7] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.receipt-status-strip > div span[b-affbbtoes7] {
    display:block;
    color:#83918b;
    font-size:.38rem;
}

.receipt-status-strip > div strong[b-affbbtoes7] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.45rem;
}

.receipt-payer-panel[b-affbbtoes7] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.receipt-payer-panel small[b-affbbtoes7] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.receipt-payer-panel h2[b-affbbtoes7] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.receipt-payer-panel p[b-affbbtoes7] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
    line-height:1.55;
}

.service-reference-box[b-affbbtoes7] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.service-reference-box span[b-affbbtoes7] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.service-reference-box strong[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.50rem;
}

.service-reference-box small[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.invoice-line-section[b-affbbtoes7],
.payment-summary-section[b-affbbtoes7],
.approval-section[b-affbbtoes7] {
    margin-top:16px;
}

.section-title[b-affbbtoes7] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-affbbtoes7] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.48rem;
    font-weight:800;
}

.section-title small[b-affbbtoes7] {
    color:#987634;
    font-size:.39rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-affbbtoes7] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.61rem;
}

.invoice-line-table[b-affbbtoes7] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.line-table-header[b-affbbtoes7],
.line-table-row[b-affbbtoes7] {
    display:grid;
    grid-template-columns:45px 100px minmax(0,1fr) 95px 105px 95px 110px;
    min-width:760px;
    align-items:center;
}

.line-table-header[b-affbbtoes7] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.line-table-header span[b-affbbtoes7],
.line-table-row > span[b-affbbtoes7] {
    padding:8px 7px;
    font-size:.38rem;
}

.line-table-row[b-affbbtoes7] {
    min-height:54px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.line-table-row:last-child[b-affbbtoes7] {
    border-bottom:0;
}

.line-table-row > span:not(:first-child)[b-affbbtoes7] {
    border-left:1px solid rgba(10,114,87,.06);
}

.line-table-row strong[b-affbbtoes7] {
    display:block;
    color:#3c5047;
    font-size:.41rem;
}

.line-table-row small[b-affbbtoes7] {
    display:block;
    margin-top:3px;
    color:#87958f;
    font-size:.33rem;
}

.invoice-summary-section[b-affbbtoes7] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:14px;
    margin-top:13px;
}

.summary-spacer[b-affbbtoes7] {
    display:flex;
    min-height:170px;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#f9fbfa;
}

.summary-spacer strong[b-affbbtoes7] {
    color:var(--theme-primary);
    font-size:.42rem;
}

.summary-spacer p[b-affbbtoes7] {
    margin:4px 0 0;
    color:#63756d;
    font-size:.40rem;
    line-height:1.6;
}

.summary-spacer a[b-affbbtoes7] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.37rem;
    font-weight:700;
    text-decoration:none;
}

.invoice-totals[b-affbbtoes7] {
    overflow:hidden;
    border:1px solid rgba(152,118,52,.13);
    border-radius:10px;
}

.invoice-totals > div[b-affbbtoes7] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 135px;
    min-height:39px;
    align-items:center;
    border-bottom:1px solid rgba(152,118,52,.08);
}

.invoice-totals > div:last-child[b-affbbtoes7] {
    border-bottom:0;
}

.invoice-totals span[b-affbbtoes7],
.invoice-totals strong[b-affbbtoes7] {
    padding:7px 9px;
    font-size:.42rem;
}

.invoice-totals strong[b-affbbtoes7] {
    border-left:1px solid rgba(152,118,52,.08);
    text-align:right;
}

.invoice-totals .grand-total[b-affbbtoes7] {
    color:#fff;
    background:linear-gradient(145deg,#987634,#765520);
}

.invoice-totals .grand-total strong[b-affbbtoes7] {
    color:#fff;
    font-size:.54rem;
    border-left-color:rgba(255,255,255,.13);
}

.payment-summary-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.payment-summary-grid article[b-affbbtoes7] {
    min-height:87px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.payment-summary-grid article.paid[b-affbbtoes7] {
    border-color:rgba(47,120,159,.12);
    background:#f4fafc;
}

.payment-summary-grid article.balance[b-affbbtoes7] {
    border-color:rgba(181,77,67,.12);
    background:#fff7f5;
}

.payment-summary-grid span[b-affbbtoes7] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.payment-summary-grid strong[b-affbbtoes7] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.68rem;
}

.payment-summary-grid article.paid strong[b-affbbtoes7] { color:#2f789f; }
.payment-summary-grid article.balance strong[b-affbbtoes7] { color:#b54d43; }

.payment-summary-grid small[b-affbbtoes7] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.payment-info-grid[b-affbbtoes7],
.officer-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
    margin-top:8px;
}

.payment-info-grid > div[b-affbbtoes7],
.officer-grid > div[b-affbbtoes7] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.payment-info-grid span[b-affbbtoes7],
.officer-grid span[b-affbbtoes7] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.payment-info-grid strong[b-affbbtoes7],
.officer-grid strong[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.44rem;
}

.officer-grid[b-affbbtoes7] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.officer-grid > div[b-affbbtoes7] {
    min-height:110px;
    padding-top:18px;
    text-align:center;
}

.officer-grid > div[b-affbbtoes7]::before {
    display:block;
    width:80%;
    height:1px;
    margin:0 auto 11px;
    background:rgba(48,71,61,.28);
    content:"";
}

.officer-grid em[b-affbbtoes7] {
    display:block;
    margin-top:5px;
    color:#87958f;
    font-size:.35rem;
    font-style:normal;
}

.document-note[b-affbbtoes7] {
    margin-top:11px;
    padding:10px;
    border-radius:9px;
}

.document-note.cancelled[b-affbbtoes7] {
    border:1px solid rgba(181,77,67,.12);
    background:#fff7f5;
}

.document-note.voided[b-affbbtoes7] {
    border:1px solid rgba(104,120,114,.14);
    background:#f2f5f3;
}

.document-note strong[b-affbbtoes7] {
    color:#704f2c;
    font-size:.42rem;
}

.document-note p[b-affbbtoes7] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.42rem;
}

.receipt-document-footer[b-affbbtoes7] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.receipt-document-footer strong[b-affbbtoes7] {
    color:var(--theme-primary);
    font-size:.43rem;
}

.receipt-document-footer p[b-affbbtoes7] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.39rem;
    line-height:1.6;
}

.qr-placeholder[b-affbbtoes7] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-affbbtoes7] {
    font-size:.33rem;
    font-weight:700;
}

.mock-document-label[b-affbbtoes7] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.35rem;
    font-weight:700;
    text-align:center;
}

.google-map-panel[b-affbbtoes7],
.history-panel[b-affbbtoes7],
.attachment-panel[b-affbbtoes7] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.google-map-panel[b-affbbtoes7] {
    overflow:hidden;
    padding:0;
}

.section-heading[b-affbbtoes7] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.google-map-panel .section-heading[b-affbbtoes7] {
    padding:11px 13px;
}

.section-heading small[b-affbbtoes7] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-affbbtoes7] {
    margin:3px 0 0;
    color:#34483f;
    font-size:.65rem;
}

.section-heading > span[b-affbbtoes7] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.39rem;
    font-weight:700;
}

.google-map-panel iframe[b-affbbtoes7] {
    display:block;
    width:100%;
    height:350px;
    border:0;
}

.history-list[b-affbbtoes7] {
    display:grid;
    gap:7px;
}

.history-item[b-affbbtoes7] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-affbbtoes7] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-affbbtoes7] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-affbbtoes7] {
    color:#3c5047;
    font-size:.46rem;
}

.history-item small[b-affbbtoes7],
.history-item em[b-affbbtoes7] {
    color:#84928d;
    font-size:.36rem;
    font-style:normal;
}

.history-item p[b-affbbtoes7] {
    margin:4px 0;
    color:#5e7068;
    font-size:.41rem;
    line-height:1.55;
}

.attachment-grid[b-affbbtoes7] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-affbbtoes7] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-affbbtoes7] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-affbbtoes7] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.source-primary > span[b-affbbtoes7] { background:rgba(10,114,87,.89); }
.attachment-card.source-document > span[b-affbbtoes7] { background:rgba(152,118,52,.89); }
.attachment-card.source-map > span[b-affbbtoes7] { background:rgba(47,120,159,.89); }
.attachment-card.invoice > span[b-affbbtoes7] { background:rgba(115,86,155,.89); }
.attachment-card.payment > span[b-affbbtoes7] { background:rgba(52,115,75,.89); }

.attachment-empty[b-affbbtoes7] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

.image-preview-modal[b-affbbtoes7] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-affbbtoes7] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-affbbtoes7] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

/* DELETE */

.delete-modal[b-affbbtoes7] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-affbbtoes7] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-affbbtoes7] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.delete-modal p[b-affbbtoes7] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.45rem;
    line-height:1.7;
}

.delete-modal p strong[b-affbbtoes7] {
    color:#b54d43;
}

.delete-warning[b-affbbtoes7] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.40rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-affbbtoes7] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.payment-page[b-affbbtoes7]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1450px) {
    .status-overview[b-affbbtoes7] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .revenue-category-grid[b-affbbtoes7] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .calculation-grid[b-affbbtoes7] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .invoice-insight-grid[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-data-grid[b-affbbtoes7] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attachment-grid[b-affbbtoes7] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .payment-hero[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-affbbtoes7] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-affbbtoes7] {
        grid-column:1 / -1;
    }

    .invoice-source-panel[b-affbbtoes7] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .receipt-document-header[b-affbbtoes7] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .receipt-number-box[b-affbbtoes7] {
        grid-column:1 / -1;
    }

    .receipt-status-strip[b-affbbtoes7] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .receipt-payer-panel[b-affbbtoes7],
    .invoice-summary-section[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .attachment-grid[b-affbbtoes7] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .payment-page[b-affbbtoes7] {
        padding-top:10px;
    }

    .payment-page[b-affbbtoes7]  .payment-container {
        padding-inline:10px !important;
    }

    .payment-hero[b-affbbtoes7] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-affbbtoes7],
    .list-toolbar[b-affbbtoes7],
    .source-title-row[b-affbbtoes7],
    .calculation-heading[b-affbbtoes7],
    .view-modal-toolbar[b-affbbtoes7],
    .section-heading[b-affbbtoes7] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-affbbtoes7] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .revenue-category-grid[b-affbbtoes7],
    .collection-metrics[b-affbbtoes7],
    .source-data-grid[b-affbbtoes7],
    .calculation-grid[b-affbbtoes7],
    .payment-photo-upload-grid[b-affbbtoes7],
    .payment-summary-grid[b-affbbtoes7],
    .payment-info-grid[b-affbbtoes7],
    .officer-grid[b-affbbtoes7],
    .attachment-grid[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .invoice-source-panel[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.line-section-title[b-affbbtoes7] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .add-line-button[b-affbbtoes7] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-modal-toolbar > div:last-child[b-affbbtoes7] {
        width:100%;
    }

    .print-receipt[b-affbbtoes7] {
        padding:22px 18px;
    }

    .receipt-document-footer[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .google-map-panel iframe[b-affbbtoes7],
    .source-map-preview iframe[b-affbbtoes7] {
        height:280px;
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-affbbtoes7] {
        grid-column:auto;
    }

    .status-overview[b-affbbtoes7],
    .revenue-category-grid[b-affbbtoes7],
    .receipt-status-strip[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-actions[b-affbbtoes7] {
        flex-direction:column;
    }

    .source-actions a[b-affbbtoes7],
    .view-invoice-button[b-affbbtoes7],
    .view-source-button[b-affbbtoes7] {
        width:100%;
    }

    .receipt-document-header[b-affbbtoes7] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-affbbtoes7] {
        margin:0 auto;
    }

    .line-table-header[b-affbbtoes7],
    .line-table-row[b-affbbtoes7] {
        min-width:760px;
    }

    .google-map-panel iframe[b-affbbtoes7],
    .source-map-preview iframe[b-affbbtoes7] {
        height:250px;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-affbbtoes7] {
        visibility:hidden !important;
    }

    #receive-payment-print-area[b-affbbtoes7],
    #receive-payment-print-area *[b-affbbtoes7] {
        visibility:visible !important;
    }

    #receive-payment-print-area[b-affbbtoes7] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-affbbtoes7] {
        display:none !important;
    }

    .modal-backdrop[b-affbbtoes7],
    .payment-view-modal[b-affbbtoes7],
    .view-scroll[b-affbbtoes7] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .receipt-document-header[b-affbbtoes7],
    .receipt-status-strip[b-affbbtoes7],
    .receipt-payer-panel[b-affbbtoes7],
    .invoice-line-section[b-affbbtoes7],
    .invoice-summary-section[b-affbbtoes7],
    .payment-summary-section[b-affbbtoes7],
    .approval-section[b-affbbtoes7],
    .receipt-document-footer[b-affbbtoes7] {
        break-inside:avoid;
    }

    .mock-document-label[b-affbbtoes7] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* RECEIVE PAYMENT โ€” SPECIFIC */

.summary-card.today[b-affbbtoes7] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.total[b-affbbtoes7] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.verifying[b-affbbtoes7] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-card.outstanding[b-affbbtoes7] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.hero-invoice-button[b-affbbtoes7] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(242,217,153,.24);
    border-radius: 11px;
    color: #f4dda6;
    background: rgba(242,217,153,.08);
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.status-overview-card.verifying > span[b-affbbtoes7] { background:#987634; }
.status-overview-card.completed > span[b-affbbtoes7] { background:#397a4c; }
.status-overview-card.failed > span[b-affbbtoes7] { background:#b54d43; }
.status-overview-card.refunded > span[b-affbbtoes7] { background:#73569b; }
.status-overview-card.voided > span[b-affbbtoes7] { background:#687872; }
.status-overview-card.today > span[b-affbbtoes7] { background:#2f789f; }

.payment-insight-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
    gap: 14px;
    margin-top: 14px;
}

.channel-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.channel-card[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    transition: .16s ease;
}

.channel-card:hover[b-affbbtoes7] {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(5,62,46,.08);
}

.channel-card > span[b-affbbtoes7] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.channel-card.cash > span[b-affbbtoes7] {
    color: var(--theme-primary);
    background: #e7f5ef;
}

.channel-card.qr > span[b-affbbtoes7] {
    color: #2f789f;
    background: #e8f3f8;
}

.channel-card.transfer > span[b-affbbtoes7] {
    color: #73569b;
    background: #f0eafb;
}

.channel-card.card > span[b-affbbtoes7] {
    color: #987634;
    background: #fff4df;
}

.channel-card strong[b-affbbtoes7] {
    display: block;
    color: #3c5047;
    font-size: .48rem;
}

.channel-card small[b-affbbtoes7] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .38rem;
}

.cashier-metrics[b-affbbtoes7] {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.cashier-metrics > div[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 44px minmax(0,1fr);
    min-height: 65px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 11px;
    background: #f9fbfa;
}

.cashier-metrics > div > span[b-affbbtoes7] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 12px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.cashier-metrics strong[b-affbbtoes7] {
    display: block;
    color: #354940;
    font-size: .56rem;
}

.cashier-metrics small[b-affbbtoes7] {
    display: block;
    margin-top: 3px;
    color: #84928d;
    font-size: .38rem;
}

.payment-code-photo-cell[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 180px;
    align-items: center;
    gap: 8px;
}

.payment-photo-mini[b-affbbtoes7] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.payment-photo-mini button[b-affbbtoes7] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.payment-photo-mini img[b-affbbtoes7] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payment-code-photo-cell strong[b-affbbtoes7] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .46rem;
    font-weight: 760;
    white-space: nowrap;
}

.payment-code-photo-cell small[b-affbbtoes7] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .39rem;
}

.payer-invoice-cell[b-affbbtoes7],
.date-method-cell[b-affbbtoes7],
.money-cell[b-affbbtoes7],
.status-receipt-cell[b-affbbtoes7] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.payer-invoice-cell[b-affbbtoes7] {
    min-width: 190px;
}

.payer-invoice-cell strong[b-affbbtoes7],
.date-method-cell strong[b-affbbtoes7],
.money-cell strong[b-affbbtoes7] {
    margin-top: 4px;
    color: #3c5047;
    font-size: .51rem;
    line-height: 1.48;
}

.payer-invoice-cell small[b-affbbtoes7],
.date-method-cell small[b-affbbtoes7],
.money-cell small[b-affbbtoes7],
.status-receipt-cell small[b-affbbtoes7] {
    margin-top: 3px;
    color: #84928d;
    font-size: .40rem;
    line-height: 1.5;
}

.payer-invoice-cell em[b-affbbtoes7],
.date-method-cell em[b-affbbtoes7] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .37rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.received strong[b-affbbtoes7] {
    color: var(--theme-primary);
}

.money-cell.balance strong[b-affbbtoes7] {
    color: #987634;
}

.money-cell.balance small[b-affbbtoes7] {
    color: #b54d43;
}

.status-receipt-cell[b-affbbtoes7] {
    align-items: flex-start;
    gap: 5px;
}

.status-chip.verifying[b-affbbtoes7] {
    color: #987634;
    background: #fff4df;
}

.status-chip.completed[b-affbbtoes7] {
    color: #34734b;
    background: #e7f5ec;
}

.status-chip.failed[b-affbbtoes7] {
    color: #ad4037;
    background: #fff0ee;
}

.status-chip.voided[b-affbbtoes7] {
    color: #687872;
    background: #edf1ef;
}

.status-chip.refunded[b-affbbtoes7] {
    color: #73569b;
    background: #f0eafb;
}

.row-invoice-action[b-affbbtoes7] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.invoice-source-panel[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 230px minmax(0,1fr);
    gap: 13px;
    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid rgba(10,114,87,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10,114,87,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.invoice-status-chip[b-affbbtoes7] {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .39rem;
    font-weight: 700;
}

.invoice-status-chip.issued[b-affbbtoes7] {
    color: #987634;
    background: #fff4df;
}

.invoice-status-chip.partial[b-affbbtoes7] {
    color: #2f789f;
    background: #e8f3f8;
}

.invoice-status-chip.paid[b-affbbtoes7] {
    color: #34734b;
    background: #e7f5ec;
}

.invoice-status-chip.overdue[b-affbbtoes7] {
    color: #ad4037;
    background: #fff0ee;
}

.form-section-title.tender-title[b-affbbtoes7] {
    grid-template-columns: 40px minmax(0,1fr) auto;
}

.add-tender-button[b-affbbtoes7] {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    cursor: pointer;
}

.tender-editor[b-affbbtoes7] {
    overflow-x: auto;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.tender-header[b-affbbtoes7],
.tender-row[b-affbbtoes7] {
    display: grid;
    grid-template-columns:
        minmax(160px,1fr)
        minmax(120px,.8fr)
        minmax(160px,1fr)
        minmax(220px,1.35fr)
        minmax(150px,.9fr)
        minmax(180px,1.1fr)
        40px;
    gap: 7px;
    min-width: 1160px;
    align-items: center;
}

.tender-header[b-affbbtoes7] {
    padding: 7px 8px;
    color: #65766f;
    font-size: .37rem;
    font-weight: 700;
}

.tender-row[b-affbbtoes7] {
    margin-top: 6px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #fff;
}

.bank-fields[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.payment-page[b-affbbtoes7]  .remove-tender-button {
    color: #b54d43 !important;
    background: #fff0ee !important;
    border-radius: 9px !important;
}

.payment-calculation-preview[b-affbbtoes7] {
    margin: 14px 0 17px;
    padding: 14px;
    border: 1px solid rgba(47,120,159,.13);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.11), transparent 18rem),
        #f6fbfd;
}

.payment-calculation-preview .calculation-grid[b-affbbtoes7] {
    grid-template-columns: repeat(5,minmax(0,1fr));
}

.payment-calculation-preview .calculation-grid > div.applied[b-affbbtoes7] {
    border-color: rgba(10,114,87,.12);
    background: #f2faf6;
}

.payment-calculation-preview .calculation-grid > div.change[b-affbbtoes7] {
    border-color: rgba(152,118,52,.12);
    background: #fff9ed;
}

.payment-calculation-preview .calculation-grid > div.balance[b-affbbtoes7] {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(145deg,#b54d43,#8f342e);
}

.payment-calculation-preview .calculation-grid > div.balance span[b-affbbtoes7],
.payment-calculation-preview .calculation-grid > div.balance strong[b-affbbtoes7],
.payment-calculation-preview .calculation-grid > div.balance small[b-affbbtoes7] {
    color: #fff;
}

.payment-photo-upload-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 11px;
}

.view-invoice-button[b-affbbtoes7] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit', sans-serif;
    font-size: .40rem;
    font-weight: 700;
    text-decoration: none;
}

.receipt-document-header[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 82px minmax(0,1fr) 180px;
    align-items: center;
    gap: 14px;
    padding-bottom: 18px;
    border-bottom: 3px double var(--theme-primary);
}

.receipt-organization[b-affbbtoes7] {
    text-align: center;
}

.receipt-organization small[b-affbbtoes7] {
    color: #987634;
    font-size: .48rem;
    font-weight: 700;
    letter-spacing: .11em;
}

.receipt-organization h1[b-affbbtoes7] {
    margin: 5px 0 0;
    color: #173e35;
    font-size: 1.25rem;
}

.receipt-organization p[b-affbbtoes7] {
    margin: 5px 0 0;
    color: #64766e;
    font-size: .50rem;
}

.receipt-number-box[b-affbbtoes7] {
    padding: 10px;
    border: 1px solid rgba(10,114,87,.15);
    border-radius: 10px;
    background: #f5faf8;
    text-align: center;
}

.receipt-number-box span[b-affbbtoes7],
.receipt-number-box small[b-affbbtoes7] {
    display: block;
    color: #778980;
    font-size: .40rem;
}

.receipt-number-box strong[b-affbbtoes7] {
    display: block;
    margin: 5px 0;
    color: var(--theme-primary);
    font-size: .58rem;
}

.receipt-status-strip[b-affbbtoes7] {
    display: grid;
    grid-template-columns: minmax(140px,.8fr) repeat(3,minmax(0,1fr));
    gap: 8px;
    align-items: center;
    margin-top: 14px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.receipt-status-strip > div[b-affbbtoes7] {
    padding-left: 9px;
    border-left: 1px solid rgba(10,114,87,.10);
}

.receipt-status-strip > div span[b-affbbtoes7] {
    display: block;
    color: #83918b;
    font-size: .38rem;
}

.receipt-status-strip > div strong[b-affbbtoes7] {
    display: block;
    margin-top: 4px;
    color: #354940;
    font-size: .45rem;
}

.receipt-payer-panel[b-affbbtoes7] {
    display: grid;
    grid-template-columns: minmax(0,1fr) 230px;
    gap: 12px;
    margin-top: 14px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.12);
    border-radius: 11px;
    background: #f5fafc;
}

.receipt-payer-panel small[b-affbbtoes7] {
    color: #2f789f;
    font-size: .40rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.receipt-payer-panel h2[b-affbbtoes7] {
    margin: 4px 0 0;
    color: var(--theme-ink);
    font-size: .72rem;
}

.receipt-payer-panel p[b-affbbtoes7] {
    margin: 4px 0 0;
    color: #6f8078;
    font-size: .42rem;
    line-height: 1.55;
}

.receipt-amount-section[b-affbbtoes7],
.receipt-tender-section[b-affbbtoes7],
.receipt-reference-section[b-affbbtoes7],
.receipt-officer-section[b-affbbtoes7] {
    margin-top: 16px;
}

.receipt-amount-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 8px;
}

.receipt-amount-grid article[b-affbbtoes7] {
    min-height: 88px;
    padding: 11px;
    border: 1px solid rgba(10,114,87,.09);
    border-radius: 10px;
    background: #f9fbfa;
}

.receipt-amount-grid article.received[b-affbbtoes7] {
    background: #f4fafc;
    border-color: rgba(47,120,159,.12);
}

.receipt-amount-grid article.applied[b-affbbtoes7] {
    background: #f2faf6;
    border-color: rgba(10,114,87,.12);
}

.receipt-amount-grid article.change[b-affbbtoes7] {
    background: #fff9ed;
    border-color: rgba(152,118,52,.12);
}

.receipt-amount-grid article.balance[b-affbbtoes7] {
    background: #fff7f5;
    border-color: rgba(181,77,67,.12);
}

.receipt-amount-grid span[b-affbbtoes7] {
    display: block;
    color: #84928c;
    font-size: .39rem;
}

.receipt-amount-grid strong[b-affbbtoes7] {
    display: block;
    margin-top: 7px;
    color: #354940;
    font-size: .66rem;
}

.receipt-amount-grid article.received strong[b-affbbtoes7] { color:#2f789f; }
.receipt-amount-grid article.applied strong[b-affbbtoes7] { color:var(--theme-primary); }
.receipt-amount-grid article.change strong[b-affbbtoes7] { color:#987634; }
.receipt-amount-grid article.balance strong[b-affbbtoes7] { color:#b54d43; }

.receipt-amount-grid small[b-affbbtoes7] {
    display: block;
    color: #798a83;
    font-size: .36rem;
}

.receipt-tender-table[b-affbbtoes7] {
    overflow: hidden;
    border: 1px solid rgba(10,114,87,.11);
    border-radius: 10px;
}

.tender-table-header[b-affbbtoes7],
.tender-table-row[b-affbbtoes7] {
    display: grid;
    grid-template-columns: 45px 130px 120px 150px 180px minmax(0,1fr);
    min-width: 760px;
    align-items: center;
}

.tender-table-header[b-affbbtoes7] {
    min-height: 42px;
    color: #fff;
    background: linear-gradient(145deg,#17725a,#0a5543);
}

.tender-table-header span[b-affbbtoes7],
.tender-table-row > span[b-affbbtoes7] {
    padding: 8px 7px;
    font-size: .38rem;
}

.tender-table-row[b-affbbtoes7] {
    min-height: 54px;
    border-bottom: 1px solid rgba(10,114,87,.07);
}

.tender-table-row:last-child[b-affbbtoes7] {
    border-bottom: 0;
}

.tender-table-row > span:not(:first-child)[b-affbbtoes7] {
    border-left: 1px solid rgba(10,114,87,.06);
}

.tender-table-row strong[b-affbbtoes7] {
    display: block;
    color: #3c5047;
    font-size: .41rem;
}

.tender-table-row small[b-affbbtoes7] {
    display: block;
    margin-top: 3px;
    color: #87958f;
    font-size: .33rem;
}

.reference-grid[b-affbbtoes7] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 7px;
}

.reference-grid > div[b-affbbtoes7] {
    min-height: 67px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 9px;
    background: #f9fbfa;
}

.reference-grid span[b-affbbtoes7] {
    display: block;
    color: #87958f;
    font-size: .37rem;
}

.reference-grid strong[b-affbbtoes7] {
    display: block;
    margin-top: 5px;
    color: #354940;
    font-size: .44rem;
}

.receipt-note[b-affbbtoes7] {
    margin-top: 8px;
    padding: 10px;
    border: 1px solid rgba(47,120,159,.10);
    border-radius: 9px;
    background: #f4fafc;
}

.receipt-note strong[b-affbbtoes7] {
    color: #2f789f;
    font-size: .42rem;
}

.receipt-note p[b-affbbtoes7] {
    margin: 4px 0 0;
    color: #5e7068;
    font-size: .42rem;
    line-height: 1.6;
}

.receipt-document-footer[b-affbbtoes7] {
    display: grid;
    grid-template-columns: minmax(0,1fr) 110px;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 3px double var(--theme-primary);
}

.receipt-document-footer strong[b-affbbtoes7] {
    color: var(--theme-primary);
    font-size: .43rem;
}

.receipt-document-footer p[b-affbbtoes7] {
    margin: 4px 0 0;
    color: #62756c;
    font-size: .39rem;
    line-height: 1.6;
}

.document-note.refunded[b-affbbtoes7] {
    border: 1px solid rgba(115,86,155,.13);
    background: #f8f3ff;
}

.attachment-grid[b-affbbtoes7] {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.attachment-card.previous-payment > span[b-affbbtoes7] {
    background: rgba(47,120,159,.89);
}

.attachment-card.receipt > span[b-affbbtoes7] {
    background: rgba(52,115,75,.89);
}

@media (max-width: 1180px) {
    .payment-insight-grid[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }

    .channel-grid[b-affbbtoes7] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .payment-calculation-preview .calculation-grid[b-affbbtoes7],
    .receipt-amount-grid[b-affbbtoes7] {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .reference-grid[b-affbbtoes7] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .invoice-source-panel[b-affbbtoes7] {
        grid-template-columns: 190px minmax(0,1fr);
    }

    .receipt-document-header[b-affbbtoes7] {
        grid-template-columns: 70px minmax(0,1fr);
    }

    .receipt-number-box[b-affbbtoes7] {
        grid-column: 1 / -1;
    }

    .receipt-status-strip[b-affbbtoes7] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .receipt-payer-panel[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .channel-grid[b-affbbtoes7],
    .payment-calculation-preview .calculation-grid[b-affbbtoes7],
    .payment-photo-upload-grid[b-affbbtoes7],
    .receipt-amount-grid[b-affbbtoes7],
    .reference-grid[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }

    .invoice-source-panel[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }

    .form-section-title.tender-title[b-affbbtoes7] {
        grid-template-columns: 40px minmax(0,1fr);
    }

    .add-tender-button[b-affbbtoes7] {
        grid-column: 1 / -1;
        width: 100%;
    }

    .receipt-document-footer[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .channel-grid[b-affbbtoes7],
    .receipt-status-strip[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
    }

    .receipt-document-header[b-affbbtoes7] {
        grid-template-columns: minmax(0,1fr);
        text-align: center;
    }

    .receipt-document-header .municipal-seal[b-affbbtoes7] {
        margin: 0 auto;
    }
}

@media print {
    #receive-payment-print-area[b-affbbtoes7],
    #receive-payment-print-area *[b-affbbtoes7] {
        visibility: visible !important;
    }

    #receive-payment-print-area[b-affbbtoes7] {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .payment-view-modal[b-affbbtoes7] {
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .receipt-document-header[b-affbbtoes7],
    .receipt-status-strip[b-affbbtoes7],
    .receipt-payer-panel[b-affbbtoes7],
    .receipt-amount-section[b-affbbtoes7],
    .receipt-tender-section[b-affbbtoes7],
    .receipt-reference-section[b-affbbtoes7],
    .receipt-officer-section[b-affbbtoes7],
    .receipt-document-footer[b-affbbtoes7] {
        break-inside: avoid;
    }
}
/* /Components/Pages/02Specialized/02AccountBalanceWallet/RefundVoids.razor.rz.scp.css */
:root[b-42f0cvnf41] {
    --rc-green: var(--theme-primary);
    --rc-deep: var(--theme-dark);
    --rc-gold: var(--theme-accent);
    --rc-blue: #2f789f;
    --rc-purple: #73569b;
    --rc-red: #b54d43;
    --rc-orange: #c46a2b;
    --rc-text: var(--theme-ink);
    --rc-muted: var(--theme-muted);
    --rc-border: rgba(10,114,87,.10);
    --rc-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.refund-void-page[b-42f0cvnf41] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--rc-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.refund-void-page[b-42f0cvnf41]  .refund-void-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.refund-void-hero[b-42f0cvnf41] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-42f0cvnf41] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-42f0cvnf41] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-42f0cvnf41],
.hero-action-panel[b-42f0cvnf41] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-42f0cvnf41] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-42f0cvnf41] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-42f0cvnf41] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-42f0cvnf41] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-42f0cvnf41] {
    margin-top: 3px;
    font-size: .58rem;
}

.refund-void-hero h1[b-42f0cvnf41] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.refund-void-hero p[b-42f0cvnf41] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-42f0cvnf41] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-42f0cvnf41] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-42f0cvnf41] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-42f0cvnf41] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-42f0cvnf41] {
    font-size: .51rem;
}

.hero-status small[b-42f0cvnf41] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.refund-void-page[b-42f0cvnf41]  .hero-add-button,
.refund-void-page[b-42f0cvnf41]  .toolbar-add-button,
.refund-void-page[b-42f0cvnf41]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .44rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.refund-void-page[b-42f0cvnf41]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-42f0cvnf41],
.hero-refresh-button[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-42f0cvnf41] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-42f0cvnf41] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-42f0cvnf41] {
    opacity: .55;
    cursor: wait;
}

.refund-void-page[b-42f0cvnf41]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.refund-void-page[b-42f0cvnf41]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-42f0cvnf41] {
    margin-top: 2px !important;
}

.summary-card[b-42f0cvnf41] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--rc-shadow);
}

.summary-card.system[b-42f0cvnf41] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-42f0cvnf41] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-42f0cvnf41] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-42f0cvnf41] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-42f0cvnf41] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-42f0cvnf41] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-42f0cvnf41] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-42f0cvnf41] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-42f0cvnf41] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-42f0cvnf41] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-42f0cvnf41] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-42f0cvnf41] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-42f0cvnf41],
.status-overview-card.selected[b-42f0cvnf41] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-42f0cvnf41] {
    background: #f5faf7;
}

.status-overview-card > span[b-42f0cvnf41] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-42f0cvnf41] { background:#687872; }
.status-overview-card.reviewing > span[b-42f0cvnf41] { background:#987634; }
.status-overview-card.difference > span[b-42f0cvnf41] { background:#b54d43; }
.status-overview-card.approved > span[b-42f0cvnf41] { background:#2f789f; }
.status-overview-card.closed > span[b-42f0cvnf41] { background:#34734b; }
.status-overview-card.voided > span[b-42f0cvnf41] { background:#687872; }
.status-overview-card.today > span[b-42f0cvnf41] { background:#73569b; }

.status-overview-card div[b-42f0cvnf41] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-42f0cvnf41] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-42f0cvnf41] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHT */

.insight-grid[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-42f0cvnf41] {
    padding: 15px;
    border: 1px solid var(--rc-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--rc-shadow);
}

.insight-heading[b-42f0cvnf41] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-42f0cvnf41] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-42f0cvnf41] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.variance-grid[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-42f0cvnf41] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-42f0cvnf41] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-42f0cvnf41] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-42f0cvnf41] {
    display: block;
    color: #3c5047;
    font-size: .47rem;
}

.variance-card small[b-42f0cvnf41] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .38rem;
}

.closing-progress[b-42f0cvnf41] {
    margin-top: 13px;
}

.progress-track[b-42f0cvnf41] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-42f0cvnf41] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-42f0cvnf41] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-42f0cvnf41] {
    display: block;
    color: #87958f;
    font-size: .39rem;
}

.progress-metrics strong[b-42f0cvnf41] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .55rem;
}

/* FILTER & TABLE */

.filter-panel[b-42f0cvnf41],
.refund-void-list-panel[b-42f0cvnf41] {
    margin-top: 14px;
    border: 1px solid var(--rc-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--rc-shadow);
}

.filter-panel[b-42f0cvnf41] {
    padding: 15px;
}

.filter-heading[b-42f0cvnf41],
.list-toolbar[b-42f0cvnf41] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-42f0cvnf41],
.panel-kicker[b-42f0cvnf41] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-42f0cvnf41],
.list-toolbar h2[b-42f0cvnf41] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-42f0cvnf41],
.list-toolbar p[b-42f0cvnf41] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .42rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-42f0cvnf41] {
    margin-top: 8px !important;
}

.refund-void-page[b-42f0cvnf41]  .premium-field,
.refund-void-page[b-42f0cvnf41]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.refund-void-page[b-42f0cvnf41]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-42f0cvnf41] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-42f0cvnf41] {
    color: var(--theme-primary);
}

.refund-void-list-panel[b-42f0cvnf41] {
    overflow: hidden;
}

.list-toolbar[b-42f0cvnf41] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.refund-void-page[b-42f0cvnf41]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-42f0cvnf41] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-42f0cvnf41] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-42f0cvnf41] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-42f0cvnf41] {
    margin: 0;
    font-size: .43rem;
}

.refund-void-page[b-42f0cvnf41]  .refund-void-table {
    font-family: 'Kanit',sans-serif;
}

.refund-void-page[b-42f0cvnf41]  .refund-void-table .mud-table-head {
    background: #f1f7f4;
}

.refund-void-page[b-42f0cvnf41]  .refund-void-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-42f0cvnf41] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-42f0cvnf41] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-42f0cvnf41] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .44rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-42f0cvnf41] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .37rem;
}

.date-shift-cell[b-42f0cvnf41],
.counter-cashier-cell[b-42f0cvnf41],
.money-cell[b-42f0cvnf41],
.difference-cell[b-42f0cvnf41],
.transaction-status-cell[b-42f0cvnf41] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-42f0cvnf41] {
    min-width: 175px;
}

.date-shift-cell strong[b-42f0cvnf41],
.counter-cashier-cell strong[b-42f0cvnf41],
.money-cell strong[b-42f0cvnf41],
.difference-cell strong[b-42f0cvnf41],
.transaction-status-cell strong[b-42f0cvnf41] {
    color: #3c5047;
    font-size: .50rem;
    line-height: 1.48;
}

.date-shift-cell small[b-42f0cvnf41],
.counter-cashier-cell small[b-42f0cvnf41],
.money-cell small[b-42f0cvnf41],
.difference-cell small[b-42f0cvnf41] {
    margin-top: 3px;
    color: #84928d;
    font-size: .39rem;
}

.date-shift-cell em[b-42f0cvnf41],
.counter-cashier-cell em[b-42f0cvnf41] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .35rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-42f0cvnf41] { color:var(--theme-primary); }
.money-cell.actual strong[b-42f0cvnf41] { color:#2f789f; }

.difference-cell.matched strong[b-42f0cvnf41] { color:#34734b; }
.difference-cell.over strong[b-42f0cvnf41] { color:#987634; }
.difference-cell.short strong[b-42f0cvnf41] { color:#b54d43; }

.status-chip[b-42f0cvnf41],
.match-chip[b-42f0cvnf41] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .37rem;
    font-weight: 700;
}

.status-chip i[b-42f0cvnf41] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-42f0cvnf41] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-42f0cvnf41] { color:#987634; background:#fff4df; }
.status-chip.difference[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-42f0cvnf41] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-42f0cvnf41] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-42f0cvnf41] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-42f0cvnf41] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-42f0cvnf41] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-42f0cvnf41] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.refund-void-page[b-42f0cvnf41]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.refund-void-page[b-42f0cvnf41]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.refund-void-page[b-42f0cvnf41]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.refund-void-page[b-42f0cvnf41]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.refund-void-page[b-42f0cvnf41]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-42f0cvnf41] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-42f0cvnf41] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

/* MODALS */

.modal-backdrop[b-42f0cvnf41],
.image-preview-backdrop[b-42f0cvnf41] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.refund-void-form-modal[b-42f0cvnf41],
.refund-void-view-modal[b-42f0cvnf41],
.delete-modal[b-42f0cvnf41],
.image-preview-modal[b-42f0cvnf41] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-42f0cvnf41],
.view-toolbar[b-42f0cvnf41],
.image-preview-header[b-42f0cvnf41] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-42f0cvnf41] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-42f0cvnf41] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-42f0cvnf41],
.view-toolbar small[b-42f0cvnf41],
.image-preview-header small[b-42f0cvnf41] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-42f0cvnf41],
.view-toolbar h2[b-42f0cvnf41],
.image-preview-header h3[b-42f0cvnf41] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.modal-heading p[b-42f0cvnf41] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.41rem;
}

.modal-body[b-42f0cvnf41],
.view-scroll[b-42f0cvnf41] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-42f0cvnf41] {
    background: #e9efec;
}

.modal-footer[b-42f0cvnf41] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.refund-void-page[b-42f0cvnf41]  .cancel-button,
.refund-void-page[b-42f0cvnf41]  .save-button,
.refund-void-page[b-42f0cvnf41]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.42rem !important;
    text-transform:none !important;
}

.form-section-title[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-42f0cvnf41] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-42f0cvnf41] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-42f0cvnf41] {
    display:block;
    color:#3c5047;
    font-size:.52rem;
}

.form-section-title small[b-42f0cvnf41] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.39rem;
}

.open-transactions-button[b-42f0cvnf41] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-42f0cvnf41] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-42f0cvnf41],
.calculation-heading[b-42f0cvnf41] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-42f0cvnf41],
.calculation-heading small[b-42f0cvnf41] {
    color: #987634;
    font-size: .43rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-42f0cvnf41],
.calculation-heading h3[b-42f0cvnf41] {
    margin: 3px 0 0;
    color: #354940;
    font-size: .67rem;
}

.source-summary-heading > span[b-42f0cvnf41],
.calculation-heading > span[b-42f0cvnf41] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .40rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-42f0cvnf41] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-42f0cvnf41] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-42f0cvnf41] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.source-summary-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.54rem;
}

.system-amount-grid[b-42f0cvnf41] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-42f0cvnf41] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-42f0cvnf41] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-42f0cvnf41] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-42f0cvnf41] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-42f0cvnf41] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-42f0cvnf41] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-42f0cvnf41] {
    display:block;
    color:#84928d;
    font-size:.36rem;
}

.system-amount-card strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.48rem;
}

.refund-calculation-preview[b-42f0cvnf41] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-42f0cvnf41] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-42f0cvnf41] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-42f0cvnf41] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-42f0cvnf41] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-42f0cvnf41] {
    display:block;
    color:#8b7b74;
    font-size:.39rem;
}

.calculation-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:.64rem;
}

.calculation-grid small[b-42f0cvnf41] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.36rem;
}

.calculation-grid .short span[b-42f0cvnf41],
.calculation-grid .short strong[b-42f0cvnf41],
.calculation-grid .short small[b-42f0cvnf41] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-42f0cvnf41] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-42f0cvnf41] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-42f0cvnf41] {
    display:block;
    color:#3c5047;
    font-size:.46rem;
}

.photo-upload-heading small[b-42f0cvnf41] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.35rem;
}

.photo-preview[b-42f0cvnf41] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-42f0cvnf41] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-42f0cvnf41] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-42f0cvnf41] {
    color:#40544b;
    font-size:.46rem;
}

.photo-empty small[b-42f0cvnf41] {
    font-size:.34rem;
}

.photo-upload-actions[b-42f0cvnf41] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-42f0cvnf41],
.remove-photo-button[b-42f0cvnf41] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-42f0cvnf41] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-42f0cvnf41] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-42f0cvnf41] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-42f0cvnf41],
.detail-transaction-table[b-42f0cvnf41] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-42f0cvnf41],
.source-transaction-row[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-42f0cvnf41] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-42f0cvnf41],
.source-transaction-row > span[b-42f0cvnf41] {
    padding:7px;
    font-size:.37rem;
}

.source-transaction-row[b-42f0cvnf41] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-42f0cvnf41] {
    border-bottom:0;
}

.mini-photo-button[b-42f0cvnf41] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-42f0cvnf41],
.source-transaction-more[b-42f0cvnf41] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.40rem;
    text-align:center;
}

.mock-rule-warning[b-42f0cvnf41] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.42rem !important;
}

/* VIEW & PRINT */

.refund-void-view-modal[b-42f0cvnf41] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-42f0cvnf41] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-42f0cvnf41] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.refund-void-page[b-42f0cvnf41]  .view-edit-button,
.refund-void-page[b-42f0cvnf41]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.40rem !important;
    text-transform:none !important;
}

.refund-void-page[b-42f0cvnf41]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-refund-void[b-42f0cvnf41] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-42f0cvnf41] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-42f0cvnf41] {
    text-align:center;
}

.document-organization small[b-42f0cvnf41] {
    color:#987634;
    font-size:.48rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-42f0cvnf41] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.20rem;
}

.document-organization p[b-42f0cvnf41] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.50rem;
}

.document-number-box[b-42f0cvnf41] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-42f0cvnf41],
.document-number-box small[b-42f0cvnf41] {
    display:block;
    color:#778980;
    font-size:.40rem;
}

.document-number-box strong[b-42f0cvnf41] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.50rem;
    word-break:break-word;
}

.document-status-strip[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-42f0cvnf41] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-42f0cvnf41] {
    display:block;
    color:#83918b;
    font-size:.38rem;
}

.document-status-strip > div strong[b-42f0cvnf41] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.43rem;
}

.scope-panel[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-42f0cvnf41] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-42f0cvnf41] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.scope-panel p[b-42f0cvnf41] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
}

.scope-reference-box[b-42f0cvnf41] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.scope-reference-box strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.47rem;
}

.scope-reference-box small[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-42f0cvnf41],
.transaction-summary-section[b-42f0cvnf41],
.source-transaction-section[b-42f0cvnf41],
.review-section[b-42f0cvnf41] {
    margin-top:16px;
}

.section-title[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-42f0cvnf41] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.48rem;
    font-weight:800;
}

.section-title small[b-42f0cvnf41] {
    color:#987634;
    font-size:.39rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-42f0cvnf41] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.61rem;
}

.comparison-table[b-42f0cvnf41] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-42f0cvnf41],
.comparison-row[b-42f0cvnf41],
.comparison-total[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-42f0cvnf41] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-42f0cvnf41],
.comparison-row span[b-42f0cvnf41],
.comparison-total span[b-42f0cvnf41] {
    padding:8px 9px;
    font-size:.39rem;
}

.comparison-row[b-42f0cvnf41] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-42f0cvnf41],
.comparison-total span:not(:first-child)[b-42f0cvnf41] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-42f0cvnf41] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-42f0cvnf41] { color:#34734b; }
.difference-text.over[b-42f0cvnf41] { color:#987634; }
.difference-text.short[b-42f0cvnf41] { color:#b54d43; }

.transaction-summary-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-42f0cvnf41] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-42f0cvnf41] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-42f0cvnf41] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-42f0cvnf41] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-42f0cvnf41] { background:#f4fafc; }

.transaction-summary-grid span[b-42f0cvnf41] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.transaction-summary-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.66rem;
}

.transaction-summary-grid small[b-42f0cvnf41] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.detail-transaction-header[b-42f0cvnf41],
.detail-transaction-row[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-42f0cvnf41] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-42f0cvnf41],
.detail-transaction-row span[b-42f0cvnf41] {
    padding:8px 7px;
    font-size:.38rem;
}

.detail-transaction-row[b-42f0cvnf41] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-42f0cvnf41] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.review-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.43rem;
}

.review-note-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-42f0cvnf41] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-42f0cvnf41] {
    color:#2f789f;
    font-size:.41rem;
}

.review-note-grid p[b-42f0cvnf41] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.40rem;
    line-height:1.6;
}

.document-footer[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-42f0cvnf41] {
    color:var(--theme-primary);
    font-size:.43rem;
}

.document-footer p[b-42f0cvnf41] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.39rem;
    line-height:1.6;
}

.qr-placeholder[b-42f0cvnf41] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-42f0cvnf41] {
    font-size:.33rem;
    font-weight:700;
}

.mock-document-label[b-42f0cvnf41] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.35rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-42f0cvnf41],
.attachment-panel[b-42f0cvnf41] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-42f0cvnf41] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-42f0cvnf41] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-42f0cvnf41] {
    margin:3px 0 0;
    color:#34483f;
    font-size:.65rem;
}

.section-heading > span[b-42f0cvnf41] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.39rem;
    font-weight:700;
}

.history-list[b-42f0cvnf41] {
    display:grid;
    gap:7px;
}

.history-item[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-42f0cvnf41] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-42f0cvnf41] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-42f0cvnf41] {
    color:#3c5047;
    font-size:.46rem;
}

.history-item small[b-42f0cvnf41],
.history-item em[b-42f0cvnf41] {
    color:#84928d;
    font-size:.36rem;
    font-style:normal;
}

.history-item p[b-42f0cvnf41] {
    margin:4px 0;
    color:#5e7068;
    font-size:.41rem;
    line-height:1.55;
}

.attachment-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-42f0cvnf41] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-42f0cvnf41] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-42f0cvnf41] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-42f0cvnf41] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-42f0cvnf41] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-42f0cvnf41] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-42f0cvnf41] { background:rgba(52,115,75,.89); }

.attachment-empty[b-42f0cvnf41] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-42f0cvnf41] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-42f0cvnf41] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-42f0cvnf41] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-42f0cvnf41] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-42f0cvnf41] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-42f0cvnf41] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.delete-modal p[b-42f0cvnf41] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.45rem;
    line-height:1.7;
}

.delete-modal p strong[b-42f0cvnf41] {
    color:#b54d43;
}

.delete-warning[b-42f0cvnf41] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.40rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-42f0cvnf41] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.refund-void-page[b-42f0cvnf41]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-42f0cvnf41] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .refund-void-hero[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-42f0cvnf41] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-42f0cvnf41] {
        grid-column:1 / -1;
    }

    .document-header[b-42f0cvnf41] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-42f0cvnf41] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .refund-void-page[b-42f0cvnf41] {
        padding-top:10px;
    }

    .refund-void-page[b-42f0cvnf41]  .refund-void-container {
        padding-inline:10px !important;
    }

    .refund-void-hero[b-42f0cvnf41] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-42f0cvnf41],
    .list-toolbar[b-42f0cvnf41],
    .source-summary-heading[b-42f0cvnf41],
    .calculation-heading[b-42f0cvnf41],
    .view-toolbar[b-42f0cvnf41],
    .section-heading[b-42f0cvnf41] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-42f0cvnf41],
    .variance-grid[b-42f0cvnf41],
    .progress-metrics[b-42f0cvnf41],
    .source-summary-grid[b-42f0cvnf41],
    .system-amount-grid[b-42f0cvnf41],
    .calculation-grid[b-42f0cvnf41],
    .photo-upload-grid[b-42f0cvnf41],
    .transaction-summary-grid[b-42f0cvnf41],
    .review-grid[b-42f0cvnf41],
    .review-note-grid[b-42f0cvnf41],
    .attachment-grid[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-42f0cvnf41] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-42f0cvnf41] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-42f0cvnf41] {
        width:100%;
    }

    .print-refund-void[b-42f0cvnf41] {
        padding:22px 18px;
    }

    .document-footer[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-42f0cvnf41] {
        grid-column:auto;
    }

    .status-overview[b-42f0cvnf41],
    .document-status-strip[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-42f0cvnf41] {
        width:100%;
    }

    .document-header[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-42f0cvnf41] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-42f0cvnf41] {
        visibility:hidden !important;
    }

    #refund-void-print-area[b-42f0cvnf41],
    #refund-void-print-area *[b-42f0cvnf41] {
        visibility:visible !important;
    }

    #refund-void-print-area[b-42f0cvnf41] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-42f0cvnf41] {
        display:none !important;
    }

    .modal-backdrop[b-42f0cvnf41],
    .refund-void-view-modal[b-42f0cvnf41],
    .view-scroll[b-42f0cvnf41] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-42f0cvnf41],
    .document-status-strip[b-42f0cvnf41],
    .scope-panel[b-42f0cvnf41],
    .amount-comparison-section[b-42f0cvnf41],
    .transaction-summary-section[b-42f0cvnf41],
    .source-transaction-section[b-42f0cvnf41],
    .review-section[b-42f0cvnf41],
    .document-footer[b-42f0cvnf41] {
        break-inside:avoid;
    }

    .mock-document-label[b-42f0cvnf41] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* REFUND & VOID โ€” SPECIFIC */

.summary-card.requested[b-42f0cvnf41] {
    --accent: #73569b;
    --soft: #f0eafb;
    --border: rgba(115,86,155,.18);
}

.summary-card.pending[b-42f0cvnf41] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-card.completed[b-42f0cvnf41] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.approval[b-42f0cvnf41] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.status-overview-card.submitted > span[b-42f0cvnf41] { background:#73569b; }
.status-overview-card.reviewing > span[b-42f0cvnf41] { background:#987634; }
.status-overview-card.approved > span[b-42f0cvnf41] { background:#2f789f; }
.status-overview-card.rejected > span[b-42f0cvnf41] { background:#b54d43; }
.status-overview-card.completed > span[b-42f0cvnf41] { background:#34734b; }

.type-overview[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.type-overview-card[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:86px;
    align-items:center;
    gap:10px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:15px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 24px rgba(5,62,46,.05);
    transition:.16s ease;
}

.type-overview-card:hover[b-42f0cvnf41],
.type-overview-card.selected[b-42f0cvnf41] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 14px 28px rgba(5,62,46,.10);
}

.type-overview-card.selected[b-42f0cvnf41] {
    background:var(--theme-bg);
}

.type-overview-card > span[b-42f0cvnf41] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:15px;
}

.type-overview-card.refund-full > span[b-42f0cvnf41] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.refund-partial > span[b-42f0cvnf41] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.void-payment > span[b-42f0cvnf41] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.void-receipt > span[b-42f0cvnf41] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card small[b-42f0cvnf41] {
    display:block;
    color:var(--theme-muted);
    font-size:.40rem;
}

.type-overview-card strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.68rem;
}

/* TABLE CELLS */

.request-code-photo-cell[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.request-photo-mini[b-42f0cvnf41] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:12px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.request-photo-mini button[b-42f0cvnf41] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.request-photo-mini img[b-42f0cvnf41] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.request-code-photo-cell strong[b-42f0cvnf41] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-size:.44rem;
    font-weight:760;
    white-space:nowrap;
}

.request-code-photo-cell small[b-42f0cvnf41] {
    display:block;
    margin-top:4px;
    color:#987634;
    font-size:.37rem;
}

.type-date-cell[b-42f0cvnf41],
.payer-source-cell[b-42f0cvnf41],
.money-cell[b-42f0cvnf41],
.reason-cell[b-42f0cvnf41],
.status-cell[b-42f0cvnf41] {
    display:flex;
    min-width:128px;
    flex-direction:column;
}

.payer-source-cell[b-42f0cvnf41],
.reason-cell[b-42f0cvnf41] {
    min-width:185px;
}

.type-date-cell strong[b-42f0cvnf41],
.payer-source-cell strong[b-42f0cvnf41],
.money-cell strong[b-42f0cvnf41],
.reason-cell strong[b-42f0cvnf41] {
    color:#3c5047;
    font-size:.49rem;
    line-height:1.48;
}

.type-date-cell strong[b-42f0cvnf41] {
    margin-top:5px;
}

.type-date-cell small[b-42f0cvnf41],
.payer-source-cell small[b-42f0cvnf41],
.money-cell small[b-42f0cvnf41],
.reason-cell small[b-42f0cvnf41],
.status-cell small[b-42f0cvnf41] {
    margin-top:3px;
    color:#84928d;
    font-size:.38rem;
    line-height:1.5;
}

.payer-source-cell em[b-42f0cvnf41] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.35rem;
    font-style:normal;
    font-weight:650;
}

.money-cell.requested strong[b-42f0cvnf41] {
    color:#73569b;
}

.money-cell.approved strong[b-42f0cvnf41] {
    color:var(--theme-primary);
}

.type-chip[b-42f0cvnf41] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    padding:0 7px;
    border-radius:999px;
    font-size:.36rem;
    font-weight:700;
}

.type-chip.refund-full[b-42f0cvnf41] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.refund-partial[b-42f0cvnf41] { color:#2f789f; background:#e8f3f8; }
.type-chip.void-payment[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }
.type-chip.void-receipt[b-42f0cvnf41] { color:#987634; background:#fff4df; }

.status-chip.submitted[b-42f0cvnf41] { color:#73569b; background:#f0eafb; }
.status-chip.reviewing[b-42f0cvnf41] { color:#987634; background:#fff4df; }
.status-chip.approved[b-42f0cvnf41] { color:#2f789f; background:#e8f3f8; }
.status-chip.rejected[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }
.status-chip.completed[b-42f0cvnf41] { color:#34734b; background:#e7f5ec; }

.status-cell[b-42f0cvnf41] {
    align-items:flex-start;
    gap:5px;
}

/* SOURCE PAYMENT */

.source-payment-panel[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(10,114,87,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo[b-42f0cvnf41] {
    display:grid;
    min-height:190px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    color:var(--theme-primary);
    background:#eaf3ef;
}

.source-photo button[b-42f0cvnf41] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-photo img[b-42f0cvnf41] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-title-row[b-42f0cvnf41] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.source-title-row small[b-42f0cvnf41] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.source-title-row h3[b-42f0cvnf41] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.68rem;
}

.source-title-row p[b-42f0cvnf41] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.41rem;
}

.source-status-chip[b-42f0cvnf41] {
    display:inline-flex;
    min-height:26px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.38rem;
    font-weight:700;
}

.source-status-chip.draft[b-42f0cvnf41] { color:#687872; background:#edf1ef; }
.source-status-chip.verifying[b-42f0cvnf41] { color:#987634; background:#fff4df; }
.source-status-chip.completed[b-42f0cvnf41] { color:#34734b; background:#e7f5ec; }
.source-status-chip.failed[b-42f0cvnf41] { color:#b54d43; background:#fff0ee; }
.source-status-chip.voided[b-42f0cvnf41] { color:#687872; background:#edf1ef; }
.source-status-chip.refunded[b-42f0cvnf41] { color:#73569b; background:#f0eafb; }

.source-data-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.source-data-grid > div[b-42f0cvnf41] {
    min-height:65px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.source-data-grid span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.36rem;
}

.source-data-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.45rem;
}

.source-address[b-42f0cvnf41] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.40rem;
}

.source-actions[b-42f0cvnf41] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.source-actions a[b-42f0cvnf41] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-size:.37rem;
    font-weight:700;
    text-decoration:none;
}

/* REFUND CALCULATION */

.refund-calculation-preview[b-42f0cvnf41] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(115,86,155,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(115,86,155,.10), transparent 18rem),
        #faf7ff;
}

.calculation-heading[b-42f0cvnf41] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.calculation-heading small[b-42f0cvnf41] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.calculation-heading h3[b-42f0cvnf41] {
    margin:3px 0 0;
    color:#354940;
    font-size:.67rem;
}

.calculation-heading > span[b-42f0cvnf41] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#73569b;
    background:#f0eafb;
    font-size:.40rem;
    font-weight:700;
}

.refund-calculation-preview .calculation-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.refund-calculation-preview .calculation-grid > div[b-42f0cvnf41] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(115,86,155,.08);
    border-radius:11px;
    background:#fff;
}

.refund-calculation-preview .calculation-grid > div.fee[b-42f0cvnf41] {
    background:#fff9ed;
}

.refund-calculation-preview .calculation-grid > div.net[b-42f0cvnf41] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#178466,#0a5543);
}

.refund-calculation-preview .calculation-grid span[b-42f0cvnf41] {
    display:block;
    color:#8a7d91;
    font-size:.39rem;
}

.refund-calculation-preview .calculation-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:.64rem;
}

.refund-calculation-preview .calculation-grid small[b-42f0cvnf41] {
    display:block;
    color:#8a9791;
    font-size:.36rem;
}

.refund-calculation-preview .calculation-grid .net span[b-42f0cvnf41],
.refund-calculation-preview .calculation-grid .net strong[b-42f0cvnf41],
.refund-calculation-preview .calculation-grid .net small[b-42f0cvnf41] {
    color:#fff;
}

/* SOURCE PHOTO */

.form-section-title.source-photo-title[b-42f0cvnf41] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-42f0cvnf41] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.37rem;
    font-weight:700;
}

.source-photo-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-42f0cvnf41] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-42f0cvnf41] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.source-photo-card > span[b-42f0cvnf41] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
}

.source-photo-card.invoice > span[b-42f0cvnf41] { background:rgba(115,86,155,.89); }
.source-photo-card.payment > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.source-photo-card.receipt > span[b-42f0cvnf41] { background:rgba(52,115,75,.89); }
.source-photo-card.map > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.source-photo-card.document > span[b-42f0cvnf41] { background:rgba(152,118,52,.89); }

.source-photo-empty[b-42f0cvnf41] {
    grid-column:1 / -1;
    display:flex;
    min-height:170px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* PRINT DOCUMENT SPECIFIC */

.payer-panel[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.payer-panel small[b-42f0cvnf41] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.payer-panel h2[b-42f0cvnf41] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.payer-panel p[b-42f0cvnf41] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
    line-height:1.55;
}

.source-document-section[b-42f0cvnf41],
.amount-section[b-42f0cvnf41],
.reason-section[b-42f0cvnf41],
.refund-destination-section[b-42f0cvnf41],
.workflow-section[b-42f0cvnf41] {
    margin-top:16px;
}

.reference-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-42f0cvnf41] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.reference-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.43rem;
    word-break:break-word;
}

.amount-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.amount-grid article[b-42f0cvnf41] {
    min-height:88px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.amount-grid article.approved[b-42f0cvnf41] {
    background:#f2faf6;
}

.amount-grid article.fee[b-42f0cvnf41] {
    background:#fff9ed;
}

.amount-grid article.net[b-42f0cvnf41] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#73569b,#523976);
}

.amount-grid span[b-42f0cvnf41] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.amount-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.66rem;
}

.amount-grid small[b-42f0cvnf41] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.amount-grid .net span[b-42f0cvnf41],
.amount-grid .net strong[b-42f0cvnf41],
.amount-grid .net small[b-42f0cvnf41] {
    color:#fff;
}

.reason-document-grid[b-42f0cvnf41] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.reason-document-grid > div[b-42f0cvnf41] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.reason-document-grid span[b-42f0cvnf41] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.reason-document-grid strong[b-42f0cvnf41] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.43rem;
}

.reason-document-grid p[b-42f0cvnf41] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.40rem;
    line-height:1.6;
}

.officer-grid[b-42f0cvnf41] {
    grid-template-columns:repeat(4,minmax(0,1fr));
}

/* ATTACHMENT COLORS */

.attachment-card.request > span[b-42f0cvnf41] { background:rgba(10,114,87,.89); }
.attachment-card.refund > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.attachment-card.approval > span[b-42f0cvnf41] { background:rgba(115,86,155,.89); }
.attachment-card.void > span[b-42f0cvnf41] { background:rgba(181,77,67,.89); }
.attachment-card.source > span[b-42f0cvnf41] { background:rgba(52,115,75,.89); }
.attachment-card.document > span[b-42f0cvnf41] { background:rgba(152,118,52,.89); }
.attachment-card.map > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.attachment-card.invoice > span[b-42f0cvnf41] { background:rgba(115,86,155,.89); }
.attachment-card.previous > span[b-42f0cvnf41] { background:rgba(104,120,114,.89); }
.attachment-card.payment > span[b-42f0cvnf41] { background:rgba(47,120,159,.89); }
.attachment-card.receipt > span[b-42f0cvnf41] { background:rgba(52,115,75,.89); }

.view-payment-button[b-42f0cvnf41],
.view-transaction-button[b-42f0cvnf41] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.view-payment-button[b-42f0cvnf41] {
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.view-transaction-button[b-42f0cvnf41] {
    color:#2f789f;
    border:1px solid rgba(47,120,159,.14);
    background:#edf6fb;
}

@media (max-width: 1180px) {
    .type-overview[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-42f0cvnf41],
    .reference-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .refund-calculation-preview .calculation-grid[b-42f0cvnf41],
    .amount-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .source-payment-panel[b-42f0cvnf41] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .payer-panel[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .officer-grid[b-42f0cvnf41] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .type-overview[b-42f0cvnf41],
    .source-data-grid[b-42f0cvnf41],
    .refund-calculation-preview .calculation-grid[b-42f0cvnf41],
    .source-photo-grid[b-42f0cvnf41],
    .reference-grid[b-42f0cvnf41],
    .amount-grid[b-42f0cvnf41],
    .reason-document-grid[b-42f0cvnf41],
    .officer-grid[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-payment-panel[b-42f0cvnf41] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-42f0cvnf41] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-42f0cvnf41] {
        grid-column:1 / -1;
        width:100% !important;
    }
}

@media print {
    #refund-void-print-area[b-42f0cvnf41],
    #refund-void-print-area *[b-42f0cvnf41] {
        visibility:visible !important;
    }

    #refund-void-print-area[b-42f0cvnf41] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .refund-void-view-modal[b-42f0cvnf41] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-42f0cvnf41],
    .document-status-strip[b-42f0cvnf41],
    .payer-panel[b-42f0cvnf41],
    .source-document-section[b-42f0cvnf41],
    .amount-section[b-42f0cvnf41],
    .reason-section[b-42f0cvnf41],
    .refund-destination-section[b-42f0cvnf41],
    .workflow-section[b-42f0cvnf41],
    .document-footer[b-42f0cvnf41] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/02AccountBalanceWallet/Transactions.razor.rz.scp.css */
:root[b-xyxpfcas9o] {
    --tx-green: var(--theme-primary);
    --tx-deep: var(--theme-dark);
    --tx-gold: var(--theme-accent);
    --tx-blue: #2f789f;
    --tx-purple: #73569b;
    --tx-red: #b54d43;
    --tx-orange: #c46a2b;
    --tx-text: var(--theme-ink);
    --tx-muted: var(--theme-muted);
    --tx-border: rgba(10, 114, 87, .10);
    --tx-shadow: 0 14px 35px rgba(5, 62, 46, .07);
}

.transaction-page[b-xyxpfcas9o] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--tx-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.transaction-page[b-xyxpfcas9o]  .transaction-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.transaction-hero[b-xyxpfcas9o] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-xyxpfcas9o] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-xyxpfcas9o] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-xyxpfcas9o],
.hero-action-panel[b-xyxpfcas9o] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-xyxpfcas9o] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-xyxpfcas9o] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-xyxpfcas9o] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-xyxpfcas9o] {
    color: #d8ede6;
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-xyxpfcas9o] {
    margin-top: 3px;
    font-size: .58rem;
}

.transaction-hero h1[b-xyxpfcas9o] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.transaction-hero p[b-xyxpfcas9o] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .60rem;
    line-height: 1.85;
}

.hero-meta[b-xyxpfcas9o] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .43rem;
    font-weight: 650;
}

.hero-action-panel[b-xyxpfcas9o] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-xyxpfcas9o] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-xyxpfcas9o] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-xyxpfcas9o] {
    font-size: .51rem;
}

.hero-status small[b-xyxpfcas9o] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .40rem;
}

.hero-export-button[b-xyxpfcas9o],
.hero-payment-button[b-xyxpfcas9o],
.hero-refresh-button[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 11px;
    font-family: 'Kanit', sans-serif;
    font-size: .44rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-export-button[b-xyxpfcas9o] {
    color: #fff;
    border: 1px solid rgba(242,217,153,.25);
    background: linear-gradient(145deg, var(--theme-accent), #987634);
}

.hero-payment-button[b-xyxpfcas9o] {
    color: #d9f0e7;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
}

.hero-refresh-button[b-xyxpfcas9o] {
    color: rgba(255,255,255,.90);
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.06);
    cursor: pointer;
}

.hero-refresh-button:disabled[b-xyxpfcas9o] {
    opacity: .55;
    cursor: wait;
}

.transaction-page[b-xyxpfcas9o]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.transaction-page[b-xyxpfcas9o]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit', sans-serif;
}

/* SUMMARY */

.summary-grid[b-xyxpfcas9o] {
    margin-top: 2px !important;
}

.summary-card[b-xyxpfcas9o] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--tx-shadow);
}

.summary-card.income[b-xyxpfcas9o] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.refund[b-xyxpfcas9o] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.net[b-xyxpfcas9o] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.reconcile[b-xyxpfcas9o] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-xyxpfcas9o] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-xyxpfcas9o] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-xyxpfcas9o] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-xyxpfcas9o] {
    color: #788982;
    font-size: .43rem;
    font-weight: 650;
}

.summary-card p[b-xyxpfcas9o] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-xyxpfcas9o] {
    color: var(--theme-ink);
    font-size: 1.05rem;
    line-height: 1;
}

.summary-card p span[b-xyxpfcas9o] {
    color: #798a83;
    font-size: .42rem;
}

.summary-card em[b-xyxpfcas9o] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .40rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: repeat(8, minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-xyxpfcas9o],
.status-overview-card.selected[b-xyxpfcas9o] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-xyxpfcas9o] {
    background: #f5faf7;
}

.status-overview-card > span[b-xyxpfcas9o] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.invoice > span[b-xyxpfcas9o] { background:#987634; }
.status-overview-card.payment > span[b-xyxpfcas9o] { background:var(--theme-primary); }
.status-overview-card.refund > span[b-xyxpfcas9o] { background:#b54d43; }
.status-overview-card.pending > span[b-xyxpfcas9o] { background:#c46a2b; }
.status-overview-card.failed > span[b-xyxpfcas9o] { background:#b54d43; }
.status-overview-card.voided > span[b-xyxpfcas9o] { background:#687872; }
.status-overview-card.today > span[b-xyxpfcas9o] { background:#2f789f; }

.status-overview-card div[b-xyxpfcas9o] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.status-overview-card small[b-xyxpfcas9o] {
    color: var(--theme-muted);
    font-size: .38rem;
}

.status-overview-card strong[b-xyxpfcas9o] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: .64rem;
}

/* INSIGHT */

.insight-grid[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-xyxpfcas9o] {
    padding: 15px;
    border: 1px solid var(--tx-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--tx-shadow);
}

.insight-heading[b-xyxpfcas9o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-xyxpfcas9o] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-xyxpfcas9o] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .73rem;
}

.insight-heading > span[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .42rem;
    font-weight: 700;
}

.method-grid[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.method-card[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit', sans-serif;
    text-align: left;
    cursor: pointer;
    transition: .16s ease;
}

.method-card:hover[b-xyxpfcas9o] {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(5,62,46,.08);
}

.method-card > span[b-xyxpfcas9o] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.method-card.cash > span[b-xyxpfcas9o] { color:var(--theme-primary); background:#e7f5ef; }
.method-card.qr > span[b-xyxpfcas9o] { color:#2f789f; background:#e8f3f8; }
.method-card.transfer > span[b-xyxpfcas9o] { color:#73569b; background:#f0eafb; }
.method-card.card > span[b-xyxpfcas9o] { color:#987634; background:#fff4df; }

.method-card strong[b-xyxpfcas9o] {
    display: block;
    color: #3c5047;
    font-size: .48rem;
}

.method-card small[b-xyxpfcas9o] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .38rem;
}

.reconciliation-progress[b-xyxpfcas9o] {
    margin-top: 13px;
}

.progress-track[b-xyxpfcas9o] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-xyxpfcas9o] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
    transition: width .25s ease;
}

.reconciliation-metrics[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.reconciliation-metrics > div[b-xyxpfcas9o] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.reconciliation-metrics small[b-xyxpfcas9o] {
    display: block;
    color: #87958f;
    font-size: .39rem;
}

.reconciliation-metrics strong[b-xyxpfcas9o] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .55rem;
}

/* FILTER */

.filter-panel[b-xyxpfcas9o],
.transaction-list-panel[b-xyxpfcas9o] {
    margin-top: 14px;
    border: 1px solid var(--tx-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--tx-shadow);
}

.filter-panel[b-xyxpfcas9o] {
    padding: 15px;
}

.filter-heading[b-xyxpfcas9o],
.list-toolbar[b-xyxpfcas9o] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-xyxpfcas9o],
.panel-kicker[b-xyxpfcas9o] {
    color: #987634;
    font-size: .44rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-xyxpfcas9o],
.list-toolbar h2[b-xyxpfcas9o] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: .76rem;
}

.filter-heading p[b-xyxpfcas9o],
.list-toolbar p[b-xyxpfcas9o] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .43rem;
    line-height: 1.65;
}

.clear-filter-button[b-xyxpfcas9o],
.toolbar-export-button[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border-radius: 10px;
    font-family: 'Kanit', sans-serif;
    font-size: .42rem;
    font-weight: 700;
    text-decoration: none;
}

.clear-filter-button[b-xyxpfcas9o] {
    border: 1px solid rgba(10,114,87,.12);
    color: var(--theme-primary);
    background: #edf7f3;
    cursor: pointer;
}

.toolbar-export-button[b-xyxpfcas9o] {
    border: 1px solid rgba(152,118,52,.15);
    color: #987634;
    background: #fff7e8;
}

.filter-grid[b-xyxpfcas9o] {
    margin-top: 8px !important;
}

.transaction-page[b-xyxpfcas9o]  .premium-field {
    font-family: 'Kanit', sans-serif !important;
}

.transaction-page[b-xyxpfcas9o]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit', sans-serif !important;
    font-size: .42rem !important;
    text-transform: none !important;
}

.filter-summary[b-xyxpfcas9o] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .40rem;
}

.filter-summary strong[b-xyxpfcas9o] {
    color: var(--theme-primary);
}

/* TABLE */

.transaction-list-panel[b-xyxpfcas9o] {
    overflow: hidden;
}

.list-toolbar[b-xyxpfcas9o] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.empty-state[b-xyxpfcas9o] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-xyxpfcas9o] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-xyxpfcas9o] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: .66rem;
}

.empty-state p[b-xyxpfcas9o] {
    margin: 0;
    font-size: .43rem;
}

.transaction-page[b-xyxpfcas9o]  .transaction-table {
    font-family: 'Kanit', sans-serif;
}

.transaction-page[b-xyxpfcas9o]  .transaction-table .mud-table-head {
    background: #f1f7f4;
}

.transaction-page[b-xyxpfcas9o]  .transaction-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .42rem;
    vertical-align: middle;
}

.transaction-code-photo-cell[b-xyxpfcas9o] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.transaction-photo-mini[b-xyxpfcas9o] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.transaction-photo-mini button[b-xyxpfcas9o] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.transaction-photo-mini img[b-xyxpfcas9o] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.transaction-code-photo-cell strong[b-xyxpfcas9o] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .44rem;
    font-weight: 760;
    white-space: nowrap;
}

.transaction-code-photo-cell small[b-xyxpfcas9o] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .37rem;
}

.date-type-cell[b-xyxpfcas9o],
.payer-reference-cell[b-xyxpfcas9o],
.method-batch-cell[b-xyxpfcas9o],
.amount-cell[b-xyxpfcas9o],
.balance-cell[b-xyxpfcas9o],
.status-reconciliation-cell[b-xyxpfcas9o] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.payer-reference-cell[b-xyxpfcas9o] {
    min-width: 185px;
}

.date-type-cell strong[b-xyxpfcas9o],
.payer-reference-cell strong[b-xyxpfcas9o],
.method-batch-cell strong[b-xyxpfcas9o],
.amount-cell strong[b-xyxpfcas9o],
.balance-cell strong[b-xyxpfcas9o] {
    color: #3c5047;
    font-size: .49rem;
    line-height: 1.48;
}

.payer-reference-cell small[b-xyxpfcas9o],
.method-batch-cell small[b-xyxpfcas9o],
.amount-cell small[b-xyxpfcas9o],
.balance-cell small[b-xyxpfcas9o] {
    margin-top: 3px;
    color: #84928d;
    font-size: .39rem;
    line-height: 1.5;
}

.payer-reference-cell em[b-xyxpfcas9o],
.method-batch-cell em[b-xyxpfcas9o] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .35rem;
    font-style: normal;
    font-weight: 650;
}

.type-chip[b-xyxpfcas9o],
.status-chip[b-xyxpfcas9o],
.reconcile-chip[b-xyxpfcas9o] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .37rem;
    font-weight: 700;
}

.date-type-cell .type-chip[b-xyxpfcas9o] {
    margin-top: 5px;
}

.type-chip.invoice-issued[b-xyxpfcas9o] { color:#987634; background:#fff4df; }
.type-chip.payment-receipt[b-xyxpfcas9o] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.payment-pending[b-xyxpfcas9o] { color:#c46a2b; background:#fff2e7; }
.type-chip.payment-failed[b-xyxpfcas9o] { color:#b54d43; background:#fff0ee; }
.type-chip.refund[b-xyxpfcas9o] { color:#73569b; background:#f0eafb; }
.type-chip.void[b-xyxpfcas9o] { color:#687872; background:#edf1ef; }

.status-chip i[b-xyxpfcas9o] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.posted[b-xyxpfcas9o] { color:#34734b; background:#e7f5ec; }
.status-chip.pending[b-xyxpfcas9o] { color:#987634; background:#fff4df; }
.status-chip.failed[b-xyxpfcas9o] { color:#ad4037; background:#fff0ee; }
.status-chip.voided[b-xyxpfcas9o] { color:#687872; background:#edf1ef; }

.status-reconciliation-cell[b-xyxpfcas9o] {
    gap: 5px;
    align-items: flex-start;
}

.reconcile-chip.recon-matched[b-xyxpfcas9o] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.recon-pending[b-xyxpfcas9o] { color:#987634; background:#fff4df; }
.reconcile-chip.recon-difference[b-xyxpfcas9o] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.recon-manual-review[b-xyxpfcas9o] { color:#73569b; background:#f0eafb; }
.reconcile-chip.recon-not-required[b-xyxpfcas9o] { color:#687872; background:#edf1ef; }

.amount-cell.direction-in strong[b-xyxpfcas9o] {
    color: var(--theme-primary);
}

.amount-cell.direction-out strong[b-xyxpfcas9o] {
    color: #b54d43;
}

.amount-cell.direction-none strong[b-xyxpfcas9o] {
    color: #687872;
}

.balance-cell strong[b-xyxpfcas9o] {
    color: #2f789f;
}

.row-actions[b-xyxpfcas9o] {
    display: flex;
    min-width: 150px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.transaction-page[b-xyxpfcas9o]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.transaction-page[b-xyxpfcas9o]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.transaction-page[b-xyxpfcas9o]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-payment-action[b-xyxpfcas9o],
.row-invoice-action[b-xyxpfcas9o] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 9px;
    text-decoration: none;
}

.row-payment-action[b-xyxpfcas9o] {
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.row-invoice-action[b-xyxpfcas9o] {
    color:#987634;
    border:1px solid rgba(152,118,52,.14);
    background:#fff7e8;
}

.pagination-bar[b-xyxpfcas9o] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .41rem;
}

/* MODAL */

.modal-backdrop[b-xyxpfcas9o],
.image-preview-backdrop[b-xyxpfcas9o] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.transaction-view-modal[b-xyxpfcas9o],
.image-preview-modal[b-xyxpfcas9o] {
    width: min(1180px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.view-toolbar[b-xyxpfcas9o],
.image-preview-header[b-xyxpfcas9o] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.view-toolbar small[b-xyxpfcas9o],
.image-preview-header small[b-xyxpfcas9o] {
    color:#987634;
    font-size:.43rem;
    font-weight:700;
    letter-spacing:.08em;
}

.view-toolbar h2[b-xyxpfcas9o],
.image-preview-header h3[b-xyxpfcas9o] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.view-toolbar > div:last-child[b-xyxpfcas9o] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-payment-button[b-xyxpfcas9o],
.view-invoice-button[b-xyxpfcas9o],
.view-source-button[b-xyxpfcas9o] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.40rem;
    font-weight:700;
    text-decoration:none;
}

.view-payment-button[b-xyxpfcas9o] {
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.view-invoice-button[b-xyxpfcas9o] {
    color:#987634;
    border:1px solid rgba(152,118,52,.14);
    background:#fff7e8;
}

.view-source-button[b-xyxpfcas9o] {
    color:#2f789f;
    border:1px solid rgba(47,120,159,.14);
    background:#edf6fb;
}

.transaction-page[b-xyxpfcas9o]  .view-print-button {
    min-height:36px;
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.40rem !important;
    text-transform:none !important;
}

.view-scroll[b-xyxpfcas9o] {
    max-height: calc(100vh - 96px);
    overflow: auto;
    padding: 15px;
    background: #e9efec;
}

.print-transaction[b-xyxpfcas9o] {
    width: min(900px,100%);
    margin: 0 auto;
    padding: 34px 38px;
    border: 1px solid rgba(10,72,56,.12);
    border-radius: 4px;
    color: #263c33;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    box-shadow: 0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-xyxpfcas9o] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-xyxpfcas9o] {
    text-align:center;
}

.document-organization small[b-xyxpfcas9o] {
    color:#987634;
    font-size:.48rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-xyxpfcas9o] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.18rem;
}

.document-organization p[b-xyxpfcas9o] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.50rem;
}

.document-number-box[b-xyxpfcas9o] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-xyxpfcas9o],
.document-number-box small[b-xyxpfcas9o] {
    display:block;
    color:#778980;
    font-size:.40rem;
}

.document-number-box strong[b-xyxpfcas9o] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.50rem;
    word-break:break-word;
}

.document-status-strip[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:minmax(135px,.9fr) minmax(120px,.8fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-xyxpfcas9o] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-xyxpfcas9o] {
    display:block;
    color:#83918b;
    font-size:.38rem;
}

.document-status-strip > div strong[b-xyxpfcas9o] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.43rem;
}

.party-panel[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.party-panel small[b-xyxpfcas9o] {
    color:#2f789f;
    font-size:.40rem;
    font-weight:700;
    letter-spacing:.06em;
}

.party-panel h2[b-xyxpfcas9o] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:.72rem;
}

.party-panel p[b-xyxpfcas9o] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.42rem;
    line-height:1.55;
}

.service-reference-box[b-xyxpfcas9o] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.service-reference-box span[b-xyxpfcas9o] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.service-reference-box strong[b-xyxpfcas9o] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.49rem;
}

.service-reference-box small[b-xyxpfcas9o] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-summary-section[b-xyxpfcas9o],
.reference-section[b-xyxpfcas9o],
.ledger-section[b-xyxpfcas9o],
.reconciliation-section[b-xyxpfcas9o],
.officer-section[b-xyxpfcas9o] {
    margin-top:16px;
}

.section-title[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-xyxpfcas9o] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.48rem;
    font-weight:800;
}

.section-title small[b-xyxpfcas9o] {
    color:#987634;
    font-size:.39rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-xyxpfcas9o] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.61rem;
}

.amount-summary-grid[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.amount-summary-grid article[b-xyxpfcas9o] {
    min-height:88px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.amount-summary-grid article.direction.direction-in[b-xyxpfcas9o] {
    border-color:rgba(10,114,87,.13);
    background:#f2faf6;
}

.amount-summary-grid article.direction.direction-out[b-xyxpfcas9o] {
    border-color:rgba(181,77,67,.13);
    background:#fff7f5;
}

.amount-summary-grid article.balance[b-xyxpfcas9o] {
    border-color:rgba(47,120,159,.13);
    background:#f4fafc;
}

.amount-summary-grid span[b-xyxpfcas9o] {
    display:block;
    color:#84928c;
    font-size:.39rem;
}

.amount-summary-grid strong[b-xyxpfcas9o] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:.66rem;
}

.amount-summary-grid article.direction-in strong[b-xyxpfcas9o] { color:var(--theme-primary); }
.amount-summary-grid article.direction-out strong[b-xyxpfcas9o] { color:#b54d43; }
.amount-summary-grid article.balance strong[b-xyxpfcas9o] { color:#2f789f; }

.amount-summary-grid small[b-xyxpfcas9o] {
    display:block;
    color:#798a83;
    font-size:.36rem;
}

.reference-grid[b-xyxpfcas9o],
.reconciliation-detail-grid[b-xyxpfcas9o],
.officer-grid[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-xyxpfcas9o],
.reconciliation-detail-grid > div[b-xyxpfcas9o],
.officer-grid > div[b-xyxpfcas9o] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-xyxpfcas9o],
.reconciliation-detail-grid span[b-xyxpfcas9o],
.officer-grid span[b-xyxpfcas9o] {
    display:block;
    color:#87958f;
    font-size:.37rem;
}

.reference-grid strong[b-xyxpfcas9o],
.reconciliation-detail-grid strong[b-xyxpfcas9o],
.officer-grid strong[b-xyxpfcas9o] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.43rem;
    word-break:break-word;
}

.reconciliation-detail-grid strong.recon-matched[b-xyxpfcas9o] { color:#34734b; }
.reconciliation-detail-grid strong.recon-pending[b-xyxpfcas9o] { color:#987634; }
.reconciliation-detail-grid strong.recon-difference[b-xyxpfcas9o] { color:#b54d43; }
.reconciliation-detail-grid strong.recon-manual-review[b-xyxpfcas9o] { color:#73569b; }
.reconciliation-detail-grid strong.recon-not-required[b-xyxpfcas9o] { color:#687872; }

.reconciliation-detail-grid strong.risk-normal[b-xyxpfcas9o] { color:#34734b; }
.reconciliation-detail-grid strong.risk-watch[b-xyxpfcas9o] { color:#987634; }
.reconciliation-detail-grid strong.risk-high[b-xyxpfcas9o] { color:#b54d43; }

.ledger-table[b-xyxpfcas9o] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.ledger-header[b-xyxpfcas9o],
.ledger-row[b-xyxpfcas9o],
.ledger-total[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:45px 95px 170px minmax(0,1fr) 110px 110px;
    min-width:760px;
    align-items:center;
}

.ledger-header[b-xyxpfcas9o] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.ledger-header span[b-xyxpfcas9o],
.ledger-row span[b-xyxpfcas9o],
.ledger-total span[b-xyxpfcas9o] {
    padding:8px 7px;
    font-size:.38rem;
}

.ledger-row[b-xyxpfcas9o] {
    min-height:54px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.ledger-row span:not(:first-child)[b-xyxpfcas9o],
.ledger-total span:not(:first-child)[b-xyxpfcas9o] {
    border-left:1px solid rgba(10,114,87,.06);
}

.ledger-total[b-xyxpfcas9o] {
    min-height:44px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.reconciliation-note[b-xyxpfcas9o],
.transaction-note[b-xyxpfcas9o] {
    margin-top:8px;
    padding:10px;
    border-radius:9px;
}

.reconciliation-note[b-xyxpfcas9o] {
    border:1px solid rgba(10,114,87,.10);
    background:#f5faf8;
}

.transaction-note[b-xyxpfcas9o] {
    border:1px solid rgba(47,120,159,.10);
    background:#f4fafc;
}

.reconciliation-note strong[b-xyxpfcas9o],
.transaction-note strong[b-xyxpfcas9o] {
    color:var(--theme-primary);
    font-size:.42rem;
}

.transaction-note strong[b-xyxpfcas9o] {
    color:#2f789f;
}

.reconciliation-note p[b-xyxpfcas9o],
.transaction-note p[b-xyxpfcas9o] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.42rem;
    line-height:1.6;
}

.officer-grid[b-xyxpfcas9o] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.officer-grid > div[b-xyxpfcas9o] {
    min-height:105px;
    padding-top:18px;
    text-align:center;
}

.officer-grid > div[b-xyxpfcas9o]::before {
    display:block;
    width:80%;
    height:1px;
    margin:0 auto 11px;
    background:rgba(48,71,61,.28);
    content:"";
}

.officer-grid em[b-xyxpfcas9o] {
    display:block;
    margin-top:5px;
    color:#87958f;
    font-size:.35rem;
    font-style:normal;
}

.document-footer[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-xyxpfcas9o] {
    color:var(--theme-primary);
    font-size:.43rem;
}

.document-footer p[b-xyxpfcas9o] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.39rem;
    line-height:1.6;
}

.qr-placeholder[b-xyxpfcas9o] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-xyxpfcas9o] {
    font-size:.33rem;
    font-weight:700;
}

.mock-document-label[b-xyxpfcas9o] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.35rem;
    font-weight:700;
    text-align:center;
}

/* MAP & PHOTOS */

.google-map-panel[b-xyxpfcas9o],
.attachment-panel[b-xyxpfcas9o] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.google-map-panel[b-xyxpfcas9o] {
    overflow:hidden;
    padding:0;
}

.section-heading[b-xyxpfcas9o] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.google-map-panel .section-heading[b-xyxpfcas9o] {
    padding:11px 13px;
}

.section-heading small[b-xyxpfcas9o] {
    color:#987634;
    font-size:.42rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-xyxpfcas9o] {
    margin:3px 0 0;
    color:#34483f;
    font-size:.65rem;
}

.section-heading > span[b-xyxpfcas9o] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.39rem;
    font-weight:700;
}

.google-map-panel iframe[b-xyxpfcas9o] {
    display:block;
    width:100%;
    height:350px;
    border:0;
}

.attachment-grid[b-xyxpfcas9o] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-xyxpfcas9o] {
    position:relative;
    min-height:155px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-xyxpfcas9o] {
    width:100%;
    height:155px;
    object-fit:cover;
}

.attachment-card > span[b-xyxpfcas9o] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.37rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.source-primary > span[b-xyxpfcas9o] { background:rgba(10,114,87,.89); }
.attachment-card.source-document > span[b-xyxpfcas9o] { background:rgba(152,118,52,.89); }
.attachment-card.source-map > span[b-xyxpfcas9o] { background:rgba(47,120,159,.89); }
.attachment-card.invoice > span[b-xyxpfcas9o] { background:rgba(115,86,155,.89); }
.attachment-card.payment > span[b-xyxpfcas9o] { background:rgba(47,120,159,.89); }
.attachment-card.receipt > span[b-xyxpfcas9o] { background:rgba(52,115,75,.89); }

.attachment-empty[b-xyxpfcas9o] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

.image-preview-modal[b-xyxpfcas9o] {
    width:min(1120px,calc(100vw - 28px));
    max-height:calc(100vh - 28px);
    overflow:hidden;
    border-radius:18px;
    background:#fff;
}

.image-preview-body[b-xyxpfcas9o] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-xyxpfcas9o] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

/* RESPONSIVE */

@media (max-width: 1450px) {
    .status-overview[b-xyxpfcas9o] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .method-grid[b-xyxpfcas9o] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .reference-grid[b-xyxpfcas9o],
    .reconciliation-detail-grid[b-xyxpfcas9o] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .transaction-hero[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-xyxpfcas9o] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-xyxpfcas9o] {
        grid-column:1 / -1;
    }

    .document-header[b-xyxpfcas9o] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-xyxpfcas9o] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-xyxpfcas9o] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .party-panel[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .transaction-page[b-xyxpfcas9o] {
        padding-top:10px;
    }

    .transaction-page[b-xyxpfcas9o]  .transaction-container {
        padding-inline:10px !important;
    }

    .transaction-hero[b-xyxpfcas9o] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-xyxpfcas9o],
    .list-toolbar[b-xyxpfcas9o],
    .view-toolbar[b-xyxpfcas9o],
    .section-heading[b-xyxpfcas9o] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-xyxpfcas9o],
    .method-grid[b-xyxpfcas9o],
    .reconciliation-metrics[b-xyxpfcas9o],
    .amount-summary-grid[b-xyxpfcas9o],
    .reference-grid[b-xyxpfcas9o],
    .reconciliation-detail-grid[b-xyxpfcas9o],
    .officer-grid[b-xyxpfcas9o],
    .attachment-grid[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-toolbar > div:last-child[b-xyxpfcas9o] {
        width:100%;
    }

    .print-transaction[b-xyxpfcas9o] {
        padding:22px 18px;
    }

    .document-footer[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .google-map-panel iframe[b-xyxpfcas9o] {
        height:280px;
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-xyxpfcas9o] {
        grid-column:auto;
    }

    .status-overview[b-xyxpfcas9o],
    .document-status-strip[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-payment-button[b-xyxpfcas9o],
    .view-invoice-button[b-xyxpfcas9o],
    .view-source-button[b-xyxpfcas9o] {
        width:100%;
    }

    .document-header[b-xyxpfcas9o] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-xyxpfcas9o] {
        margin:0 auto;
    }

    .google-map-panel iframe[b-xyxpfcas9o] {
        height:250px;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-xyxpfcas9o] {
        visibility:hidden !important;
    }

    #transaction-print-area[b-xyxpfcas9o],
    #transaction-print-area *[b-xyxpfcas9o] {
        visibility:visible !important;
    }

    #transaction-print-area[b-xyxpfcas9o] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-xyxpfcas9o] {
        display:none !important;
    }

    .modal-backdrop[b-xyxpfcas9o],
    .transaction-view-modal[b-xyxpfcas9o],
    .view-scroll[b-xyxpfcas9o] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-xyxpfcas9o],
    .document-status-strip[b-xyxpfcas9o],
    .party-panel[b-xyxpfcas9o],
    .amount-summary-section[b-xyxpfcas9o],
    .reference-section[b-xyxpfcas9o],
    .ledger-section[b-xyxpfcas9o],
    .reconciliation-section[b-xyxpfcas9o],
    .officer-section[b-xyxpfcas9o],
    .document-footer[b-xyxpfcas9o] {
        break-inside:avoid;
    }

    .mock-document-label[b-xyxpfcas9o] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}
/* /Components/Pages/02Specialized/03HealthAndSafety/DisabledCare.razor.rz.scp.css */
:root[b-wxtq78yoro] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.disabled-care-page[b-wxtq78yoro] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-care-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.disabled-hero[b-wxtq78yoro] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-wxtq78yoro] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-wxtq78yoro] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-wxtq78yoro],
.hero-action-panel[b-wxtq78yoro] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-wxtq78yoro] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-wxtq78yoro] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-wxtq78yoro] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-wxtq78yoro] {
    color: #d8ede6;
    font-size: .81rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-wxtq78yoro] {
    margin-top: 3px;
    font-size: .94rem;
}

.disabled-hero h1[b-wxtq78yoro] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.disabled-hero p[b-wxtq78yoro] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-wxtq78yoro] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .78rem;
    font-weight: 650;
}

.hero-action-panel[b-wxtq78yoro] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-wxtq78yoro] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-wxtq78yoro] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-wxtq78yoro] {
    font-size: .85rem;
}

.hero-status small[b-wxtq78yoro] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .78rem;
}

.disabled-care-page[b-wxtq78yoro]  .hero-add-button,
.disabled-care-page[b-wxtq78yoro]  .toolbar-add-button,
.disabled-care-page[b-wxtq78yoro]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.disabled-care-page[b-wxtq78yoro]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-wxtq78yoro],
.hero-refresh-button[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-wxtq78yoro] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-wxtq78yoro] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-wxtq78yoro] {
    opacity: .55;
    cursor: wait;
}

.disabled-care-page[b-wxtq78yoro]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.disabled-care-page[b-wxtq78yoro]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-wxtq78yoro] {
    margin-top: 2px !important;
}

.summary-card[b-wxtq78yoro] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-wxtq78yoro] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-wxtq78yoro] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-wxtq78yoro] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-wxtq78yoro] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-wxtq78yoro] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-wxtq78yoro] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-wxtq78yoro] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-wxtq78yoro] {
    color: #788982;
    font-size: .78rem;
    font-weight: 650;
}

.summary-card p[b-wxtq78yoro] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-wxtq78yoro] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-wxtq78yoro] {
    color: #798a83;
    font-size: .78rem;
}

.summary-card em[b-wxtq78yoro] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-wxtq78yoro],
.status-overview-card.selected[b-wxtq78yoro] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-wxtq78yoro] {
    background: #f5faf7;
}

.status-overview-card > span[b-wxtq78yoro] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-wxtq78yoro] { background:#687872; }
.status-overview-card.reviewing > span[b-wxtq78yoro] { background:#987634; }
.status-overview-card.difference > span[b-wxtq78yoro] { background:#b54d43; }
.status-overview-card.approved > span[b-wxtq78yoro] { background:#2f789f; }
.status-overview-card.closed > span[b-wxtq78yoro] { background:#34734b; }
.status-overview-card.voided > span[b-wxtq78yoro] { background:#687872; }
.status-overview-card.today > span[b-wxtq78yoro] { background:#73569b; }

.status-overview-card div[b-wxtq78yoro] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-wxtq78yoro] {
    color: var(--theme-muted);
    font-size: .78rem;
}

.status-overview-card strong[b-wxtq78yoro] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-wxtq78yoro] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-wxtq78yoro] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-wxtq78yoro] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-wxtq78yoro] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .78rem;
    font-weight: 700;
}

.variance-grid[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-wxtq78yoro] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-wxtq78yoro] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-wxtq78yoro] {
    display: block;
    color: #3c5047;
    font-size: .81rem;
}

.variance-card small[b-wxtq78yoro] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .78rem;
}

.closing-progress[b-wxtq78yoro] {
    margin-top: 13px;
}

.progress-track[b-wxtq78yoro] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-wxtq78yoro] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-wxtq78yoro] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-wxtq78yoro] {
    display: block;
    color: #87958f;
    font-size: .78rem;
}

.progress-metrics strong[b-wxtq78yoro] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-wxtq78yoro],
.disabled-list-panel[b-wxtq78yoro] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-wxtq78yoro] {
    padding: 15px;
}

.filter-heading[b-wxtq78yoro],
.list-toolbar[b-wxtq78yoro] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-wxtq78yoro],
.panel-kicker[b-wxtq78yoro] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-wxtq78yoro],
.list-toolbar h2[b-wxtq78yoro] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-wxtq78yoro],
.list-toolbar p[b-wxtq78yoro] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .78rem;
    line-height: 1.65;
}

.clear-filter-button[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-wxtq78yoro] {
    margin-top: 8px !important;
}

.disabled-care-page[b-wxtq78yoro]  .premium-field,
.disabled-care-page[b-wxtq78yoro]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.disabled-care-page[b-wxtq78yoro]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    text-transform: none !important;
}

.filter-summary[b-wxtq78yoro] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .78rem;
}

.filter-summary strong[b-wxtq78yoro] {
    color: var(--theme-primary);
}

.disabled-list-panel[b-wxtq78yoro] {
    overflow: hidden;
}

.list-toolbar[b-wxtq78yoro] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.disabled-care-page[b-wxtq78yoro]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-wxtq78yoro] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-wxtq78yoro] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-wxtq78yoro] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-wxtq78yoro] {
    margin: 0;
    font-size: .78rem;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table {
    font-family: 'Kanit',sans-serif;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-head {
    background: #f1f7f4;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .78rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-wxtq78yoro] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-wxtq78yoro] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-wxtq78yoro] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .78rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-wxtq78yoro] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .78rem;
}

.date-shift-cell[b-wxtq78yoro],
.counter-cashier-cell[b-wxtq78yoro],
.money-cell[b-wxtq78yoro],
.difference-cell[b-wxtq78yoro],
.transaction-status-cell[b-wxtq78yoro] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-wxtq78yoro] {
    min-width: 175px;
}

.date-shift-cell strong[b-wxtq78yoro],
.counter-cashier-cell strong[b-wxtq78yoro],
.money-cell strong[b-wxtq78yoro],
.difference-cell strong[b-wxtq78yoro],
.transaction-status-cell strong[b-wxtq78yoro] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-wxtq78yoro],
.counter-cashier-cell small[b-wxtq78yoro],
.money-cell small[b-wxtq78yoro],
.difference-cell small[b-wxtq78yoro] {
    margin-top: 3px;
    color: #84928d;
    font-size: .78rem;
}

.date-shift-cell em[b-wxtq78yoro],
.counter-cashier-cell em[b-wxtq78yoro] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-wxtq78yoro] { color:var(--theme-primary); }
.money-cell.actual strong[b-wxtq78yoro] { color:#2f789f; }

.difference-cell.matched strong[b-wxtq78yoro] { color:#34734b; }
.difference-cell.over strong[b-wxtq78yoro] { color:#987634; }
.difference-cell.short strong[b-wxtq78yoro] { color:#b54d43; }

.status-chip[b-wxtq78yoro],
.match-chip[b-wxtq78yoro] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
}

.status-chip i[b-wxtq78yoro] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.status-chip.difference[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-wxtq78yoro] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-wxtq78yoro] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-wxtq78yoro] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.disabled-care-page[b-wxtq78yoro]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.disabled-care-page[b-wxtq78yoro]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.disabled-care-page[b-wxtq78yoro]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.disabled-care-page[b-wxtq78yoro]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.disabled-care-page[b-wxtq78yoro]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-wxtq78yoro] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-wxtq78yoro] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .78rem;
}

/* MODALS */

.modal-backdrop[b-wxtq78yoro],
.image-preview-backdrop[b-wxtq78yoro] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.disabled-form-modal[b-wxtq78yoro],
.disabled-view-modal[b-wxtq78yoro],
.delete-modal[b-wxtq78yoro],
.image-preview-modal[b-wxtq78yoro] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-wxtq78yoro],
.view-toolbar[b-wxtq78yoro],
.image-preview-header[b-wxtq78yoro] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-wxtq78yoro] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-wxtq78yoro] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-wxtq78yoro],
.view-toolbar small[b-wxtq78yoro],
.image-preview-header small[b-wxtq78yoro] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-wxtq78yoro],
.view-toolbar h2[b-wxtq78yoro],
.image-preview-header h3[b-wxtq78yoro] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-wxtq78yoro] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.modal-body[b-wxtq78yoro],
.view-scroll[b-wxtq78yoro] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-wxtq78yoro] {
    background: #e9efec;
}

.modal-footer[b-wxtq78yoro] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.disabled-care-page[b-wxtq78yoro]  .cancel-button,
.disabled-care-page[b-wxtq78yoro]  .save-button,
.disabled-care-page[b-wxtq78yoro]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.form-section-title[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-wxtq78yoro] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-wxtq78yoro] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-wxtq78yoro] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-wxtq78yoro] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.open-transactions-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-wxtq78yoro] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-wxtq78yoro],
.calculation-heading[b-wxtq78yoro] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-wxtq78yoro],
.calculation-heading small[b-wxtq78yoro] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-wxtq78yoro],
.calculation-heading h3[b-wxtq78yoro] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-wxtq78yoro],
.calculation-heading > span[b-wxtq78yoro] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-wxtq78yoro] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-wxtq78yoro] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-wxtq78yoro] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.source-summary-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-wxtq78yoro] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-wxtq78yoro] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-wxtq78yoro] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-wxtq78yoro] {
    display:block;
    color:#84928d;
    font-size:.78rem;
}

.system-amount-card strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.reconciliation-calculation-preview[b-wxtq78yoro] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-wxtq78yoro] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-wxtq78yoro] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-wxtq78yoro] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-wxtq78yoro] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-wxtq78yoro] {
    display:block;
    color:#8b7b74;
    font-size:.78rem;
}

.calculation-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-wxtq78yoro] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.78rem;
}

.calculation-grid .short span[b-wxtq78yoro],
.calculation-grid .short strong[b-wxtq78yoro],
.calculation-grid .short small[b-wxtq78yoro] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-wxtq78yoro] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-wxtq78yoro] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-wxtq78yoro] {
    display:block;
    color:#3c5047;
    font-size:.80rem;
}

.photo-upload-heading small[b-wxtq78yoro] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.photo-preview[b-wxtq78yoro] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-wxtq78yoro] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-wxtq78yoro] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-wxtq78yoro] {
    color:#40544b;
    font-size:.80rem;
}

.photo-empty small[b-wxtq78yoro] {
    font-size:.78rem;
}

.photo-upload-actions[b-wxtq78yoro] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-wxtq78yoro],
.remove-photo-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-wxtq78yoro] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-wxtq78yoro] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-wxtq78yoro] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-wxtq78yoro],
.detail-transaction-table[b-wxtq78yoro] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-wxtq78yoro],
.source-transaction-row[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-wxtq78yoro] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-wxtq78yoro],
.source-transaction-row > span[b-wxtq78yoro] {
    padding:7px;
    font-size:.78rem;
}

.source-transaction-row[b-wxtq78yoro] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-wxtq78yoro] {
    border-bottom:0;
}

.mini-photo-button[b-wxtq78yoro] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-wxtq78yoro],
.source-transaction-more[b-wxtq78yoro] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.78rem;
    text-align:center;
}

.mock-rule-warning[b-wxtq78yoro] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.78rem !important;
}

/* VIEW & PRINT */

.disabled-view-modal[b-wxtq78yoro] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-wxtq78yoro] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.disabled-care-page[b-wxtq78yoro]  .view-edit-button,
.disabled-care-page[b-wxtq78yoro]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.disabled-care-page[b-wxtq78yoro]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-disabled-care[b-wxtq78yoro] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-wxtq78yoro] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-wxtq78yoro] {
    text-align:center;
}

.document-organization small[b-wxtq78yoro] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-wxtq78yoro] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-wxtq78yoro] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-wxtq78yoro] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-wxtq78yoro],
.document-number-box small[b-wxtq78yoro] {
    display:block;
    color:#778980;
    font-size:.78rem;
}

.document-number-box strong[b-wxtq78yoro] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-wxtq78yoro] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-wxtq78yoro] {
    display:block;
    color:#83918b;
    font-size:.78rem;
}

.document-status-strip > div strong[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.78rem;
}

.scope-panel[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-wxtq78yoro] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-wxtq78yoro] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
}

.scope-reference-box[b-wxtq78yoro] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.scope-reference-box strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.81rem;
}

.scope-reference-box small[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-wxtq78yoro],
.transaction-summary-section[b-wxtq78yoro],
.source-transaction-section[b-wxtq78yoro],
.review-section[b-wxtq78yoro] {
    margin-top:16px;
}

.section-title[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-wxtq78yoro] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.82rem;
    font-weight:800;
}

.section-title small[b-wxtq78yoro] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-wxtq78yoro] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-wxtq78yoro] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-wxtq78yoro],
.comparison-row[b-wxtq78yoro],
.comparison-total[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-wxtq78yoro] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-wxtq78yoro],
.comparison-row span[b-wxtq78yoro],
.comparison-total span[b-wxtq78yoro] {
    padding:8px 9px;
    font-size:.78rem;
}

.comparison-row[b-wxtq78yoro] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-wxtq78yoro],
.comparison-total span:not(:first-child)[b-wxtq78yoro] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-wxtq78yoro] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-wxtq78yoro] { color:#34734b; }
.difference-text.over[b-wxtq78yoro] { color:#987634; }
.difference-text.short[b-wxtq78yoro] { color:#b54d43; }

.transaction-summary-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-wxtq78yoro] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-wxtq78yoro] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-wxtq78yoro] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-wxtq78yoro] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-wxtq78yoro] { background:#f4fafc; }

.transaction-summary-grid span[b-wxtq78yoro] {
    display:block;
    color:#84928c;
    font-size:.78rem;
}

.transaction-summary-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-wxtq78yoro] {
    display:block;
    color:#798a83;
    font-size:.78rem;
}

.detail-transaction-header[b-wxtq78yoro],
.detail-transaction-row[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-wxtq78yoro] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-wxtq78yoro],
.detail-transaction-row span[b-wxtq78yoro] {
    padding:8px 7px;
    font-size:.78rem;
}

.detail-transaction-row[b-wxtq78yoro] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-wxtq78yoro] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.review-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
}

.review-note-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-wxtq78yoro] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.78rem;
}

.review-note-grid p[b-wxtq78yoro] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.document-footer[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-wxtq78yoro] {
    color:var(--theme-primary);
    font-size:.78rem;
}

.document-footer p[b-wxtq78yoro] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.78rem;
    line-height:1.6;
}

.qr-placeholder[b-wxtq78yoro] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-wxtq78yoro] {
    font-size:.78rem;
    font-weight:700;
}

.mock-document-label[b-wxtq78yoro] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.78rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-wxtq78yoro],
.attachment-panel[b-wxtq78yoro] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-wxtq78yoro] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-wxtq78yoro] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-wxtq78yoro] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-wxtq78yoro] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-weight:700;
}

.history-list[b-wxtq78yoro] {
    display:grid;
    gap:7px;
}

.history-item[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-wxtq78yoro] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-wxtq78yoro] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-wxtq78yoro] {
    color:#3c5047;
    font-size:.80rem;
}

.history-item small[b-wxtq78yoro],
.history-item em[b-wxtq78yoro] {
    color:#84928d;
    font-size:.78rem;
    font-style:normal;
}

.history-item p[b-wxtq78yoro] {
    margin:4px 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.55;
}

.attachment-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-wxtq78yoro] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-wxtq78yoro] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-wxtq78yoro] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-wxtq78yoro] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-wxtq78yoro] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-wxtq78yoro] { background:rgba(52,115,75,.89); }

.attachment-empty[b-wxtq78yoro] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-wxtq78yoro] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-wxtq78yoro] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-wxtq78yoro] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-wxtq78yoro] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-wxtq78yoro] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-wxtq78yoro] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-wxtq78yoro] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.79rem;
    line-height:1.7;
}

.delete-modal p strong[b-wxtq78yoro] {
    color:#b54d43;
}

.delete-warning[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.78rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-wxtq78yoro] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.disabled-care-page[b-wxtq78yoro]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-wxtq78yoro] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .disabled-hero[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-wxtq78yoro] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-wxtq78yoro] {
        grid-column:1 / -1;
    }

    .document-header[b-wxtq78yoro] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-wxtq78yoro] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .disabled-care-page[b-wxtq78yoro] {
        padding-top:10px;
    }

    .disabled-care-page[b-wxtq78yoro]  .disabled-care-container {
        padding-inline:10px !important;
    }

    .disabled-hero[b-wxtq78yoro] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-wxtq78yoro],
    .list-toolbar[b-wxtq78yoro],
    .source-summary-heading[b-wxtq78yoro],
    .calculation-heading[b-wxtq78yoro],
    .view-toolbar[b-wxtq78yoro],
    .section-heading[b-wxtq78yoro] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-wxtq78yoro],
    .variance-grid[b-wxtq78yoro],
    .progress-metrics[b-wxtq78yoro],
    .source-summary-grid[b-wxtq78yoro],
    .system-amount-grid[b-wxtq78yoro],
    .calculation-grid[b-wxtq78yoro],
    .photo-upload-grid[b-wxtq78yoro],
    .transaction-summary-grid[b-wxtq78yoro],
    .review-grid[b-wxtq78yoro],
    .review-note-grid[b-wxtq78yoro],
    .attachment-grid[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-wxtq78yoro] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-wxtq78yoro] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-wxtq78yoro] {
        width:100%;
    }

    .print-disabled-care[b-wxtq78yoro] {
        padding:22px 18px;
    }

    .document-footer[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-wxtq78yoro] {
        grid-column:auto;
    }

    .status-overview[b-wxtq78yoro],
    .document-status-strip[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-wxtq78yoro] {
        width:100%;
    }

    .document-header[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-wxtq78yoro] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-wxtq78yoro] {
        visibility:hidden !important;
    }

    #disabled-care-print-area[b-wxtq78yoro],
    #disabled-care-print-area *[b-wxtq78yoro] {
        visibility:visible !important;
    }

    #disabled-care-print-area[b-wxtq78yoro] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-wxtq78yoro] {
        display:none !important;
    }

    .modal-backdrop[b-wxtq78yoro],
    .disabled-view-modal[b-wxtq78yoro],
    .view-scroll[b-wxtq78yoro] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-wxtq78yoro],
    .document-status-strip[b-wxtq78yoro],
    .scope-panel[b-wxtq78yoro],
    .amount-comparison-section[b-wxtq78yoro],
    .transaction-summary-section[b-wxtq78yoro],
    .source-transaction-section[b-wxtq78yoro],
    .review-section[b-wxtq78yoro],
    .document-footer[b-wxtq78yoro] {
        break-inside:avoid;
    }

    .mock-document-label[b-wxtq78yoro] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.disabled-hero[b-wxtq78yoro] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-wxtq78yoro] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.disabled-care-page[b-wxtq78yoro]  .hero-add-button,
.disabled-care-page[b-wxtq78yoro]  .toolbar-add-button,
.disabled-care-page[b-wxtq78yoro]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-wxtq78yoro] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-wxtq78yoro] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-wxtq78yoro] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-wxtq78yoro] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-wxtq78yoro] { background:#987634; }
.status-overview-card.confirmed > span[b-wxtq78yoro] { background:#2f789f; }
.status-overview-card.checked-in > span[b-wxtq78yoro] { background:#73569b; }
.status-overview-card.in-service > span[b-wxtq78yoro] { background:#c46a2b; }
.status-overview-card.completed > span[b-wxtq78yoro] { background:#34734b; }
.status-overview-card.cancelled > span[b-wxtq78yoro] { background:#b54d43; }

.service-overview[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-wxtq78yoro],
.service-overview-card.selected[b-wxtq78yoro] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-wxtq78yoro] {
    background:#f4faf7;
}

.service-overview-card > span[b-wxtq78yoro] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-wxtq78yoro] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-wxtq78yoro] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-wxtq78yoro] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-wxtq78yoro] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.service-overview-card strong[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-wxtq78yoro] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-wxtq78yoro] {
    display:block;
    color:#3c5047;
    font-size:.79rem;
}

.focus-grid small[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.78rem;
}

/* TABLE */

.citizen-photo-cell[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-wxtq78yoro] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-wxtq78yoro] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-wxtq78yoro] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-wxtq78yoro] {
    color:var(--theme-ink);
    font-size:.82rem;
}

.citizen-photo-cell small[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.78rem;
}

.appointment-time-cell[b-wxtq78yoro],
.service-unit-cell[b-wxtq78yoro],
.provider-location-cell[b-wxtq78yoro],
.queue-priority-cell[b-wxtq78yoro],
.reason-cell[b-wxtq78yoro],
.status-cell[b-wxtq78yoro] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-wxtq78yoro],
.reason-cell[b-wxtq78yoro] {
    min-width:180px;
}

.appointment-time-cell strong[b-wxtq78yoro],
.service-unit-cell strong[b-wxtq78yoro],
.provider-location-cell strong[b-wxtq78yoro],
.queue-priority-cell strong[b-wxtq78yoro],
.reason-cell strong[b-wxtq78yoro] {
    color:#3c5047;
    font-size:.83rem;
    line-height:1.5;
}

.appointment-time-cell small[b-wxtq78yoro],
.service-unit-cell small[b-wxtq78yoro],
.provider-location-cell small[b-wxtq78yoro],
.queue-priority-cell small[b-wxtq78yoro],
.reason-cell small[b-wxtq78yoro],
.status-cell small[b-wxtq78yoro] {
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
    line-height:1.5;
}

.appointment-time-cell em[b-wxtq78yoro],
.provider-location-cell em[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-wxtq78yoro],
.priority-chip[b-wxtq78yoro],
.status-chip[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-wxtq78yoro] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-wxtq78yoro] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-wxtq78yoro] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-wxtq78yoro] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-wxtq78yoro] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-wxtq78yoro] { color:#987634; background:#fff4df; }

.priority-chip[b-wxtq78yoro] {
    margin-top:5px;
}

.priority-chip.normal[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-wxtq78yoro] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-wxtq78yoro] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-wxtq78yoro] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-wxtq78yoro] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-wxtq78yoro] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-wxtq78yoro] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-wxtq78yoro] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-wxtq78yoro] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.identity-chip[b-wxtq78yoro] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.identity-chip.verified[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-wxtq78yoro],
.identity-chip.not-found[b-wxtq78yoro] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-wxtq78yoro] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.citizen-source-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.citizen-address[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.78rem;
}

.citizen-source-actions[b-wxtq78yoro] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-wxtq78yoro],
.citizen-source-actions a[b-wxtq78yoro] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-wxtq78yoro] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-wxtq78yoro] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-wxtq78yoro] {
    color:var(--theme-primary);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-wxtq78yoro] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-wxtq78yoro] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.preview-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.78rem;
}

.consent-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-wxtq78yoro] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-wxtq78yoro] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-wxtq78yoro] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-wxtq78yoro] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-wxtq78yoro] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-card.member > span[b-wxtq78yoro] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-wxtq78yoro] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-wxtq78yoro] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-wxtq78yoro] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-wxtq78yoro] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
    line-height:1.5;
}

.identity-box[b-wxtq78yoro] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-wxtq78yoro],
.identity-box small[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.identity-box strong[b-wxtq78yoro] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.80rem;
}

.service-section[b-wxtq78yoro],
.reason-section[b-wxtq78yoro],
.reminder-section[b-wxtq78yoro] {
    margin-top:16px;
}

.reference-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-wxtq78yoro] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-wxtq78yoro],
.timeline-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.reference-grid strong[b-wxtq78yoro],
.timeline-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.note-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-wxtq78yoro] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-wxtq78yoro] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.note-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.78rem;
}

.note-grid p[b-wxtq78yoro] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.timeline-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-wxtq78yoro] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.78rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-wxtq78yoro] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-wxtq78yoro] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-wxtq78yoro] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-wxtq78yoro],
    .preview-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-wxtq78yoro] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-wxtq78yoro] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-wxtq78yoro] {
        grid-column:1 / -1;
    }

    .reference-grid[b-wxtq78yoro],
    .timeline-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-wxtq78yoro],
    .focus-grid[b-wxtq78yoro],
    .citizen-source-grid[b-wxtq78yoro],
    .preview-grid[b-wxtq78yoro],
    .consent-grid[b-wxtq78yoro],
    .source-photo-grid[b-wxtq78yoro],
    .reference-grid[b-wxtq78yoro],
    .note-grid[b-wxtq78yoro],
    .timeline-grid[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-wxtq78yoro] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-wxtq78yoro] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-wxtq78yoro] {
        margin:0 auto;
    }
}

@media print {
    #disabled-care-print-area[b-wxtq78yoro],
    #disabled-care-print-area *[b-wxtq78yoro] {
        visibility:visible !important;
    }

    #disabled-care-print-area[b-wxtq78yoro] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .disabled-view-modal[b-wxtq78yoro] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-wxtq78yoro],
    .document-status-strip[b-wxtq78yoro],
    .patient-panel[b-wxtq78yoro],
    .service-section[b-wxtq78yoro],
    .reason-section[b-wxtq78yoro],
    .reminder-section[b-wxtq78yoro],
    .document-footer[b-wxtq78yoro] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.disabled-care-page[b-wxtq78yoro] {
    font-size: 16px;
    line-height: 1.55;
}

.disabled-care-page[b-wxtq78yoro]  .mud-typography,
.disabled-care-page[b-wxtq78yoro]  .mud-input,
.disabled-care-page[b-wxtq78yoro]  .mud-input-label,
.disabled-care-page[b-wxtq78yoro]  .mud-select,
.disabled-care-page[b-wxtq78yoro]  .mud-list-item-text,
.disabled-care-page[b-wxtq78yoro]  .mud-button-label,
.disabled-care-page[b-wxtq78yoro]  .mud-table-cell,
.disabled-care-page[b-wxtq78yoro]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input,
.disabled-care-page[b-wxtq78yoro]  .mud-select-input {
    font-size: .92rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-list-item-text {
    font-size: .90rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .82rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-wxtq78yoro] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-wxtq78yoro] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-wxtq78yoro] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-wxtq78yoro] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-wxtq78yoro] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-wxtq78yoro] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-wxtq78yoro] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-wxtq78yoro] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-wxtq78yoro],
.disabled-list-panel[b-wxtq78yoro],
.insight-panel[b-wxtq78yoro] {
    border-radius: 20px;
}

.filter-panel[b-wxtq78yoro] {
    padding: 20px;
}

.list-toolbar[b-wxtq78yoro] {
    padding: 19px 20px;
}

.filter-heading p[b-wxtq78yoro],
.list-toolbar p[b-wxtq78yoro] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-wxtq78yoro] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-wxtq78yoro] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-wxtq78yoro],
.service-unit-cell[b-wxtq78yoro],
.provider-location-cell[b-wxtq78yoro],
.queue-priority-cell[b-wxtq78yoro],
.reason-cell[b-wxtq78yoro],
.status-cell[b-wxtq78yoro] {
    min-width: 155px;
}

.provider-location-cell[b-wxtq78yoro],
.reason-cell[b-wxtq78yoro] {
    min-width: 215px;
}

.service-chip[b-wxtq78yoro],
.priority-chip[b-wxtq78yoro],
.status-chip[b-wxtq78yoro],
.identity-chip[b-wxtq78yoro] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-wxtq78yoro] {
    min-width: 205px;
    gap: 7px;
}

.disabled-care-page[b-wxtq78yoro]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-wxtq78yoro] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-wxtq78yoro],
.view-toolbar[b-wxtq78yoro],
.image-preview-header[b-wxtq78yoro] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-wxtq78yoro],
.view-scroll[b-wxtq78yoro] {
    padding: 20px;
}

.modal-footer[b-wxtq78yoro] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-wxtq78yoro] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-wxtq78yoro] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-wxtq78yoro],
.preview-grid > div[b-wxtq78yoro],
.reference-grid > div[b-wxtq78yoro],
.timeline-grid > div[b-wxtq78yoro] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-wxtq78yoro] {
    padding: 13px;
}

.photo-preview[b-wxtq78yoro] {
    min-height: 200px;
}

.photo-preview img[b-wxtq78yoro] {
    height: 200px;
}

.history-item[b-wxtq78yoro] {
    padding: 12px;
}

.attachment-card[b-wxtq78yoro],
.attachment-card img[b-wxtq78yoro] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .disabled-care-page[b-wxtq78yoro] {
        font-size: 15px;
    }

    .disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .80rem !important;
    }

    .summary-card[b-wxtq78yoro] {
        min-height: 122px;
    }

    .status-overview-card[b-wxtq78yoro],
    .service-overview-card[b-wxtq78yoro] {
        min-height: 82px;
    }

    .modal-body[b-wxtq78yoro],
    .view-scroll[b-wxtq78yoro] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #disabled-care-print-area[b-wxtq78yoro] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #disabled-care-print-area h1[b-wxtq78yoro] {
        font-size: 18pt !important;
    }

    #disabled-care-print-area h2[b-wxtq78yoro] {
        font-size: 14pt !important;
    }

    #disabled-care-print-area h3[b-wxtq78yoro] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.disabled-hero[b-wxtq78yoro] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-wxtq78yoro] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-wxtq78yoro] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-wxtq78yoro] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-wxtq78yoro] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-wxtq78yoro] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-wxtq78yoro] { background:#34734b; }
.status-overview-card.follow-up > span[b-wxtq78yoro] { background:#987634; }
.status-overview-card.referred > span[b-wxtq78yoro] { background:#2f789f; }
.status-overview-card.cancelled > span[b-wxtq78yoro] { background:#b54d43; }
.status-overview-card.month > span[b-wxtq78yoro] { background:#73569b; }

.service-overview[b-wxtq78yoro] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-wxtq78yoro] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-wxtq78yoro] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-wxtq78yoro] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-wxtq78yoro] {
    display:block;
    color:#7c8d86;
    font-size:.78rem;
}

.care-metrics strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-wxtq78yoro],
.service-unit-cell[b-wxtq78yoro],
.provider-location-cell[b-wxtq78yoro],
.result-cell[b-wxtq78yoro],
.follow-score-cell[b-wxtq78yoro],
.status-cell[b-wxtq78yoro] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-wxtq78yoro],
.result-cell[b-wxtq78yoro] {
    min-width:230px;
}

.history-date-cell strong[b-wxtq78yoro],
.service-unit-cell strong[b-wxtq78yoro],
.provider-location-cell strong[b-wxtq78yoro],
.result-cell strong[b-wxtq78yoro],
.follow-score-cell strong[b-wxtq78yoro] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-wxtq78yoro],
.service-unit-cell small[b-wxtq78yoro],
.provider-location-cell small[b-wxtq78yoro],
.result-cell small[b-wxtq78yoro],
.follow-score-cell small[b-wxtq78yoro],
.status-cell small[b-wxtq78yoro] {
    margin-top:5px;
    color:#72847b;
    font-size:.78rem;
    line-height:1.55;
}

.history-date-cell em[b-wxtq78yoro],
.provider-location-cell em[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.78rem;
    font-weight:800;
}

.status-chip.draft[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.status-chip.referred[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-wxtq78yoro] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-wxtq78yoro] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-wxtq78yoro] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-wxtq78yoro] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-wxtq78yoro] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-wxtq78yoro] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.82rem;
}

.source-data-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-wxtq78yoro] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-wxtq78yoro] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.source-data-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-wxtq78yoro] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-wxtq78yoro],
.source-actions button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-wxtq78yoro] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-wxtq78yoro] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-wxtq78yoro] {
    min-height:180px;
}

.source-photo-card img[b-wxtq78yoro] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-wxtq78yoro] {
    margin-top:18px;
}

.vital-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-wxtq78yoro],
.quality-grid > div[b-wxtq78yoro],
.follow-up-grid > div[b-wxtq78yoro] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-wxtq78yoro],
.quality-grid span[b-wxtq78yoro],
.follow-up-grid span[b-wxtq78yoro] {
    display:block;
    color:#7e8f87;
    font-size:.78rem;
}

.vital-grid strong[b-wxtq78yoro],
.quality-grid strong[b-wxtq78yoro],
.follow-up-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-wxtq78yoro] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.82rem;
    line-height:1.65;
}

.follow-up-grid[b-wxtq78yoro],
.quality-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.83rem !important;
    line-height:1.55 !important;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input,
.disabled-care-page[b-wxtq78yoro]  .mud-select-input {
    font-size:.94rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-list-item-text {
    font-size:.92rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-wxtq78yoro] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-wxtq78yoro] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-wxtq78yoro] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-wxtq78yoro] { background:rgba(104,120,114,.89); }

.view-source-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-wxtq78yoro],
    .service-overview[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-wxtq78yoro],
    .vital-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-wxtq78yoro] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-wxtq78yoro],
    .quality-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-wxtq78yoro],
    .service-overview[b-wxtq78yoro],
    .care-metrics[b-wxtq78yoro],
    .source-data-grid[b-wxtq78yoro],
    .source-photo-grid[b-wxtq78yoro],
    .vital-grid[b-wxtq78yoro],
    .follow-up-grid[b-wxtq78yoro],
    .quality-grid[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.81rem !important;
    }
}

@media print {
    #disabled-care-print-area[b-wxtq78yoro],
    #disabled-care-print-area *[b-wxtq78yoro] {
        visibility:visible !important;
    }

    #disabled-care-print-area[b-wxtq78yoro] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .disabled-view-modal[b-wxtq78yoro] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-wxtq78yoro],
    .document-status-strip[b-wxtq78yoro],
    .patient-panel[b-wxtq78yoro],
    .document-section[b-wxtq78yoro],
    .document-footer[b-wxtq78yoro] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.disabled-hero[b-wxtq78yoro] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-wxtq78yoro] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-wxtq78yoro] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-wxtq78yoro] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-wxtq78yoro] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-wxtq78yoro] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-wxtq78yoro] { background:#34734b; }
.status-overview-card.follow-up > span[b-wxtq78yoro] { background:#987634; }
.status-overview-card.referred > span[b-wxtq78yoro] { background:#2f789f; }
.status-overview-card.overdue > span[b-wxtq78yoro] { background:#b54d43; }
.status-overview-card.inactive > span[b-wxtq78yoro] { background:#687872; }

.risk-overview[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-wxtq78yoro],
.risk-overview-card.selected[b-wxtq78yoro] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-wxtq78yoro] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-wxtq78yoro] {
    display:block;
    color:#71837a;
    font-size:.80rem;
}

.risk-overview-card strong[b-wxtq78yoro] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-wxtq78yoro] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-wxtq78yoro],
.care-metrics strong[b-wxtq78yoro] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-wxtq78yoro],
.care-metrics small[b-wxtq78yoro] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.80rem;
}

.care-metrics[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-wxtq78yoro] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-wxtq78yoro],
.risk-adl-cell[b-wxtq78yoro],
.dependency-living-cell[b-wxtq78yoro],
.caregiver-cell[b-wxtq78yoro],
.follow-up-cell[b-wxtq78yoro],
.status-cell[b-wxtq78yoro] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-wxtq78yoro] {
    min-width:190px;
}

.register-age-cell strong[b-wxtq78yoro],
.risk-adl-cell strong[b-wxtq78yoro],
.dependency-living-cell strong[b-wxtq78yoro],
.caregiver-cell strong[b-wxtq78yoro],
.follow-up-cell strong[b-wxtq78yoro] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-wxtq78yoro],
.risk-adl-cell small[b-wxtq78yoro],
.dependency-living-cell small[b-wxtq78yoro],
.caregiver-cell small[b-wxtq78yoro],
.follow-up-cell small[b-wxtq78yoro],
.status-cell small[b-wxtq78yoro] {
    margin-top:5px;
    color:#72847b;
    font-size:.78rem;
    line-height:1.55;
}

.register-age-cell em[b-wxtq78yoro],
.caregiver-cell em[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-wxtq78yoro],
.dependency-chip[b-wxtq78yoro],
.status-chip[b-wxtq78yoro],
.identity-chip[b-wxtq78yoro],
.overdue-chip[b-wxtq78yoro] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:800;
}

.risk-chip.low[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.risk-chip.high[b-wxtq78yoro] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-wxtq78yoro] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-wxtq78yoro] { color:#687872; background:#edf1ef; }
.status-chip.active[b-wxtq78yoro] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-wxtq78yoro] { color:#987634; background:#fff4df; }
.status-chip.referred[b-wxtq78yoro] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-wxtq78yoro] { color:#687872; background:#edf1ef; }

.overdue-chip[b-wxtq78yoro] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-wxtq78yoro] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-wxtq78yoro] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-wxtq78yoro] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-wxtq78yoro] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-wxtq78yoro] {
    color:#2f789f;
    font-size:.80rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-wxtq78yoro] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-wxtq78yoro] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-wxtq78yoro] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-wxtq78yoro] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.source-data-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-wxtq78yoro] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.82rem;
    line-height:1.6;
}

.source-actions[b-wxtq78yoro] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-wxtq78yoro],
.source-actions button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.80rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-wxtq78yoro] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-wxtq78yoro] {
    display:block;
    color:#2f789f;
    font-size:.78rem;
    font-weight:800;
}

.assessment-preview strong[b-wxtq78yoro] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.80rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-wxtq78yoro],
.reference-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-wxtq78yoro],
.reference-grid > div[b-wxtq78yoro],
.care-plan-grid > div[b-wxtq78yoro] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-wxtq78yoro],
.reference-grid span[b-wxtq78yoro],
.care-plan-grid span[b-wxtq78yoro] {
    display:block;
    color:#7e8f87;
    font-size:.78rem;
}

.assessment-grid strong[b-wxtq78yoro],
.reference-grid strong[b-wxtq78yoro],
.care-plan-grid strong[b-wxtq78yoro] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-wxtq78yoro] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-wxtq78yoro] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input,
.disabled-care-page[b-wxtq78yoro]  .mud-select-input {
    font-size:.96rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-list-item-text {
    font-size:.94rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-wxtq78yoro] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.80rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-wxtq78yoro] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-wxtq78yoro] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-wxtq78yoro] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-wxtq78yoro] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-wxtq78yoro] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-wxtq78yoro] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-wxtq78yoro] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-wxtq78yoro] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-wxtq78yoro],
    .assessment-grid[b-wxtq78yoro] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-wxtq78yoro] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-wxtq78yoro],
    .risk-overview[b-wxtq78yoro],
    .dependency-grid[b-wxtq78yoro],
    .care-metrics[b-wxtq78yoro],
    .source-data-grid[b-wxtq78yoro],
    .assessment-grid[b-wxtq78yoro],
    .reference-grid[b-wxtq78yoro],
    .care-plan-grid[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-wxtq78yoro] {
        grid-template-columns:minmax(0,1fr);
    }

    .disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.82rem !important;
    }
}

@media print {
    #disabled-care-print-area[b-wxtq78yoro],
    #disabled-care-print-area *[b-wxtq78yoro] {
        visibility:visible !important;
    }

    #disabled-care-print-area[b-wxtq78yoro] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .disabled-view-modal[b-wxtq78yoro] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-wxtq78yoro],
    .document-status-strip[b-wxtq78yoro],
    .patient-panel[b-wxtq78yoro],
    .document-section[b-wxtq78yoro],
    .document-footer[b-wxtq78yoro] {
        break-inside:avoid;
    }
}


/* =========================================================
   DISABILITY CARE โ€” SPECIFIC PREMIUM STYLES
   ========================================================= */

.disabled-hero[b-wxtq78yoro] {
    background:
        radial-gradient(circle at 88% 4%, rgba(103,181,224,.26), transparent 30%),
        radial-gradient(circle at 8% 112%, rgba(142,106,190,.20), transparent 37%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.risk-chip.total[b-wxtq78yoro] {
    color:#b54d43;
    background:#fff0ee;
}

.dependency-chip.physical[b-wxtq78yoro] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-chip.visual[b-wxtq78yoro] {
    color:#73569b;
    background:#f0eafb;
}

.dependency-chip.hearing[b-wxtq78yoro] {
    color:#2f789f;
    background:#e8f3f8;
}

.dependency-chip.intellectual[b-wxtq78yoro],
.dependency-chip.autism[b-wxtq78yoro] {
    color:#987634;
    background:#fff4df;
}

.dependency-chip.psychosocial[b-wxtq78yoro] {
    color:#b55b82;
    background:#fdebf3;
}

.dependency-chip.learning[b-wxtq78yoro] {
    color:#c46a2b;
    background:#fff2e7;
}

.dependency-chip.multiple[b-wxtq78yoro] {
    color:#b54d43;
    background:#fff0ee;
}

.attachment-card.disabled-card > span[b-wxtq78yoro] {
    background:rgba(47,120,159,.90);
}

.attachment-card.certificate > span[b-wxtq78yoro] {
    background:rgba(115,86,155,.90);
}

.attachment-card.device > span[b-wxtq78yoro] {
    background:rgba(152,118,52,.90);
}

.attachment-card.accessibility > span[b-wxtq78yoro] {
    background:rgba(10,114,87,.90);
}

/* เนƒเธซเน‰ Card เนเธฅเธฐเธ•เธฒเธฃเธฒเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเน€เธ›เน‡เธ™เธžเธดเน€เธจเธฉ */
.disabled-care-page[b-wxtq78yoro] {
    font-size:16px;
    line-height:1.58;
}

.disabled-care-page .summary-card[b-wxtq78yoro] {
    min-height:142px;
}

.disabled-care-page .status-overview-card[b-wxtq78yoro],
.disabled-care-page .risk-overview-card[b-wxtq78yoro] {
    min-height:100px;
}

.disabled-care-page .filter-heading p[b-wxtq78yoro],
.disabled-care-page .list-toolbar p[b-wxtq78yoro],
.disabled-care-page .source-address[b-wxtq78yoro],
.disabled-care-page .mock-rule-warning[b-wxtq78yoro] {
    font-size:.84rem;
    line-height:1.7;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-cell {
    padding:17px 14px !important;
    font-size:.86rem !important;
    line-height:1.6 !important;
}

.disabled-care-page[b-wxtq78yoro]  .disabled-table .mud-table-head .mud-table-cell {
    min-height:60px;
    font-size:.88rem !important;
    font-weight:800 !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input,
.disabled-care-page[b-wxtq78yoro]  .mud-select-input {
    font-size:.98rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-input-label {
    font-size:.94rem !important;
    font-weight:650 !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-list-item-text {
    font-size:.96rem !important;
}

.disabled-care-page[b-wxtq78yoro]  .mud-button-label {
    font-size:.92rem !important;
    font-weight:750 !important;
}

@media print {
    #disabled-care-print-area[b-wxtq78yoro] {
        font-size:10.5pt !important;
        line-height:1.48 !important;
    }
}
/* /Components/Pages/02Specialized/03HealthAndSafety/ElderlyCare.razor.rz.scp.css */
:root[b-t5sicyq9mt] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.elderly-care-page[b-t5sicyq9mt] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-care-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.elderly-hero[b-t5sicyq9mt] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-t5sicyq9mt] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-t5sicyq9mt] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-t5sicyq9mt],
.hero-action-panel[b-t5sicyq9mt] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-t5sicyq9mt] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-t5sicyq9mt] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-t5sicyq9mt] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-t5sicyq9mt] {
    color: #d8ede6;
    font-size: .81rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-t5sicyq9mt] {
    margin-top: 3px;
    font-size: .94rem;
}

.elderly-hero h1[b-t5sicyq9mt] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.elderly-hero p[b-t5sicyq9mt] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-t5sicyq9mt] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .78rem;
    font-weight: 650;
}

.hero-action-panel[b-t5sicyq9mt] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-t5sicyq9mt] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-t5sicyq9mt] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-t5sicyq9mt] {
    font-size: .85rem;
}

.hero-status small[b-t5sicyq9mt] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .78rem;
}

.elderly-care-page[b-t5sicyq9mt]  .hero-add-button,
.elderly-care-page[b-t5sicyq9mt]  .toolbar-add-button,
.elderly-care-page[b-t5sicyq9mt]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.elderly-care-page[b-t5sicyq9mt]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-t5sicyq9mt],
.hero-refresh-button[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-t5sicyq9mt] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-t5sicyq9mt] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-t5sicyq9mt] {
    opacity: .55;
    cursor: wait;
}

.elderly-care-page[b-t5sicyq9mt]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.elderly-care-page[b-t5sicyq9mt]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-t5sicyq9mt] {
    margin-top: 2px !important;
}

.summary-card[b-t5sicyq9mt] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-t5sicyq9mt] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-t5sicyq9mt] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-t5sicyq9mt] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-t5sicyq9mt] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-t5sicyq9mt] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-t5sicyq9mt] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-t5sicyq9mt] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-t5sicyq9mt] {
    color: #788982;
    font-size: .78rem;
    font-weight: 650;
}

.summary-card p[b-t5sicyq9mt] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-t5sicyq9mt] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-t5sicyq9mt] {
    color: #798a83;
    font-size: .78rem;
}

.summary-card em[b-t5sicyq9mt] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-t5sicyq9mt],
.status-overview-card.selected[b-t5sicyq9mt] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-t5sicyq9mt] {
    background: #f5faf7;
}

.status-overview-card > span[b-t5sicyq9mt] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-t5sicyq9mt] { background:#687872; }
.status-overview-card.reviewing > span[b-t5sicyq9mt] { background:#987634; }
.status-overview-card.difference > span[b-t5sicyq9mt] { background:#b54d43; }
.status-overview-card.approved > span[b-t5sicyq9mt] { background:#2f789f; }
.status-overview-card.closed > span[b-t5sicyq9mt] { background:#34734b; }
.status-overview-card.voided > span[b-t5sicyq9mt] { background:#687872; }
.status-overview-card.today > span[b-t5sicyq9mt] { background:#73569b; }

.status-overview-card div[b-t5sicyq9mt] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-t5sicyq9mt] {
    color: var(--theme-muted);
    font-size: .78rem;
}

.status-overview-card strong[b-t5sicyq9mt] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-t5sicyq9mt] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-t5sicyq9mt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-t5sicyq9mt] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-t5sicyq9mt] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .78rem;
    font-weight: 700;
}

.variance-grid[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-t5sicyq9mt] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-t5sicyq9mt] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-t5sicyq9mt] {
    display: block;
    color: #3c5047;
    font-size: .81rem;
}

.variance-card small[b-t5sicyq9mt] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .78rem;
}

.closing-progress[b-t5sicyq9mt] {
    margin-top: 13px;
}

.progress-track[b-t5sicyq9mt] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-t5sicyq9mt] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-t5sicyq9mt] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-t5sicyq9mt] {
    display: block;
    color: #87958f;
    font-size: .78rem;
}

.progress-metrics strong[b-t5sicyq9mt] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-t5sicyq9mt],
.elderly-list-panel[b-t5sicyq9mt] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-t5sicyq9mt] {
    padding: 15px;
}

.filter-heading[b-t5sicyq9mt],
.list-toolbar[b-t5sicyq9mt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-t5sicyq9mt],
.panel-kicker[b-t5sicyq9mt] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-t5sicyq9mt],
.list-toolbar h2[b-t5sicyq9mt] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-t5sicyq9mt],
.list-toolbar p[b-t5sicyq9mt] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .78rem;
    line-height: 1.65;
}

.clear-filter-button[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-t5sicyq9mt] {
    margin-top: 8px !important;
}

.elderly-care-page[b-t5sicyq9mt]  .premium-field,
.elderly-care-page[b-t5sicyq9mt]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.elderly-care-page[b-t5sicyq9mt]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    text-transform: none !important;
}

.filter-summary[b-t5sicyq9mt] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .78rem;
}

.filter-summary strong[b-t5sicyq9mt] {
    color: var(--theme-primary);
}

.elderly-list-panel[b-t5sicyq9mt] {
    overflow: hidden;
}

.list-toolbar[b-t5sicyq9mt] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.elderly-care-page[b-t5sicyq9mt]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-t5sicyq9mt] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-t5sicyq9mt] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-t5sicyq9mt] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-t5sicyq9mt] {
    margin: 0;
    font-size: .78rem;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table {
    font-family: 'Kanit',sans-serif;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-head {
    background: #f1f7f4;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .78rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-t5sicyq9mt] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-t5sicyq9mt] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-t5sicyq9mt] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .78rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-t5sicyq9mt] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .78rem;
}

.date-shift-cell[b-t5sicyq9mt],
.counter-cashier-cell[b-t5sicyq9mt],
.money-cell[b-t5sicyq9mt],
.difference-cell[b-t5sicyq9mt],
.transaction-status-cell[b-t5sicyq9mt] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-t5sicyq9mt] {
    min-width: 175px;
}

.date-shift-cell strong[b-t5sicyq9mt],
.counter-cashier-cell strong[b-t5sicyq9mt],
.money-cell strong[b-t5sicyq9mt],
.difference-cell strong[b-t5sicyq9mt],
.transaction-status-cell strong[b-t5sicyq9mt] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-t5sicyq9mt],
.counter-cashier-cell small[b-t5sicyq9mt],
.money-cell small[b-t5sicyq9mt],
.difference-cell small[b-t5sicyq9mt] {
    margin-top: 3px;
    color: #84928d;
    font-size: .78rem;
}

.date-shift-cell em[b-t5sicyq9mt],
.counter-cashier-cell em[b-t5sicyq9mt] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-t5sicyq9mt] { color:var(--theme-primary); }
.money-cell.actual strong[b-t5sicyq9mt] { color:#2f789f; }

.difference-cell.matched strong[b-t5sicyq9mt] { color:#34734b; }
.difference-cell.over strong[b-t5sicyq9mt] { color:#987634; }
.difference-cell.short strong[b-t5sicyq9mt] { color:#b54d43; }

.status-chip[b-t5sicyq9mt],
.match-chip[b-t5sicyq9mt] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
}

.status-chip i[b-t5sicyq9mt] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.status-chip.difference[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-t5sicyq9mt] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-t5sicyq9mt] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-t5sicyq9mt] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-t5sicyq9mt] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .78rem;
}

/* MODALS */

.modal-backdrop[b-t5sicyq9mt],
.image-preview-backdrop[b-t5sicyq9mt] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.elderly-form-modal[b-t5sicyq9mt],
.elderly-view-modal[b-t5sicyq9mt],
.delete-modal[b-t5sicyq9mt],
.image-preview-modal[b-t5sicyq9mt] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-t5sicyq9mt],
.view-toolbar[b-t5sicyq9mt],
.image-preview-header[b-t5sicyq9mt] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-t5sicyq9mt] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-t5sicyq9mt] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-t5sicyq9mt],
.view-toolbar small[b-t5sicyq9mt],
.image-preview-header small[b-t5sicyq9mt] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-t5sicyq9mt],
.view-toolbar h2[b-t5sicyq9mt],
.image-preview-header h3[b-t5sicyq9mt] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-t5sicyq9mt] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.modal-body[b-t5sicyq9mt],
.view-scroll[b-t5sicyq9mt] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-t5sicyq9mt] {
    background: #e9efec;
}

.modal-footer[b-t5sicyq9mt] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.elderly-care-page[b-t5sicyq9mt]  .cancel-button,
.elderly-care-page[b-t5sicyq9mt]  .save-button,
.elderly-care-page[b-t5sicyq9mt]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.form-section-title[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-t5sicyq9mt] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-t5sicyq9mt] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-t5sicyq9mt] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-t5sicyq9mt] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.open-transactions-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-t5sicyq9mt] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-t5sicyq9mt],
.calculation-heading[b-t5sicyq9mt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-t5sicyq9mt],
.calculation-heading small[b-t5sicyq9mt] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-t5sicyq9mt],
.calculation-heading h3[b-t5sicyq9mt] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-t5sicyq9mt],
.calculation-heading > span[b-t5sicyq9mt] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-t5sicyq9mt] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-t5sicyq9mt] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-t5sicyq9mt] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.source-summary-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-t5sicyq9mt] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-t5sicyq9mt] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-t5sicyq9mt] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-t5sicyq9mt] {
    display:block;
    color:#84928d;
    font-size:.78rem;
}

.system-amount-card strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.reconciliation-calculation-preview[b-t5sicyq9mt] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-t5sicyq9mt] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-t5sicyq9mt] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-t5sicyq9mt] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-t5sicyq9mt] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-t5sicyq9mt] {
    display:block;
    color:#8b7b74;
    font-size:.78rem;
}

.calculation-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-t5sicyq9mt] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.78rem;
}

.calculation-grid .short span[b-t5sicyq9mt],
.calculation-grid .short strong[b-t5sicyq9mt],
.calculation-grid .short small[b-t5sicyq9mt] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-t5sicyq9mt] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-t5sicyq9mt] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-t5sicyq9mt] {
    display:block;
    color:#3c5047;
    font-size:.80rem;
}

.photo-upload-heading small[b-t5sicyq9mt] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.photo-preview[b-t5sicyq9mt] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-t5sicyq9mt] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-t5sicyq9mt] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-t5sicyq9mt] {
    color:#40544b;
    font-size:.80rem;
}

.photo-empty small[b-t5sicyq9mt] {
    font-size:.78rem;
}

.photo-upload-actions[b-t5sicyq9mt] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-t5sicyq9mt],
.remove-photo-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-t5sicyq9mt] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-t5sicyq9mt] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-t5sicyq9mt] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-t5sicyq9mt],
.detail-transaction-table[b-t5sicyq9mt] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-t5sicyq9mt],
.source-transaction-row[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-t5sicyq9mt] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-t5sicyq9mt],
.source-transaction-row > span[b-t5sicyq9mt] {
    padding:7px;
    font-size:.78rem;
}

.source-transaction-row[b-t5sicyq9mt] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-t5sicyq9mt] {
    border-bottom:0;
}

.mini-photo-button[b-t5sicyq9mt] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-t5sicyq9mt],
.source-transaction-more[b-t5sicyq9mt] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.78rem;
    text-align:center;
}

.mock-rule-warning[b-t5sicyq9mt] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.78rem !important;
}

/* VIEW & PRINT */

.elderly-view-modal[b-t5sicyq9mt] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-t5sicyq9mt] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.elderly-care-page[b-t5sicyq9mt]  .view-edit-button,
.elderly-care-page[b-t5sicyq9mt]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.elderly-care-page[b-t5sicyq9mt]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-elderly-care[b-t5sicyq9mt] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-t5sicyq9mt] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-t5sicyq9mt] {
    text-align:center;
}

.document-organization small[b-t5sicyq9mt] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-t5sicyq9mt] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-t5sicyq9mt] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-t5sicyq9mt] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-t5sicyq9mt],
.document-number-box small[b-t5sicyq9mt] {
    display:block;
    color:#778980;
    font-size:.78rem;
}

.document-number-box strong[b-t5sicyq9mt] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-t5sicyq9mt] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-t5sicyq9mt] {
    display:block;
    color:#83918b;
    font-size:.78rem;
}

.document-status-strip > div strong[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.78rem;
}

.scope-panel[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
}

.scope-reference-box[b-t5sicyq9mt] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.scope-reference-box strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.81rem;
}

.scope-reference-box small[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-t5sicyq9mt],
.transaction-summary-section[b-t5sicyq9mt],
.source-transaction-section[b-t5sicyq9mt],
.review-section[b-t5sicyq9mt] {
    margin-top:16px;
}

.section-title[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-t5sicyq9mt] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.82rem;
    font-weight:800;
}

.section-title small[b-t5sicyq9mt] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-t5sicyq9mt] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-t5sicyq9mt] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-t5sicyq9mt],
.comparison-row[b-t5sicyq9mt],
.comparison-total[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-t5sicyq9mt] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-t5sicyq9mt],
.comparison-row span[b-t5sicyq9mt],
.comparison-total span[b-t5sicyq9mt] {
    padding:8px 9px;
    font-size:.78rem;
}

.comparison-row[b-t5sicyq9mt] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-t5sicyq9mt],
.comparison-total span:not(:first-child)[b-t5sicyq9mt] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-t5sicyq9mt] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-t5sicyq9mt] { color:#34734b; }
.difference-text.over[b-t5sicyq9mt] { color:#987634; }
.difference-text.short[b-t5sicyq9mt] { color:#b54d43; }

.transaction-summary-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-t5sicyq9mt] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-t5sicyq9mt] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-t5sicyq9mt] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-t5sicyq9mt] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-t5sicyq9mt] { background:#f4fafc; }

.transaction-summary-grid span[b-t5sicyq9mt] {
    display:block;
    color:#84928c;
    font-size:.78rem;
}

.transaction-summary-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-t5sicyq9mt] {
    display:block;
    color:#798a83;
    font-size:.78rem;
}

.detail-transaction-header[b-t5sicyq9mt],
.detail-transaction-row[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-t5sicyq9mt] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-t5sicyq9mt],
.detail-transaction-row span[b-t5sicyq9mt] {
    padding:8px 7px;
    font-size:.78rem;
}

.detail-transaction-row[b-t5sicyq9mt] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-t5sicyq9mt] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.review-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
}

.review-note-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-t5sicyq9mt] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.78rem;
}

.review-note-grid p[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.document-footer[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-t5sicyq9mt] {
    color:var(--theme-primary);
    font-size:.78rem;
}

.document-footer p[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.78rem;
    line-height:1.6;
}

.qr-placeholder[b-t5sicyq9mt] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-t5sicyq9mt] {
    font-size:.78rem;
    font-weight:700;
}

.mock-document-label[b-t5sicyq9mt] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.78rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-t5sicyq9mt],
.attachment-panel[b-t5sicyq9mt] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-t5sicyq9mt] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-t5sicyq9mt] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-t5sicyq9mt] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-weight:700;
}

.history-list[b-t5sicyq9mt] {
    display:grid;
    gap:7px;
}

.history-item[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-t5sicyq9mt] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-t5sicyq9mt] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-t5sicyq9mt] {
    color:#3c5047;
    font-size:.80rem;
}

.history-item small[b-t5sicyq9mt],
.history-item em[b-t5sicyq9mt] {
    color:#84928d;
    font-size:.78rem;
    font-style:normal;
}

.history-item p[b-t5sicyq9mt] {
    margin:4px 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.55;
}

.attachment-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-t5sicyq9mt] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-t5sicyq9mt] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-t5sicyq9mt] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-t5sicyq9mt] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-t5sicyq9mt] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-t5sicyq9mt] { background:rgba(52,115,75,.89); }

.attachment-empty[b-t5sicyq9mt] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-t5sicyq9mt] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-t5sicyq9mt] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-t5sicyq9mt] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-t5sicyq9mt] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-t5sicyq9mt] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-t5sicyq9mt] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-t5sicyq9mt] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.79rem;
    line-height:1.7;
}

.delete-modal p strong[b-t5sicyq9mt] {
    color:#b54d43;
}

.delete-warning[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.78rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-t5sicyq9mt] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.elderly-care-page[b-t5sicyq9mt]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-t5sicyq9mt] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .elderly-hero[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-t5sicyq9mt] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-t5sicyq9mt] {
        grid-column:1 / -1;
    }

    .document-header[b-t5sicyq9mt] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-t5sicyq9mt] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .elderly-care-page[b-t5sicyq9mt] {
        padding-top:10px;
    }

    .elderly-care-page[b-t5sicyq9mt]  .elderly-care-container {
        padding-inline:10px !important;
    }

    .elderly-hero[b-t5sicyq9mt] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-t5sicyq9mt],
    .list-toolbar[b-t5sicyq9mt],
    .source-summary-heading[b-t5sicyq9mt],
    .calculation-heading[b-t5sicyq9mt],
    .view-toolbar[b-t5sicyq9mt],
    .section-heading[b-t5sicyq9mt] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-t5sicyq9mt],
    .variance-grid[b-t5sicyq9mt],
    .progress-metrics[b-t5sicyq9mt],
    .source-summary-grid[b-t5sicyq9mt],
    .system-amount-grid[b-t5sicyq9mt],
    .calculation-grid[b-t5sicyq9mt],
    .photo-upload-grid[b-t5sicyq9mt],
    .transaction-summary-grid[b-t5sicyq9mt],
    .review-grid[b-t5sicyq9mt],
    .review-note-grid[b-t5sicyq9mt],
    .attachment-grid[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-t5sicyq9mt] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-t5sicyq9mt] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-t5sicyq9mt] {
        width:100%;
    }

    .print-elderly-care[b-t5sicyq9mt] {
        padding:22px 18px;
    }

    .document-footer[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-t5sicyq9mt] {
        grid-column:auto;
    }

    .status-overview[b-t5sicyq9mt],
    .document-status-strip[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-t5sicyq9mt] {
        width:100%;
    }

    .document-header[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-t5sicyq9mt] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-t5sicyq9mt] {
        visibility:hidden !important;
    }

    #elderly-care-print-area[b-t5sicyq9mt],
    #elderly-care-print-area *[b-t5sicyq9mt] {
        visibility:visible !important;
    }

    #elderly-care-print-area[b-t5sicyq9mt] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-t5sicyq9mt] {
        display:none !important;
    }

    .modal-backdrop[b-t5sicyq9mt],
    .elderly-view-modal[b-t5sicyq9mt],
    .view-scroll[b-t5sicyq9mt] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-t5sicyq9mt],
    .document-status-strip[b-t5sicyq9mt],
    .scope-panel[b-t5sicyq9mt],
    .amount-comparison-section[b-t5sicyq9mt],
    .transaction-summary-section[b-t5sicyq9mt],
    .source-transaction-section[b-t5sicyq9mt],
    .review-section[b-t5sicyq9mt],
    .document-footer[b-t5sicyq9mt] {
        break-inside:avoid;
    }

    .mock-document-label[b-t5sicyq9mt] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.elderly-hero[b-t5sicyq9mt] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-t5sicyq9mt] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.elderly-care-page[b-t5sicyq9mt]  .hero-add-button,
.elderly-care-page[b-t5sicyq9mt]  .toolbar-add-button,
.elderly-care-page[b-t5sicyq9mt]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-t5sicyq9mt] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-t5sicyq9mt] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-t5sicyq9mt] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-t5sicyq9mt] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-t5sicyq9mt] { background:#987634; }
.status-overview-card.confirmed > span[b-t5sicyq9mt] { background:#2f789f; }
.status-overview-card.checked-in > span[b-t5sicyq9mt] { background:#73569b; }
.status-overview-card.in-service > span[b-t5sicyq9mt] { background:#c46a2b; }
.status-overview-card.completed > span[b-t5sicyq9mt] { background:#34734b; }
.status-overview-card.cancelled > span[b-t5sicyq9mt] { background:#b54d43; }

.service-overview[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-t5sicyq9mt],
.service-overview-card.selected[b-t5sicyq9mt] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-t5sicyq9mt] {
    background:#f4faf7;
}

.service-overview-card > span[b-t5sicyq9mt] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-t5sicyq9mt] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-t5sicyq9mt] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-t5sicyq9mt] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-t5sicyq9mt] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.service-overview-card strong[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-t5sicyq9mt] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-t5sicyq9mt] {
    display:block;
    color:#3c5047;
    font-size:.79rem;
}

.focus-grid small[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.78rem;
}

/* TABLE */

.citizen-photo-cell[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-t5sicyq9mt] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-t5sicyq9mt] {
    color:var(--theme-ink);
    font-size:.82rem;
}

.citizen-photo-cell small[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.78rem;
}

.appointment-time-cell[b-t5sicyq9mt],
.service-unit-cell[b-t5sicyq9mt],
.provider-location-cell[b-t5sicyq9mt],
.queue-priority-cell[b-t5sicyq9mt],
.reason-cell[b-t5sicyq9mt],
.status-cell[b-t5sicyq9mt] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-t5sicyq9mt],
.reason-cell[b-t5sicyq9mt] {
    min-width:180px;
}

.appointment-time-cell strong[b-t5sicyq9mt],
.service-unit-cell strong[b-t5sicyq9mt],
.provider-location-cell strong[b-t5sicyq9mt],
.queue-priority-cell strong[b-t5sicyq9mt],
.reason-cell strong[b-t5sicyq9mt] {
    color:#3c5047;
    font-size:.83rem;
    line-height:1.5;
}

.appointment-time-cell small[b-t5sicyq9mt],
.service-unit-cell small[b-t5sicyq9mt],
.provider-location-cell small[b-t5sicyq9mt],
.queue-priority-cell small[b-t5sicyq9mt],
.reason-cell small[b-t5sicyq9mt],
.status-cell small[b-t5sicyq9mt] {
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
    line-height:1.5;
}

.appointment-time-cell em[b-t5sicyq9mt],
.provider-location-cell em[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-t5sicyq9mt],
.priority-chip[b-t5sicyq9mt],
.status-chip[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-t5sicyq9mt] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-t5sicyq9mt] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-t5sicyq9mt] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-t5sicyq9mt] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-t5sicyq9mt] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-t5sicyq9mt] { color:#987634; background:#fff4df; }

.priority-chip[b-t5sicyq9mt] {
    margin-top:5px;
}

.priority-chip.normal[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-t5sicyq9mt] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-t5sicyq9mt] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-t5sicyq9mt] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-t5sicyq9mt] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-t5sicyq9mt] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.identity-chip[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.identity-chip.verified[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-t5sicyq9mt],
.identity-chip.not-found[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-t5sicyq9mt] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.citizen-source-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.citizen-address[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.78rem;
}

.citizen-source-actions[b-t5sicyq9mt] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-t5sicyq9mt],
.citizen-source-actions a[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-t5sicyq9mt] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-t5sicyq9mt] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-t5sicyq9mt] {
    color:var(--theme-primary);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-t5sicyq9mt] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-t5sicyq9mt] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.preview-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.78rem;
}

.consent-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-t5sicyq9mt] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-t5sicyq9mt] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-t5sicyq9mt] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-t5sicyq9mt] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-t5sicyq9mt] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-card.member > span[b-t5sicyq9mt] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-t5sicyq9mt] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-t5sicyq9mt] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
    line-height:1.5;
}

.identity-box[b-t5sicyq9mt] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-t5sicyq9mt],
.identity-box small[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.identity-box strong[b-t5sicyq9mt] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.80rem;
}

.service-section[b-t5sicyq9mt],
.reason-section[b-t5sicyq9mt],
.reminder-section[b-t5sicyq9mt] {
    margin-top:16px;
}

.reference-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-t5sicyq9mt] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-t5sicyq9mt],
.timeline-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.reference-grid strong[b-t5sicyq9mt],
.timeline-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.note-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-t5sicyq9mt] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-t5sicyq9mt] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.note-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.78rem;
}

.note-grid p[b-t5sicyq9mt] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.timeline-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-t5sicyq9mt] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.78rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-t5sicyq9mt] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-t5sicyq9mt] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-t5sicyq9mt] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-t5sicyq9mt],
    .preview-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-t5sicyq9mt] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-t5sicyq9mt] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-t5sicyq9mt] {
        grid-column:1 / -1;
    }

    .reference-grid[b-t5sicyq9mt],
    .timeline-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-t5sicyq9mt],
    .focus-grid[b-t5sicyq9mt],
    .citizen-source-grid[b-t5sicyq9mt],
    .preview-grid[b-t5sicyq9mt],
    .consent-grid[b-t5sicyq9mt],
    .source-photo-grid[b-t5sicyq9mt],
    .reference-grid[b-t5sicyq9mt],
    .note-grid[b-t5sicyq9mt],
    .timeline-grid[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-t5sicyq9mt] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-t5sicyq9mt] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-t5sicyq9mt] {
        margin:0 auto;
    }
}

@media print {
    #elderly-care-print-area[b-t5sicyq9mt],
    #elderly-care-print-area *[b-t5sicyq9mt] {
        visibility:visible !important;
    }

    #elderly-care-print-area[b-t5sicyq9mt] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .elderly-view-modal[b-t5sicyq9mt] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-t5sicyq9mt],
    .document-status-strip[b-t5sicyq9mt],
    .patient-panel[b-t5sicyq9mt],
    .service-section[b-t5sicyq9mt],
    .reason-section[b-t5sicyq9mt],
    .reminder-section[b-t5sicyq9mt],
    .document-footer[b-t5sicyq9mt] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.elderly-care-page[b-t5sicyq9mt] {
    font-size: 16px;
    line-height: 1.55;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-typography,
.elderly-care-page[b-t5sicyq9mt]  .mud-input,
.elderly-care-page[b-t5sicyq9mt]  .mud-input-label,
.elderly-care-page[b-t5sicyq9mt]  .mud-select,
.elderly-care-page[b-t5sicyq9mt]  .mud-list-item-text,
.elderly-care-page[b-t5sicyq9mt]  .mud-button-label,
.elderly-care-page[b-t5sicyq9mt]  .mud-table-cell,
.elderly-care-page[b-t5sicyq9mt]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input,
.elderly-care-page[b-t5sicyq9mt]  .mud-select-input {
    font-size: .92rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-list-item-text {
    font-size: .90rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .82rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-t5sicyq9mt] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-t5sicyq9mt] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-t5sicyq9mt] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-t5sicyq9mt] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-t5sicyq9mt] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-t5sicyq9mt] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-t5sicyq9mt] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-t5sicyq9mt] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-t5sicyq9mt],
.elderly-list-panel[b-t5sicyq9mt],
.insight-panel[b-t5sicyq9mt] {
    border-radius: 20px;
}

.filter-panel[b-t5sicyq9mt] {
    padding: 20px;
}

.list-toolbar[b-t5sicyq9mt] {
    padding: 19px 20px;
}

.filter-heading p[b-t5sicyq9mt],
.list-toolbar p[b-t5sicyq9mt] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-t5sicyq9mt] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-t5sicyq9mt] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-t5sicyq9mt],
.service-unit-cell[b-t5sicyq9mt],
.provider-location-cell[b-t5sicyq9mt],
.queue-priority-cell[b-t5sicyq9mt],
.reason-cell[b-t5sicyq9mt],
.status-cell[b-t5sicyq9mt] {
    min-width: 155px;
}

.provider-location-cell[b-t5sicyq9mt],
.reason-cell[b-t5sicyq9mt] {
    min-width: 215px;
}

.service-chip[b-t5sicyq9mt],
.priority-chip[b-t5sicyq9mt],
.status-chip[b-t5sicyq9mt],
.identity-chip[b-t5sicyq9mt] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-t5sicyq9mt] {
    min-width: 205px;
    gap: 7px;
}

.elderly-care-page[b-t5sicyq9mt]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-t5sicyq9mt] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-t5sicyq9mt],
.view-toolbar[b-t5sicyq9mt],
.image-preview-header[b-t5sicyq9mt] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-t5sicyq9mt],
.view-scroll[b-t5sicyq9mt] {
    padding: 20px;
}

.modal-footer[b-t5sicyq9mt] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-t5sicyq9mt] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-t5sicyq9mt] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-t5sicyq9mt],
.preview-grid > div[b-t5sicyq9mt],
.reference-grid > div[b-t5sicyq9mt],
.timeline-grid > div[b-t5sicyq9mt] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-t5sicyq9mt] {
    padding: 13px;
}

.photo-preview[b-t5sicyq9mt] {
    min-height: 200px;
}

.photo-preview img[b-t5sicyq9mt] {
    height: 200px;
}

.history-item[b-t5sicyq9mt] {
    padding: 12px;
}

.attachment-card[b-t5sicyq9mt],
.attachment-card img[b-t5sicyq9mt] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .elderly-care-page[b-t5sicyq9mt] {
        font-size: 15px;
    }

    .elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .80rem !important;
    }

    .summary-card[b-t5sicyq9mt] {
        min-height: 122px;
    }

    .status-overview-card[b-t5sicyq9mt],
    .service-overview-card[b-t5sicyq9mt] {
        min-height: 82px;
    }

    .modal-body[b-t5sicyq9mt],
    .view-scroll[b-t5sicyq9mt] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #elderly-care-print-area[b-t5sicyq9mt] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #elderly-care-print-area h1[b-t5sicyq9mt] {
        font-size: 18pt !important;
    }

    #elderly-care-print-area h2[b-t5sicyq9mt] {
        font-size: 14pt !important;
    }

    #elderly-care-print-area h3[b-t5sicyq9mt] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.elderly-hero[b-t5sicyq9mt] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-t5sicyq9mt] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-t5sicyq9mt] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-t5sicyq9mt] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-t5sicyq9mt] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-t5sicyq9mt] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-t5sicyq9mt] { background:#34734b; }
.status-overview-card.follow-up > span[b-t5sicyq9mt] { background:#987634; }
.status-overview-card.referred > span[b-t5sicyq9mt] { background:#2f789f; }
.status-overview-card.cancelled > span[b-t5sicyq9mt] { background:#b54d43; }
.status-overview-card.month > span[b-t5sicyq9mt] { background:#73569b; }

.service-overview[b-t5sicyq9mt] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-t5sicyq9mt] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-t5sicyq9mt] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-t5sicyq9mt] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-t5sicyq9mt] {
    display:block;
    color:#7c8d86;
    font-size:.78rem;
}

.care-metrics strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-t5sicyq9mt],
.service-unit-cell[b-t5sicyq9mt],
.provider-location-cell[b-t5sicyq9mt],
.result-cell[b-t5sicyq9mt],
.follow-score-cell[b-t5sicyq9mt],
.status-cell[b-t5sicyq9mt] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-t5sicyq9mt],
.result-cell[b-t5sicyq9mt] {
    min-width:230px;
}

.history-date-cell strong[b-t5sicyq9mt],
.service-unit-cell strong[b-t5sicyq9mt],
.provider-location-cell strong[b-t5sicyq9mt],
.result-cell strong[b-t5sicyq9mt],
.follow-score-cell strong[b-t5sicyq9mt] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-t5sicyq9mt],
.service-unit-cell small[b-t5sicyq9mt],
.provider-location-cell small[b-t5sicyq9mt],
.result-cell small[b-t5sicyq9mt],
.follow-score-cell small[b-t5sicyq9mt],
.status-cell small[b-t5sicyq9mt] {
    margin-top:5px;
    color:#72847b;
    font-size:.78rem;
    line-height:1.55;
}

.history-date-cell em[b-t5sicyq9mt],
.provider-location-cell em[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.78rem;
    font-weight:800;
}

.status-chip.draft[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.status-chip.referred[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-t5sicyq9mt] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-t5sicyq9mt] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-t5sicyq9mt] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-t5sicyq9mt] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.82rem;
}

.source-data-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-t5sicyq9mt] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-t5sicyq9mt] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.source-data-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-t5sicyq9mt] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-t5sicyq9mt],
.source-actions button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-t5sicyq9mt] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-t5sicyq9mt] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-t5sicyq9mt] {
    min-height:180px;
}

.source-photo-card img[b-t5sicyq9mt] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-t5sicyq9mt] {
    margin-top:18px;
}

.vital-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-t5sicyq9mt],
.quality-grid > div[b-t5sicyq9mt],
.follow-up-grid > div[b-t5sicyq9mt] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-t5sicyq9mt],
.quality-grid span[b-t5sicyq9mt],
.follow-up-grid span[b-t5sicyq9mt] {
    display:block;
    color:#7e8f87;
    font-size:.78rem;
}

.vital-grid strong[b-t5sicyq9mt],
.quality-grid strong[b-t5sicyq9mt],
.follow-up-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-t5sicyq9mt] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.82rem;
    line-height:1.65;
}

.follow-up-grid[b-t5sicyq9mt],
.quality-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.83rem !important;
    line-height:1.55 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input,
.elderly-care-page[b-t5sicyq9mt]  .mud-select-input {
    font-size:.94rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-list-item-text {
    font-size:.92rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-t5sicyq9mt] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-t5sicyq9mt] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-t5sicyq9mt] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-t5sicyq9mt] { background:rgba(104,120,114,.89); }

.view-source-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-t5sicyq9mt],
    .service-overview[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-t5sicyq9mt],
    .vital-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-t5sicyq9mt] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-t5sicyq9mt],
    .quality-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-t5sicyq9mt],
    .service-overview[b-t5sicyq9mt],
    .care-metrics[b-t5sicyq9mt],
    .source-data-grid[b-t5sicyq9mt],
    .source-photo-grid[b-t5sicyq9mt],
    .vital-grid[b-t5sicyq9mt],
    .follow-up-grid[b-t5sicyq9mt],
    .quality-grid[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.81rem !important;
    }
}

@media print {
    #elderly-care-print-area[b-t5sicyq9mt],
    #elderly-care-print-area *[b-t5sicyq9mt] {
        visibility:visible !important;
    }

    #elderly-care-print-area[b-t5sicyq9mt] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .elderly-view-modal[b-t5sicyq9mt] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-t5sicyq9mt],
    .document-status-strip[b-t5sicyq9mt],
    .patient-panel[b-t5sicyq9mt],
    .document-section[b-t5sicyq9mt],
    .document-footer[b-t5sicyq9mt] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.elderly-hero[b-t5sicyq9mt] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-t5sicyq9mt] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-t5sicyq9mt] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-t5sicyq9mt] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-t5sicyq9mt] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-t5sicyq9mt] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-t5sicyq9mt] { background:#34734b; }
.status-overview-card.follow-up > span[b-t5sicyq9mt] { background:#987634; }
.status-overview-card.referred > span[b-t5sicyq9mt] { background:#2f789f; }
.status-overview-card.overdue > span[b-t5sicyq9mt] { background:#b54d43; }
.status-overview-card.inactive > span[b-t5sicyq9mt] { background:#687872; }

.risk-overview[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-t5sicyq9mt],
.risk-overview-card.selected[b-t5sicyq9mt] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-t5sicyq9mt] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-t5sicyq9mt] {
    display:block;
    color:#71837a;
    font-size:.80rem;
}

.risk-overview-card strong[b-t5sicyq9mt] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-t5sicyq9mt] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-t5sicyq9mt],
.care-metrics strong[b-t5sicyq9mt] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-t5sicyq9mt],
.care-metrics small[b-t5sicyq9mt] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.80rem;
}

.care-metrics[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-t5sicyq9mt] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-t5sicyq9mt],
.risk-adl-cell[b-t5sicyq9mt],
.dependency-living-cell[b-t5sicyq9mt],
.caregiver-cell[b-t5sicyq9mt],
.follow-up-cell[b-t5sicyq9mt],
.status-cell[b-t5sicyq9mt] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-t5sicyq9mt] {
    min-width:190px;
}

.register-age-cell strong[b-t5sicyq9mt],
.risk-adl-cell strong[b-t5sicyq9mt],
.dependency-living-cell strong[b-t5sicyq9mt],
.caregiver-cell strong[b-t5sicyq9mt],
.follow-up-cell strong[b-t5sicyq9mt] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-t5sicyq9mt],
.risk-adl-cell small[b-t5sicyq9mt],
.dependency-living-cell small[b-t5sicyq9mt],
.caregiver-cell small[b-t5sicyq9mt],
.follow-up-cell small[b-t5sicyq9mt],
.status-cell small[b-t5sicyq9mt] {
    margin-top:5px;
    color:#72847b;
    font-size:.78rem;
    line-height:1.55;
}

.register-age-cell em[b-t5sicyq9mt],
.caregiver-cell em[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-t5sicyq9mt],
.dependency-chip[b-t5sicyq9mt],
.status-chip[b-t5sicyq9mt],
.identity-chip[b-t5sicyq9mt],
.overdue-chip[b-t5sicyq9mt] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:800;
}

.risk-chip.low[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.risk-chip.high[b-t5sicyq9mt] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-t5sicyq9mt] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }
.status-chip.active[b-t5sicyq9mt] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-t5sicyq9mt] { color:#987634; background:#fff4df; }
.status-chip.referred[b-t5sicyq9mt] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-t5sicyq9mt] { color:#687872; background:#edf1ef; }

.overdue-chip[b-t5sicyq9mt] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-t5sicyq9mt] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-t5sicyq9mt] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-t5sicyq9mt] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-t5sicyq9mt] {
    color:#2f789f;
    font-size:.80rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-t5sicyq9mt] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-t5sicyq9mt] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-t5sicyq9mt] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-t5sicyq9mt] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.source-data-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-t5sicyq9mt] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.82rem;
    line-height:1.6;
}

.source-actions[b-t5sicyq9mt] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-t5sicyq9mt],
.source-actions button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.80rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-t5sicyq9mt] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-t5sicyq9mt] {
    display:block;
    color:#2f789f;
    font-size:.78rem;
    font-weight:800;
}

.assessment-preview strong[b-t5sicyq9mt] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.80rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-t5sicyq9mt],
.reference-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-t5sicyq9mt],
.reference-grid > div[b-t5sicyq9mt],
.care-plan-grid > div[b-t5sicyq9mt] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-t5sicyq9mt],
.reference-grid span[b-t5sicyq9mt],
.care-plan-grid span[b-t5sicyq9mt] {
    display:block;
    color:#7e8f87;
    font-size:.78rem;
}

.assessment-grid strong[b-t5sicyq9mt],
.reference-grid strong[b-t5sicyq9mt],
.care-plan-grid strong[b-t5sicyq9mt] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-t5sicyq9mt] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-t5sicyq9mt] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input,
.elderly-care-page[b-t5sicyq9mt]  .mud-select-input {
    font-size:.96rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-list-item-text {
    font-size:.94rem !important;
}

.elderly-care-page[b-t5sicyq9mt]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-t5sicyq9mt] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.80rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-t5sicyq9mt] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-t5sicyq9mt] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-t5sicyq9mt] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-t5sicyq9mt] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-t5sicyq9mt] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-t5sicyq9mt] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-t5sicyq9mt] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-t5sicyq9mt] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-t5sicyq9mt],
    .assessment-grid[b-t5sicyq9mt] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-t5sicyq9mt] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-t5sicyq9mt],
    .risk-overview[b-t5sicyq9mt],
    .dependency-grid[b-t5sicyq9mt],
    .care-metrics[b-t5sicyq9mt],
    .source-data-grid[b-t5sicyq9mt],
    .assessment-grid[b-t5sicyq9mt],
    .reference-grid[b-t5sicyq9mt],
    .care-plan-grid[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-t5sicyq9mt] {
        grid-template-columns:minmax(0,1fr);
    }

    .elderly-care-page[b-t5sicyq9mt]  .elderly-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.82rem !important;
    }
}

@media print {
    #elderly-care-print-area[b-t5sicyq9mt],
    #elderly-care-print-area *[b-t5sicyq9mt] {
        visibility:visible !important;
    }

    #elderly-care-print-area[b-t5sicyq9mt] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .elderly-view-modal[b-t5sicyq9mt] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-t5sicyq9mt],
    .document-status-strip[b-t5sicyq9mt],
    .patient-panel[b-t5sicyq9mt],
    .document-section[b-t5sicyq9mt],
    .document-footer[b-t5sicyq9mt] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/03HealthAndSafety/HealthAppointments.razor.rz.scp.css */
:root[b-i3fargpaqw] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.health-appointment-page[b-i3fargpaqw] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.health-appointment-page[b-i3fargpaqw]  .health-appointment-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.health-hero[b-i3fargpaqw] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-i3fargpaqw] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-i3fargpaqw] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-i3fargpaqw],
.hero-action-panel[b-i3fargpaqw] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-i3fargpaqw] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-i3fargpaqw] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-i3fargpaqw] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-i3fargpaqw] {
    color: #d8ede6;
    font-size: .81rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-i3fargpaqw] {
    margin-top: 3px;
    font-size: .94rem;
}

.health-hero h1[b-i3fargpaqw] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.health-hero p[b-i3fargpaqw] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-i3fargpaqw] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .77rem;
    font-weight: 650;
}

.hero-action-panel[b-i3fargpaqw] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-i3fargpaqw] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-i3fargpaqw] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-i3fargpaqw] {
    font-size: .85rem;
}

.hero-status small[b-i3fargpaqw] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .74rem;
}

.health-appointment-page[b-i3fargpaqw]  .hero-add-button,
.health-appointment-page[b-i3fargpaqw]  .toolbar-add-button,
.health-appointment-page[b-i3fargpaqw]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.health-appointment-page[b-i3fargpaqw]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-i3fargpaqw],
.hero-refresh-button[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-i3fargpaqw] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-i3fargpaqw] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-i3fargpaqw] {
    opacity: .55;
    cursor: wait;
}

.health-appointment-page[b-i3fargpaqw]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.health-appointment-page[b-i3fargpaqw]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-i3fargpaqw] {
    margin-top: 2px !important;
}

.summary-card[b-i3fargpaqw] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-i3fargpaqw] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-i3fargpaqw] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-i3fargpaqw] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-i3fargpaqw] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-i3fargpaqw] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-i3fargpaqw] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-i3fargpaqw] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-i3fargpaqw] {
    color: #788982;
    font-size: .77rem;
    font-weight: 650;
}

.summary-card p[b-i3fargpaqw] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-i3fargpaqw] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-i3fargpaqw] {
    color: #798a83;
    font-size: .76rem;
}

.summary-card em[b-i3fargpaqw] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .74rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-i3fargpaqw],
.status-overview-card.selected[b-i3fargpaqw] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-i3fargpaqw] {
    background: #f5faf7;
}

.status-overview-card > span[b-i3fargpaqw] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-i3fargpaqw] { background:#687872; }
.status-overview-card.reviewing > span[b-i3fargpaqw] { background:#987634; }
.status-overview-card.difference > span[b-i3fargpaqw] { background:#b54d43; }
.status-overview-card.approved > span[b-i3fargpaqw] { background:#2f789f; }
.status-overview-card.closed > span[b-i3fargpaqw] { background:#34734b; }
.status-overview-card.voided > span[b-i3fargpaqw] { background:#687872; }
.status-overview-card.today > span[b-i3fargpaqw] { background:#73569b; }

.status-overview-card div[b-i3fargpaqw] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-i3fargpaqw] {
    color: var(--theme-muted);
    font-size: .72rem;
}

.status-overview-card strong[b-i3fargpaqw] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-i3fargpaqw] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-i3fargpaqw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-i3fargpaqw] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-i3fargpaqw] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .76rem;
    font-weight: 700;
}

.variance-grid[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-i3fargpaqw] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-i3fargpaqw] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-i3fargpaqw] {
    display: block;
    color: #3c5047;
    font-size: .81rem;
}

.variance-card small[b-i3fargpaqw] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .72rem;
}

.closing-progress[b-i3fargpaqw] {
    margin-top: 13px;
}

.progress-track[b-i3fargpaqw] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-i3fargpaqw] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-i3fargpaqw] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-i3fargpaqw] {
    display: block;
    color: #87958f;
    font-size: .73rem;
}

.progress-metrics strong[b-i3fargpaqw] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-i3fargpaqw],
.appointment-list-panel[b-i3fargpaqw] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-i3fargpaqw] {
    padding: 15px;
}

.filter-heading[b-i3fargpaqw],
.list-toolbar[b-i3fargpaqw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-i3fargpaqw],
.panel-kicker[b-i3fargpaqw] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-i3fargpaqw],
.list-toolbar h2[b-i3fargpaqw] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-i3fargpaqw],
.list-toolbar p[b-i3fargpaqw] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .77rem;
    line-height: 1.65;
}

.clear-filter-button[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .76rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-i3fargpaqw] {
    margin-top: 8px !important;
}

.health-appointment-page[b-i3fargpaqw]  .premium-field,
.health-appointment-page[b-i3fargpaqw]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.health-appointment-page[b-i3fargpaqw]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .76rem !important;
    text-transform: none !important;
}

.filter-summary[b-i3fargpaqw] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .74rem;
}

.filter-summary strong[b-i3fargpaqw] {
    color: var(--theme-primary);
}

.appointment-list-panel[b-i3fargpaqw] {
    overflow: hidden;
}

.list-toolbar[b-i3fargpaqw] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.health-appointment-page[b-i3fargpaqw]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-i3fargpaqw] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-i3fargpaqw] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-i3fargpaqw] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-i3fargpaqw] {
    margin: 0;
    font-size: .77rem;
}

.health-appointment-page[b-i3fargpaqw]  .appointment-table {
    font-family: 'Kanit',sans-serif;
}

.health-appointment-page[b-i3fargpaqw]  .appointment-table .mud-table-head {
    background: #f1f7f4;
}

.health-appointment-page[b-i3fargpaqw]  .appointment-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .76rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-i3fargpaqw] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-i3fargpaqw] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-i3fargpaqw] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .78rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-i3fargpaqw] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .71rem;
}

.date-shift-cell[b-i3fargpaqw],
.counter-cashier-cell[b-i3fargpaqw],
.money-cell[b-i3fargpaqw],
.difference-cell[b-i3fargpaqw],
.transaction-status-cell[b-i3fargpaqw] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-i3fargpaqw] {
    min-width: 175px;
}

.date-shift-cell strong[b-i3fargpaqw],
.counter-cashier-cell strong[b-i3fargpaqw],
.money-cell strong[b-i3fargpaqw],
.difference-cell strong[b-i3fargpaqw],
.transaction-status-cell strong[b-i3fargpaqw] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-i3fargpaqw],
.counter-cashier-cell small[b-i3fargpaqw],
.money-cell small[b-i3fargpaqw],
.difference-cell small[b-i3fargpaqw] {
    margin-top: 3px;
    color: #84928d;
    font-size: .73rem;
}

.date-shift-cell em[b-i3fargpaqw],
.counter-cashier-cell em[b-i3fargpaqw] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .69rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-i3fargpaqw] { color:var(--theme-primary); }
.money-cell.actual strong[b-i3fargpaqw] { color:#2f789f; }

.difference-cell.matched strong[b-i3fargpaqw] { color:#34734b; }
.difference-cell.over strong[b-i3fargpaqw] { color:#987634; }
.difference-cell.short strong[b-i3fargpaqw] { color:#b54d43; }

.status-chip[b-i3fargpaqw],
.match-chip[b-i3fargpaqw] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .71rem;
    font-weight: 700;
}

.status-chip i[b-i3fargpaqw] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-i3fargpaqw] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.status-chip.difference[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-i3fargpaqw] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-i3fargpaqw] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-i3fargpaqw] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-i3fargpaqw] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-i3fargpaqw] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.health-appointment-page[b-i3fargpaqw]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.health-appointment-page[b-i3fargpaqw]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.health-appointment-page[b-i3fargpaqw]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.health-appointment-page[b-i3fargpaqw]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.health-appointment-page[b-i3fargpaqw]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-i3fargpaqw] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-i3fargpaqw] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .75rem;
}

/* MODALS */

.modal-backdrop[b-i3fargpaqw],
.image-preview-backdrop[b-i3fargpaqw] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.appointment-form-modal[b-i3fargpaqw],
.appointment-view-modal[b-i3fargpaqw],
.delete-modal[b-i3fargpaqw],
.image-preview-modal[b-i3fargpaqw] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-i3fargpaqw],
.view-toolbar[b-i3fargpaqw],
.image-preview-header[b-i3fargpaqw] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-i3fargpaqw] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-i3fargpaqw] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-i3fargpaqw],
.view-toolbar small[b-i3fargpaqw],
.image-preview-header small[b-i3fargpaqw] {
    color:#987634;
    font-size:.77rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-i3fargpaqw],
.view-toolbar h2[b-i3fargpaqw],
.image-preview-header h3[b-i3fargpaqw] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-i3fargpaqw] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.75rem;
}

.modal-body[b-i3fargpaqw],
.view-scroll[b-i3fargpaqw] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-i3fargpaqw] {
    background: #e9efec;
}

.modal-footer[b-i3fargpaqw] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.health-appointment-page[b-i3fargpaqw]  .cancel-button,
.health-appointment-page[b-i3fargpaqw]  .save-button,
.health-appointment-page[b-i3fargpaqw]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.76rem !important;
    text-transform:none !important;
}

.form-section-title[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-i3fargpaqw] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-i3fargpaqw] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-i3fargpaqw] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-i3fargpaqw] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.73rem;
}

.open-transactions-button[b-i3fargpaqw] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.74rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-i3fargpaqw] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-i3fargpaqw],
.calculation-heading[b-i3fargpaqw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-i3fargpaqw],
.calculation-heading small[b-i3fargpaqw] {
    color: #987634;
    font-size: .77rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-i3fargpaqw],
.calculation-heading h3[b-i3fargpaqw] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-i3fargpaqw],
.calculation-heading > span[b-i3fargpaqw] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .74rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-i3fargpaqw] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-i3fargpaqw] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-i3fargpaqw] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.source-summary-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-i3fargpaqw] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-i3fargpaqw] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-i3fargpaqw] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-i3fargpaqw] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-i3fargpaqw] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-i3fargpaqw] {
    display:block;
    color:#84928d;
    font-size:.70rem;
}

.system-amount-card strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.reconciliation-calculation-preview[b-i3fargpaqw] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-i3fargpaqw] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-i3fargpaqw] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-i3fargpaqw] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-i3fargpaqw] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-i3fargpaqw] {
    display:block;
    color:#8b7b74;
    font-size:.73rem;
}

.calculation-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-i3fargpaqw] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.70rem;
}

.calculation-grid .short span[b-i3fargpaqw],
.calculation-grid .short strong[b-i3fargpaqw],
.calculation-grid .short small[b-i3fargpaqw] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-i3fargpaqw] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-i3fargpaqw] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-i3fargpaqw] {
    display:block;
    color:#3c5047;
    font-size:.80rem;
}

.photo-upload-heading small[b-i3fargpaqw] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.69rem;
}

.photo-preview[b-i3fargpaqw] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-i3fargpaqw] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-i3fargpaqw] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-i3fargpaqw] {
    color:#40544b;
    font-size:.80rem;
}

.photo-empty small[b-i3fargpaqw] {
    font-size:.68rem;
}

.photo-upload-actions[b-i3fargpaqw] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-i3fargpaqw],
.remove-photo-button[b-i3fargpaqw] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.74rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-i3fargpaqw] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-i3fargpaqw] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-i3fargpaqw] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-i3fargpaqw],
.detail-transaction-table[b-i3fargpaqw] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-i3fargpaqw],
.source-transaction-row[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-i3fargpaqw] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-i3fargpaqw],
.source-transaction-row > span[b-i3fargpaqw] {
    padding:7px;
    font-size:.71rem;
}

.source-transaction-row[b-i3fargpaqw] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-i3fargpaqw] {
    border-bottom:0;
}

.mini-photo-button[b-i3fargpaqw] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-i3fargpaqw],
.source-transaction-more[b-i3fargpaqw] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.74rem;
    text-align:center;
}

.mock-rule-warning[b-i3fargpaqw] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.76rem !important;
}

/* VIEW & PRINT */

.appointment-view-modal[b-i3fargpaqw] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-i3fargpaqw] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-i3fargpaqw] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.74rem;
    font-weight:700;
    text-decoration:none;
}

.health-appointment-page[b-i3fargpaqw]  .view-edit-button,
.health-appointment-page[b-i3fargpaqw]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.74rem !important;
    text-transform:none !important;
}

.health-appointment-page[b-i3fargpaqw]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-appointment[b-i3fargpaqw] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-i3fargpaqw] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-i3fargpaqw] {
    text-align:center;
}

.document-organization small[b-i3fargpaqw] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-i3fargpaqw] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-i3fargpaqw] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-i3fargpaqw] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-i3fargpaqw],
.document-number-box small[b-i3fargpaqw] {
    display:block;
    color:#778980;
    font-size:.74rem;
}

.document-number-box strong[b-i3fargpaqw] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-i3fargpaqw] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-i3fargpaqw] {
    display:block;
    color:#83918b;
    font-size:.72rem;
}

.document-status-strip > div strong[b-i3fargpaqw] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.77rem;
}

.scope-panel[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-i3fargpaqw] {
    color:#2f789f;
    font-size:.74rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-i3fargpaqw] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-i3fargpaqw] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.76rem;
}

.scope-reference-box[b-i3fargpaqw] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.scope-reference-box strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.81rem;
}

.scope-reference-box small[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-i3fargpaqw],
.transaction-summary-section[b-i3fargpaqw],
.source-transaction-section[b-i3fargpaqw],
.review-section[b-i3fargpaqw] {
    margin-top:16px;
}

.section-title[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-i3fargpaqw] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.82rem;
    font-weight:800;
}

.section-title small[b-i3fargpaqw] {
    color:#987634;
    font-size:.73rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-i3fargpaqw] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-i3fargpaqw] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-i3fargpaqw],
.comparison-row[b-i3fargpaqw],
.comparison-total[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-i3fargpaqw] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-i3fargpaqw],
.comparison-row span[b-i3fargpaqw],
.comparison-total span[b-i3fargpaqw] {
    padding:8px 9px;
    font-size:.73rem;
}

.comparison-row[b-i3fargpaqw] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-i3fargpaqw],
.comparison-total span:not(:first-child)[b-i3fargpaqw] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-i3fargpaqw] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-i3fargpaqw] { color:#34734b; }
.difference-text.over[b-i3fargpaqw] { color:#987634; }
.difference-text.short[b-i3fargpaqw] { color:#b54d43; }

.transaction-summary-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-i3fargpaqw] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-i3fargpaqw] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-i3fargpaqw] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-i3fargpaqw] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-i3fargpaqw] { background:#f4fafc; }

.transaction-summary-grid span[b-i3fargpaqw] {
    display:block;
    color:#84928c;
    font-size:.73rem;
}

.transaction-summary-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-i3fargpaqw] {
    display:block;
    color:#798a83;
    font-size:.70rem;
}

.detail-transaction-header[b-i3fargpaqw],
.detail-transaction-row[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-i3fargpaqw] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-i3fargpaqw],
.detail-transaction-row span[b-i3fargpaqw] {
    padding:8px 7px;
    font-size:.72rem;
}

.detail-transaction-row[b-i3fargpaqw] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-i3fargpaqw] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.review-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.77rem;
}

.review-note-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-i3fargpaqw] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-i3fargpaqw] {
    color:#2f789f;
    font-size:.75rem;
}

.review-note-grid p[b-i3fargpaqw] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.74rem;
    line-height:1.6;
}

.document-footer[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-i3fargpaqw] {
    color:var(--theme-primary);
    font-size:.77rem;
}

.document-footer p[b-i3fargpaqw] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.73rem;
    line-height:1.6;
}

.qr-placeholder[b-i3fargpaqw] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-i3fargpaqw] {
    font-size:.68rem;
    font-weight:700;
}

.mock-document-label[b-i3fargpaqw] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.69rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-i3fargpaqw],
.attachment-panel[b-i3fargpaqw] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-i3fargpaqw] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-i3fargpaqw] {
    color:#987634;
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-i3fargpaqw] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-i3fargpaqw] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.73rem;
    font-weight:700;
}

.history-list[b-i3fargpaqw] {
    display:grid;
    gap:7px;
}

.history-item[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-i3fargpaqw] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-i3fargpaqw] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-i3fargpaqw] {
    color:#3c5047;
    font-size:.80rem;
}

.history-item small[b-i3fargpaqw],
.history-item em[b-i3fargpaqw] {
    color:#84928d;
    font-size:.70rem;
    font-style:normal;
}

.history-item p[b-i3fargpaqw] {
    margin:4px 0;
    color:#5e7068;
    font-size:.75rem;
    line-height:1.55;
}

.attachment-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-i3fargpaqw] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-i3fargpaqw] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-i3fargpaqw] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.71rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-i3fargpaqw] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-i3fargpaqw] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-i3fargpaqw] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-i3fargpaqw] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-i3fargpaqw] { background:rgba(52,115,75,.89); }

.attachment-empty[b-i3fargpaqw] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-i3fargpaqw] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-i3fargpaqw] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-i3fargpaqw] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-i3fargpaqw] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-i3fargpaqw] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-i3fargpaqw] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-i3fargpaqw] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.79rem;
    line-height:1.7;
}

.delete-modal p strong[b-i3fargpaqw] {
    color:#b54d43;
}

.delete-warning[b-i3fargpaqw] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.74rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-i3fargpaqw] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.health-appointment-page[b-i3fargpaqw]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-i3fargpaqw] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .health-hero[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-i3fargpaqw] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-i3fargpaqw] {
        grid-column:1 / -1;
    }

    .document-header[b-i3fargpaqw] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-i3fargpaqw] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-i3fargpaqw] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .health-appointment-page[b-i3fargpaqw] {
        padding-top:10px;
    }

    .health-appointment-page[b-i3fargpaqw]  .health-appointment-container {
        padding-inline:10px !important;
    }

    .health-hero[b-i3fargpaqw] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-i3fargpaqw],
    .list-toolbar[b-i3fargpaqw],
    .source-summary-heading[b-i3fargpaqw],
    .calculation-heading[b-i3fargpaqw],
    .view-toolbar[b-i3fargpaqw],
    .section-heading[b-i3fargpaqw] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-i3fargpaqw],
    .variance-grid[b-i3fargpaqw],
    .progress-metrics[b-i3fargpaqw],
    .source-summary-grid[b-i3fargpaqw],
    .system-amount-grid[b-i3fargpaqw],
    .calculation-grid[b-i3fargpaqw],
    .photo-upload-grid[b-i3fargpaqw],
    .transaction-summary-grid[b-i3fargpaqw],
    .review-grid[b-i3fargpaqw],
    .review-note-grid[b-i3fargpaqw],
    .attachment-grid[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-i3fargpaqw] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-i3fargpaqw] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-i3fargpaqw] {
        width:100%;
    }

    .print-appointment[b-i3fargpaqw] {
        padding:22px 18px;
    }

    .document-footer[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-i3fargpaqw] {
        grid-column:auto;
    }

    .status-overview[b-i3fargpaqw],
    .document-status-strip[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-i3fargpaqw] {
        width:100%;
    }

    .document-header[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-i3fargpaqw] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-i3fargpaqw] {
        visibility:hidden !important;
    }

    #health-appointment-print-area[b-i3fargpaqw],
    #health-appointment-print-area *[b-i3fargpaqw] {
        visibility:visible !important;
    }

    #health-appointment-print-area[b-i3fargpaqw] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-i3fargpaqw] {
        display:none !important;
    }

    .modal-backdrop[b-i3fargpaqw],
    .appointment-view-modal[b-i3fargpaqw],
    .view-scroll[b-i3fargpaqw] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-i3fargpaqw],
    .document-status-strip[b-i3fargpaqw],
    .scope-panel[b-i3fargpaqw],
    .amount-comparison-section[b-i3fargpaqw],
    .transaction-summary-section[b-i3fargpaqw],
    .source-transaction-section[b-i3fargpaqw],
    .review-section[b-i3fargpaqw],
    .document-footer[b-i3fargpaqw] {
        break-inside:avoid;
    }

    .mock-document-label[b-i3fargpaqw] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.health-hero[b-i3fargpaqw] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-i3fargpaqw] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.health-appointment-page[b-i3fargpaqw]  .hero-add-button,
.health-appointment-page[b-i3fargpaqw]  .toolbar-add-button,
.health-appointment-page[b-i3fargpaqw]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-i3fargpaqw] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-i3fargpaqw] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-i3fargpaqw] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-i3fargpaqw] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-i3fargpaqw] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-i3fargpaqw] { background:#987634; }
.status-overview-card.confirmed > span[b-i3fargpaqw] { background:#2f789f; }
.status-overview-card.checked-in > span[b-i3fargpaqw] { background:#73569b; }
.status-overview-card.in-service > span[b-i3fargpaqw] { background:#c46a2b; }
.status-overview-card.completed > span[b-i3fargpaqw] { background:#34734b; }
.status-overview-card.cancelled > span[b-i3fargpaqw] { background:#b54d43; }

.service-overview[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-i3fargpaqw],
.service-overview-card.selected[b-i3fargpaqw] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-i3fargpaqw] {
    background:#f4faf7;
}

.service-overview-card > span[b-i3fargpaqw] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-i3fargpaqw] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-i3fargpaqw] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-i3fargpaqw] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-i3fargpaqw] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-i3fargpaqw] {
    display:block;
    color:var(--theme-muted);
    font-size:.72rem;
}

.service-overview-card strong[b-i3fargpaqw] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-i3fargpaqw] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-i3fargpaqw] {
    display:block;
    color:#3c5047;
    font-size:.79rem;
}

.focus-grid small[b-i3fargpaqw] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.70rem;
}

/* TABLE */

.citizen-photo-cell[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-i3fargpaqw] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-i3fargpaqw] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-i3fargpaqw] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-i3fargpaqw] {
    color:var(--theme-ink);
    font-size:.82rem;
}

.citizen-photo-cell small[b-i3fargpaqw] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.71rem;
}

.appointment-time-cell[b-i3fargpaqw],
.service-unit-cell[b-i3fargpaqw],
.provider-location-cell[b-i3fargpaqw],
.queue-priority-cell[b-i3fargpaqw],
.reason-cell[b-i3fargpaqw],
.status-cell[b-i3fargpaqw] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-i3fargpaqw],
.reason-cell[b-i3fargpaqw] {
    min-width:180px;
}

.appointment-time-cell strong[b-i3fargpaqw],
.service-unit-cell strong[b-i3fargpaqw],
.provider-location-cell strong[b-i3fargpaqw],
.queue-priority-cell strong[b-i3fargpaqw],
.reason-cell strong[b-i3fargpaqw] {
    color:#3c5047;
    font-size:.83rem;
    line-height:1.5;
}

.appointment-time-cell small[b-i3fargpaqw],
.service-unit-cell small[b-i3fargpaqw],
.provider-location-cell small[b-i3fargpaqw],
.queue-priority-cell small[b-i3fargpaqw],
.reason-cell small[b-i3fargpaqw],
.status-cell small[b-i3fargpaqw] {
    margin-top:3px;
    color:#84928d;
    font-size:.72rem;
    line-height:1.5;
}

.appointment-time-cell em[b-i3fargpaqw],
.provider-location-cell em[b-i3fargpaqw] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.69rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-i3fargpaqw],
.priority-chip[b-i3fargpaqw],
.status-chip[b-i3fargpaqw] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.70rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-i3fargpaqw] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-i3fargpaqw] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-i3fargpaqw] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-i3fargpaqw] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-i3fargpaqw] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-i3fargpaqw] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-i3fargpaqw] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-i3fargpaqw] { color:#987634; background:#fff4df; }

.priority-chip[b-i3fargpaqw] {
    margin-top:5px;
}

.priority-chip.normal[b-i3fargpaqw] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-i3fargpaqw] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-i3fargpaqw] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-i3fargpaqw] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-i3fargpaqw] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-i3fargpaqw] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-i3fargpaqw] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-i3fargpaqw] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-i3fargpaqw] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-i3fargpaqw] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-i3fargpaqw] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-i3fargpaqw] {
    color:#2f789f;
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-i3fargpaqw] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-i3fargpaqw] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.75rem;
}

.identity-chip[b-i3fargpaqw] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.72rem;
    font-weight:700;
}

.identity-chip.verified[b-i3fargpaqw] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-i3fargpaqw] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-i3fargpaqw] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-i3fargpaqw] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-i3fargpaqw],
.identity-chip.not-found[b-i3fargpaqw] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-i3fargpaqw] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.70rem;
}

.citizen-source-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.77rem;
    word-break:break-word;
}

.citizen-address[b-i3fargpaqw] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.74rem;
}

.citizen-source-actions[b-i3fargpaqw] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-i3fargpaqw],
.citizen-source-actions a[b-i3fargpaqw] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.71rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-i3fargpaqw] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-i3fargpaqw] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-i3fargpaqw] {
    color:var(--theme-primary);
    font-size:.77rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-i3fargpaqw] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-i3fargpaqw] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.preview-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.77rem;
}

.consent-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-i3fargpaqw] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-i3fargpaqw] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.71rem;
    font-weight:700;
}

.source-photo-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-i3fargpaqw] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-i3fargpaqw] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-i3fargpaqw] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.72rem;
    font-weight:700;
}

.source-photo-card.member > span[b-i3fargpaqw] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-i3fargpaqw] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-i3fargpaqw] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-i3fargpaqw] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-i3fargpaqw] {
    color:#2f789f;
    font-size:.74rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-i3fargpaqw] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-i3fargpaqw] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.75rem;
    line-height:1.5;
}

.identity-box[b-i3fargpaqw] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-i3fargpaqw],
.identity-box small[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.identity-box strong[b-i3fargpaqw] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.80rem;
}

.service-section[b-i3fargpaqw],
.reason-section[b-i3fargpaqw],
.reminder-section[b-i3fargpaqw] {
    margin-top:16px;
}

.reference-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-i3fargpaqw] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-i3fargpaqw],
.timeline-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.reference-grid strong[b-i3fargpaqw],
.timeline-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.77rem;
    word-break:break-word;
}

.note-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-i3fargpaqw] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-i3fargpaqw] {
    display:block;
    color:#87958f;
    font-size:.71rem;
}

.note-grid strong[b-i3fargpaqw] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.77rem;
}

.note-grid p[b-i3fargpaqw] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.74rem;
    line-height:1.6;
}

.timeline-grid[b-i3fargpaqw] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-i3fargpaqw] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-i3fargpaqw] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.69rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-i3fargpaqw] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-i3fargpaqw] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-i3fargpaqw] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-i3fargpaqw] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-i3fargpaqw] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-i3fargpaqw] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-i3fargpaqw] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-i3fargpaqw],
    .preview-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-i3fargpaqw] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-i3fargpaqw] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-i3fargpaqw] {
        grid-column:1 / -1;
    }

    .reference-grid[b-i3fargpaqw],
    .timeline-grid[b-i3fargpaqw] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-i3fargpaqw],
    .focus-grid[b-i3fargpaqw],
    .citizen-source-grid[b-i3fargpaqw],
    .preview-grid[b-i3fargpaqw],
    .consent-grid[b-i3fargpaqw],
    .source-photo-grid[b-i3fargpaqw],
    .reference-grid[b-i3fargpaqw],
    .note-grid[b-i3fargpaqw],
    .timeline-grid[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-i3fargpaqw] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-i3fargpaqw] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-i3fargpaqw] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-i3fargpaqw] {
        margin:0 auto;
    }
}

@media print {
    #health-appointment-print-area[b-i3fargpaqw],
    #health-appointment-print-area *[b-i3fargpaqw] {
        visibility:visible !important;
    }

    #health-appointment-print-area[b-i3fargpaqw] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .appointment-view-modal[b-i3fargpaqw] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-i3fargpaqw],
    .document-status-strip[b-i3fargpaqw],
    .patient-panel[b-i3fargpaqw],
    .service-section[b-i3fargpaqw],
    .reason-section[b-i3fargpaqw],
    .reminder-section[b-i3fargpaqw],
    .document-footer[b-i3fargpaqw] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.health-appointment-page[b-i3fargpaqw] {
    font-size: 16px;
    line-height: 1.55;
}

.health-appointment-page[b-i3fargpaqw]  .mud-typography,
.health-appointment-page[b-i3fargpaqw]  .mud-input,
.health-appointment-page[b-i3fargpaqw]  .mud-input-label,
.health-appointment-page[b-i3fargpaqw]  .mud-select,
.health-appointment-page[b-i3fargpaqw]  .mud-list-item-text,
.health-appointment-page[b-i3fargpaqw]  .mud-button-label,
.health-appointment-page[b-i3fargpaqw]  .mud-table-cell,
.health-appointment-page[b-i3fargpaqw]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.health-appointment-page[b-i3fargpaqw]  .mud-input,
.health-appointment-page[b-i3fargpaqw]  .mud-select-input {
    font-size: .92rem !important;
}

.health-appointment-page[b-i3fargpaqw]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.health-appointment-page[b-i3fargpaqw]  .mud-list-item-text {
    font-size: .90rem !important;
}

.health-appointment-page[b-i3fargpaqw]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.health-appointment-page[b-i3fargpaqw]  .appointment-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
}

.health-appointment-page[b-i3fargpaqw]  .appointment-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .82rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-i3fargpaqw] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-i3fargpaqw] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-i3fargpaqw] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-i3fargpaqw] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-i3fargpaqw] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-i3fargpaqw] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-i3fargpaqw] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-i3fargpaqw] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-i3fargpaqw],
.appointment-list-panel[b-i3fargpaqw],
.insight-panel[b-i3fargpaqw] {
    border-radius: 20px;
}

.filter-panel[b-i3fargpaqw] {
    padding: 20px;
}

.list-toolbar[b-i3fargpaqw] {
    padding: 19px 20px;
}

.filter-heading p[b-i3fargpaqw],
.list-toolbar p[b-i3fargpaqw] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-i3fargpaqw] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-i3fargpaqw] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-i3fargpaqw],
.service-unit-cell[b-i3fargpaqw],
.provider-location-cell[b-i3fargpaqw],
.queue-priority-cell[b-i3fargpaqw],
.reason-cell[b-i3fargpaqw],
.status-cell[b-i3fargpaqw] {
    min-width: 155px;
}

.provider-location-cell[b-i3fargpaqw],
.reason-cell[b-i3fargpaqw] {
    min-width: 215px;
}

.service-chip[b-i3fargpaqw],
.priority-chip[b-i3fargpaqw],
.status-chip[b-i3fargpaqw],
.identity-chip[b-i3fargpaqw] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-i3fargpaqw] {
    min-width: 205px;
    gap: 7px;
}

.health-appointment-page[b-i3fargpaqw]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-i3fargpaqw] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-i3fargpaqw],
.view-toolbar[b-i3fargpaqw],
.image-preview-header[b-i3fargpaqw] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-i3fargpaqw],
.view-scroll[b-i3fargpaqw] {
    padding: 20px;
}

.modal-footer[b-i3fargpaqw] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-i3fargpaqw] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-i3fargpaqw] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-i3fargpaqw],
.preview-grid > div[b-i3fargpaqw],
.reference-grid > div[b-i3fargpaqw],
.timeline-grid > div[b-i3fargpaqw] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-i3fargpaqw] {
    padding: 13px;
}

.photo-preview[b-i3fargpaqw] {
    min-height: 200px;
}

.photo-preview img[b-i3fargpaqw] {
    height: 200px;
}

.history-item[b-i3fargpaqw] {
    padding: 12px;
}

.attachment-card[b-i3fargpaqw],
.attachment-card img[b-i3fargpaqw] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .health-appointment-page[b-i3fargpaqw] {
        font-size: 15px;
    }

    .health-appointment-page[b-i3fargpaqw]  .appointment-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .80rem !important;
    }

    .summary-card[b-i3fargpaqw] {
        min-height: 122px;
    }

    .status-overview-card[b-i3fargpaqw],
    .service-overview-card[b-i3fargpaqw] {
        min-height: 82px;
    }

    .modal-body[b-i3fargpaqw],
    .view-scroll[b-i3fargpaqw] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #health-appointment-print-area[b-i3fargpaqw] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #health-appointment-print-area h1[b-i3fargpaqw] {
        font-size: 18pt !important;
    }

    #health-appointment-print-area h2[b-i3fargpaqw] {
        font-size: 14pt !important;
    }

    #health-appointment-print-area h3[b-i3fargpaqw] {
        font-size: 12pt !important;
    }
}
/* /Components/Pages/02Specialized/03HealthAndSafety/HealthServices.razor.rz.scp.css */
:root[b-tucvbolj91] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.health-service-page[b-tucvbolj91] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.health-service-page[b-tucvbolj91]  .health-service-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.service-hero[b-tucvbolj91] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-tucvbolj91] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-tucvbolj91] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-tucvbolj91],
.hero-action-panel[b-tucvbolj91] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-tucvbolj91] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-tucvbolj91] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-tucvbolj91] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-tucvbolj91] {
    color: #d8ede6;
    font-size: .81rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-tucvbolj91] {
    margin-top: 3px;
    font-size: .94rem;
}

.service-hero h1[b-tucvbolj91] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.service-hero p[b-tucvbolj91] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-tucvbolj91] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-tucvbolj91] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .78rem;
    font-weight: 650;
}

.hero-action-panel[b-tucvbolj91] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-tucvbolj91] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-tucvbolj91] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-tucvbolj91] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-tucvbolj91] {
    font-size: .85rem;
}

.hero-status small[b-tucvbolj91] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .78rem;
}

.health-service-page[b-tucvbolj91]  .hero-add-button,
.health-service-page[b-tucvbolj91]  .toolbar-add-button,
.health-service-page[b-tucvbolj91]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.health-service-page[b-tucvbolj91]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-tucvbolj91],
.hero-refresh-button[b-tucvbolj91] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-tucvbolj91] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-tucvbolj91] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-tucvbolj91] {
    opacity: .55;
    cursor: wait;
}

.health-service-page[b-tucvbolj91]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.health-service-page[b-tucvbolj91]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-tucvbolj91] {
    margin-top: 2px !important;
}

.summary-card[b-tucvbolj91] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-tucvbolj91] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-tucvbolj91] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-tucvbolj91] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-tucvbolj91] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-tucvbolj91] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-tucvbolj91] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-tucvbolj91] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-tucvbolj91] {
    color: #788982;
    font-size: .78rem;
    font-weight: 650;
}

.summary-card p[b-tucvbolj91] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-tucvbolj91] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-tucvbolj91] {
    color: #798a83;
    font-size: .78rem;
}

.summary-card em[b-tucvbolj91] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-tucvbolj91] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-tucvbolj91] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-tucvbolj91],
.status-overview-card.selected[b-tucvbolj91] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-tucvbolj91] {
    background: #f5faf7;
}

.status-overview-card > span[b-tucvbolj91] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-tucvbolj91] { background:#687872; }
.status-overview-card.reviewing > span[b-tucvbolj91] { background:#987634; }
.status-overview-card.difference > span[b-tucvbolj91] { background:#b54d43; }
.status-overview-card.approved > span[b-tucvbolj91] { background:#2f789f; }
.status-overview-card.closed > span[b-tucvbolj91] { background:#34734b; }
.status-overview-card.voided > span[b-tucvbolj91] { background:#687872; }
.status-overview-card.today > span[b-tucvbolj91] { background:#73569b; }

.status-overview-card div[b-tucvbolj91] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-tucvbolj91] {
    color: var(--theme-muted);
    font-size: .78rem;
}

.status-overview-card strong[b-tucvbolj91] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-tucvbolj91] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-tucvbolj91] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-tucvbolj91] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-tucvbolj91] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-tucvbolj91] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-tucvbolj91] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .78rem;
    font-weight: 700;
}

.variance-grid[b-tucvbolj91] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-tucvbolj91] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-tucvbolj91] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-tucvbolj91] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-tucvbolj91] {
    display: block;
    color: #3c5047;
    font-size: .81rem;
}

.variance-card small[b-tucvbolj91] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .78rem;
}

.closing-progress[b-tucvbolj91] {
    margin-top: 13px;
}

.progress-track[b-tucvbolj91] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-tucvbolj91] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-tucvbolj91] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-tucvbolj91] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-tucvbolj91] {
    display: block;
    color: #87958f;
    font-size: .78rem;
}

.progress-metrics strong[b-tucvbolj91] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-tucvbolj91],
.service-history-list-panel[b-tucvbolj91] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-tucvbolj91] {
    padding: 15px;
}

.filter-heading[b-tucvbolj91],
.list-toolbar[b-tucvbolj91] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-tucvbolj91],
.panel-kicker[b-tucvbolj91] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-tucvbolj91],
.list-toolbar h2[b-tucvbolj91] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-tucvbolj91],
.list-toolbar p[b-tucvbolj91] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .78rem;
    line-height: 1.65;
}

.clear-filter-button[b-tucvbolj91] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-tucvbolj91] {
    margin-top: 8px !important;
}

.health-service-page[b-tucvbolj91]  .premium-field,
.health-service-page[b-tucvbolj91]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.health-service-page[b-tucvbolj91]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .78rem !important;
    text-transform: none !important;
}

.filter-summary[b-tucvbolj91] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-tucvbolj91] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .78rem;
}

.filter-summary strong[b-tucvbolj91] {
    color: var(--theme-primary);
}

.service-history-list-panel[b-tucvbolj91] {
    overflow: hidden;
}

.list-toolbar[b-tucvbolj91] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.health-service-page[b-tucvbolj91]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-tucvbolj91] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-tucvbolj91] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-tucvbolj91] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-tucvbolj91] {
    margin: 0;
    font-size: .78rem;
}

.health-service-page[b-tucvbolj91]  .service-history-table {
    font-family: 'Kanit',sans-serif;
}

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-head {
    background: #f1f7f4;
}

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .78rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-tucvbolj91] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-tucvbolj91] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-tucvbolj91] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-tucvbolj91] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-tucvbolj91] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .78rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-tucvbolj91] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .78rem;
}

.date-shift-cell[b-tucvbolj91],
.counter-cashier-cell[b-tucvbolj91],
.money-cell[b-tucvbolj91],
.difference-cell[b-tucvbolj91],
.transaction-status-cell[b-tucvbolj91] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-tucvbolj91] {
    min-width: 175px;
}

.date-shift-cell strong[b-tucvbolj91],
.counter-cashier-cell strong[b-tucvbolj91],
.money-cell strong[b-tucvbolj91],
.difference-cell strong[b-tucvbolj91],
.transaction-status-cell strong[b-tucvbolj91] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-tucvbolj91],
.counter-cashier-cell small[b-tucvbolj91],
.money-cell small[b-tucvbolj91],
.difference-cell small[b-tucvbolj91] {
    margin-top: 3px;
    color: #84928d;
    font-size: .78rem;
}

.date-shift-cell em[b-tucvbolj91],
.counter-cashier-cell em[b-tucvbolj91] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-tucvbolj91] { color:var(--theme-primary); }
.money-cell.actual strong[b-tucvbolj91] { color:#2f789f; }

.difference-cell.matched strong[b-tucvbolj91] { color:#34734b; }
.difference-cell.over strong[b-tucvbolj91] { color:#987634; }
.difference-cell.short strong[b-tucvbolj91] { color:#b54d43; }

.status-chip[b-tucvbolj91],
.match-chip[b-tucvbolj91] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
}

.status-chip i[b-tucvbolj91] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-tucvbolj91] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-tucvbolj91] { color:#987634; background:#fff4df; }
.status-chip.difference[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-tucvbolj91] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-tucvbolj91] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-tucvbolj91] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.health-service-page[b-tucvbolj91]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.health-service-page[b-tucvbolj91]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.health-service-page[b-tucvbolj91]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.health-service-page[b-tucvbolj91]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.health-service-page[b-tucvbolj91]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-tucvbolj91] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-tucvbolj91] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .78rem;
}

/* MODALS */

.modal-backdrop[b-tucvbolj91],
.image-preview-backdrop[b-tucvbolj91] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.service-history-form-modal[b-tucvbolj91],
.service-history-view-modal[b-tucvbolj91],
.delete-modal[b-tucvbolj91],
.image-preview-modal[b-tucvbolj91] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-tucvbolj91],
.view-toolbar[b-tucvbolj91],
.image-preview-header[b-tucvbolj91] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-tucvbolj91] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-tucvbolj91] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-tucvbolj91],
.view-toolbar small[b-tucvbolj91],
.image-preview-header small[b-tucvbolj91] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-tucvbolj91],
.view-toolbar h2[b-tucvbolj91],
.image-preview-header h3[b-tucvbolj91] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-tucvbolj91] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.modal-body[b-tucvbolj91],
.view-scroll[b-tucvbolj91] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-tucvbolj91] {
    background: #e9efec;
}

.modal-footer[b-tucvbolj91] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.health-service-page[b-tucvbolj91]  .cancel-button,
.health-service-page[b-tucvbolj91]  .save-button,
.health-service-page[b-tucvbolj91]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.form-section-title[b-tucvbolj91] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-tucvbolj91] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-tucvbolj91] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-tucvbolj91] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-tucvbolj91] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.open-transactions-button[b-tucvbolj91] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-tucvbolj91] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-tucvbolj91],
.calculation-heading[b-tucvbolj91] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-tucvbolj91],
.calculation-heading small[b-tucvbolj91] {
    color: #987634;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-tucvbolj91],
.calculation-heading h3[b-tucvbolj91] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-tucvbolj91],
.calculation-heading > span[b-tucvbolj91] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .78rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-tucvbolj91] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-tucvbolj91] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-tucvbolj91] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-tucvbolj91] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.source-summary-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-tucvbolj91] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-tucvbolj91] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-tucvbolj91] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-tucvbolj91] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-tucvbolj91] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-tucvbolj91] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-tucvbolj91] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-tucvbolj91] {
    display:block;
    color:#84928d;
    font-size:.78rem;
}

.system-amount-card strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.reconciliation-calculation-preview[b-tucvbolj91] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-tucvbolj91] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-tucvbolj91] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-tucvbolj91] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-tucvbolj91] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-tucvbolj91] {
    display:block;
    color:#8b7b74;
    font-size:.78rem;
}

.calculation-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-tucvbolj91] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.78rem;
}

.calculation-grid .short span[b-tucvbolj91],
.calculation-grid .short strong[b-tucvbolj91],
.calculation-grid .short small[b-tucvbolj91] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-tucvbolj91] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-tucvbolj91] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-tucvbolj91] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-tucvbolj91] {
    display:block;
    color:#3c5047;
    font-size:.80rem;
}

.photo-upload-heading small[b-tucvbolj91] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
}

.photo-preview[b-tucvbolj91] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-tucvbolj91] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-tucvbolj91] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-tucvbolj91] {
    color:#40544b;
    font-size:.80rem;
}

.photo-empty small[b-tucvbolj91] {
    font-size:.78rem;
}

.photo-upload-actions[b-tucvbolj91] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-tucvbolj91],
.remove-photo-button[b-tucvbolj91] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-tucvbolj91] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-tucvbolj91] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-tucvbolj91] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-tucvbolj91],
.detail-transaction-table[b-tucvbolj91] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-tucvbolj91],
.source-transaction-row[b-tucvbolj91] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-tucvbolj91] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-tucvbolj91],
.source-transaction-row > span[b-tucvbolj91] {
    padding:7px;
    font-size:.78rem;
}

.source-transaction-row[b-tucvbolj91] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-tucvbolj91] {
    border-bottom:0;
}

.mini-photo-button[b-tucvbolj91] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-tucvbolj91],
.source-transaction-more[b-tucvbolj91] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.78rem;
    text-align:center;
}

.mock-rule-warning[b-tucvbolj91] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.78rem !important;
}

/* VIEW & PRINT */

.service-history-view-modal[b-tucvbolj91] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-tucvbolj91] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-tucvbolj91] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.health-service-page[b-tucvbolj91]  .view-edit-button,
.health-service-page[b-tucvbolj91]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    text-transform:none !important;
}

.health-service-page[b-tucvbolj91]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-service-history[b-tucvbolj91] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-tucvbolj91] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-tucvbolj91] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-tucvbolj91] {
    text-align:center;
}

.document-organization small[b-tucvbolj91] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-tucvbolj91] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-tucvbolj91] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-tucvbolj91] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-tucvbolj91],
.document-number-box small[b-tucvbolj91] {
    display:block;
    color:#778980;
    font-size:.78rem;
}

.document-number-box strong[b-tucvbolj91] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-tucvbolj91] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-tucvbolj91] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-tucvbolj91] {
    display:block;
    color:#83918b;
    font-size:.78rem;
}

.document-status-strip > div strong[b-tucvbolj91] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.78rem;
}

.scope-panel[b-tucvbolj91] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-tucvbolj91] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-tucvbolj91] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-tucvbolj91] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
}

.scope-reference-box[b-tucvbolj91] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.scope-reference-box strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.81rem;
}

.scope-reference-box small[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-tucvbolj91],
.transaction-summary-section[b-tucvbolj91],
.source-transaction-section[b-tucvbolj91],
.review-section[b-tucvbolj91] {
    margin-top:16px;
}

.section-title[b-tucvbolj91] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-tucvbolj91] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.82rem;
    font-weight:800;
}

.section-title small[b-tucvbolj91] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-tucvbolj91] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-tucvbolj91] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-tucvbolj91],
.comparison-row[b-tucvbolj91],
.comparison-total[b-tucvbolj91] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-tucvbolj91] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-tucvbolj91],
.comparison-row span[b-tucvbolj91],
.comparison-total span[b-tucvbolj91] {
    padding:8px 9px;
    font-size:.78rem;
}

.comparison-row[b-tucvbolj91] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-tucvbolj91],
.comparison-total span:not(:first-child)[b-tucvbolj91] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-tucvbolj91] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-tucvbolj91] { color:#34734b; }
.difference-text.over[b-tucvbolj91] { color:#987634; }
.difference-text.short[b-tucvbolj91] { color:#b54d43; }

.transaction-summary-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-tucvbolj91] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-tucvbolj91] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-tucvbolj91] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-tucvbolj91] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-tucvbolj91] { background:#f4fafc; }

.transaction-summary-grid span[b-tucvbolj91] {
    display:block;
    color:#84928c;
    font-size:.78rem;
}

.transaction-summary-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-tucvbolj91] {
    display:block;
    color:#798a83;
    font-size:.78rem;
}

.detail-transaction-header[b-tucvbolj91],
.detail-transaction-row[b-tucvbolj91] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-tucvbolj91] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-tucvbolj91],
.detail-transaction-row span[b-tucvbolj91] {
    padding:8px 7px;
    font-size:.78rem;
}

.detail-transaction-row[b-tucvbolj91] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-tucvbolj91] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.review-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
}

.review-note-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-tucvbolj91] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-tucvbolj91] {
    color:#2f789f;
    font-size:.78rem;
}

.review-note-grid p[b-tucvbolj91] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.document-footer[b-tucvbolj91] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-tucvbolj91] {
    color:var(--theme-primary);
    font-size:.78rem;
}

.document-footer p[b-tucvbolj91] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.78rem;
    line-height:1.6;
}

.qr-placeholder[b-tucvbolj91] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-tucvbolj91] {
    font-size:.78rem;
    font-weight:700;
}

.mock-document-label[b-tucvbolj91] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.78rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-tucvbolj91],
.attachment-panel[b-tucvbolj91] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-tucvbolj91] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-tucvbolj91] {
    color:#987634;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-tucvbolj91] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-tucvbolj91] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-weight:700;
}

.history-list[b-tucvbolj91] {
    display:grid;
    gap:7px;
}

.history-item[b-tucvbolj91] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-tucvbolj91] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-tucvbolj91] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-tucvbolj91] {
    color:#3c5047;
    font-size:.80rem;
}

.history-item small[b-tucvbolj91],
.history-item em[b-tucvbolj91] {
    color:#84928d;
    font-size:.78rem;
    font-style:normal;
}

.history-item p[b-tucvbolj91] {
    margin:4px 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.55;
}

.attachment-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-tucvbolj91] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-tucvbolj91] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-tucvbolj91] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-tucvbolj91] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-tucvbolj91] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-tucvbolj91] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-tucvbolj91] { background:rgba(52,115,75,.89); }

.attachment-empty[b-tucvbolj91] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-tucvbolj91] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-tucvbolj91] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-tucvbolj91] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-tucvbolj91] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-tucvbolj91] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-tucvbolj91] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-tucvbolj91] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.79rem;
    line-height:1.7;
}

.delete-modal p strong[b-tucvbolj91] {
    color:#b54d43;
}

.delete-warning[b-tucvbolj91] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.78rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-tucvbolj91] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.health-service-page[b-tucvbolj91]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-tucvbolj91] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-tucvbolj91] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-tucvbolj91] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .service-hero[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-tucvbolj91] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-tucvbolj91] {
        grid-column:1 / -1;
    }

    .document-header[b-tucvbolj91] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-tucvbolj91] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-tucvbolj91] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-tucvbolj91] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .health-service-page[b-tucvbolj91] {
        padding-top:10px;
    }

    .health-service-page[b-tucvbolj91]  .health-service-container {
        padding-inline:10px !important;
    }

    .service-hero[b-tucvbolj91] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-tucvbolj91],
    .list-toolbar[b-tucvbolj91],
    .source-summary-heading[b-tucvbolj91],
    .calculation-heading[b-tucvbolj91],
    .view-toolbar[b-tucvbolj91],
    .section-heading[b-tucvbolj91] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-tucvbolj91],
    .variance-grid[b-tucvbolj91],
    .progress-metrics[b-tucvbolj91],
    .source-summary-grid[b-tucvbolj91],
    .system-amount-grid[b-tucvbolj91],
    .calculation-grid[b-tucvbolj91],
    .photo-upload-grid[b-tucvbolj91],
    .transaction-summary-grid[b-tucvbolj91],
    .review-grid[b-tucvbolj91],
    .review-note-grid[b-tucvbolj91],
    .attachment-grid[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-tucvbolj91] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-tucvbolj91] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-tucvbolj91] {
        width:100%;
    }

    .print-service-history[b-tucvbolj91] {
        padding:22px 18px;
    }

    .document-footer[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-tucvbolj91] {
        grid-column:auto;
    }

    .status-overview[b-tucvbolj91],
    .document-status-strip[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-tucvbolj91] {
        width:100%;
    }

    .document-header[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-tucvbolj91] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-tucvbolj91] {
        visibility:hidden !important;
    }

    #health-service-history-print-area[b-tucvbolj91],
    #health-service-history-print-area *[b-tucvbolj91] {
        visibility:visible !important;
    }

    #health-service-history-print-area[b-tucvbolj91] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-tucvbolj91] {
        display:none !important;
    }

    .modal-backdrop[b-tucvbolj91],
    .service-history-view-modal[b-tucvbolj91],
    .view-scroll[b-tucvbolj91] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-tucvbolj91],
    .document-status-strip[b-tucvbolj91],
    .scope-panel[b-tucvbolj91],
    .amount-comparison-section[b-tucvbolj91],
    .transaction-summary-section[b-tucvbolj91],
    .source-transaction-section[b-tucvbolj91],
    .review-section[b-tucvbolj91],
    .document-footer[b-tucvbolj91] {
        break-inside:avoid;
    }

    .mock-document-label[b-tucvbolj91] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.service-hero[b-tucvbolj91] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-tucvbolj91] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.health-service-page[b-tucvbolj91]  .hero-add-button,
.health-service-page[b-tucvbolj91]  .toolbar-add-button,
.health-service-page[b-tucvbolj91]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.78rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-tucvbolj91] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-tucvbolj91] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-tucvbolj91] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-tucvbolj91] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-tucvbolj91] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-tucvbolj91] { background:#987634; }
.status-overview-card.confirmed > span[b-tucvbolj91] { background:#2f789f; }
.status-overview-card.checked-in > span[b-tucvbolj91] { background:#73569b; }
.status-overview-card.in-service > span[b-tucvbolj91] { background:#c46a2b; }
.status-overview-card.completed > span[b-tucvbolj91] { background:#34734b; }
.status-overview-card.cancelled > span[b-tucvbolj91] { background:#b54d43; }

.service-overview[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-tucvbolj91] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-tucvbolj91],
.service-overview-card.selected[b-tucvbolj91] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-tucvbolj91] {
    background:#f4faf7;
}

.service-overview-card > span[b-tucvbolj91] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-tucvbolj91] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-tucvbolj91] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-tucvbolj91] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-tucvbolj91] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-tucvbolj91] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-tucvbolj91] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.service-overview-card strong[b-tucvbolj91] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-tucvbolj91] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-tucvbolj91] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-tucvbolj91] {
    display:block;
    color:#3c5047;
    font-size:.79rem;
}

.focus-grid small[b-tucvbolj91] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.78rem;
}

/* TABLE */

.citizen-photo-cell[b-tucvbolj91] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-tucvbolj91] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-tucvbolj91] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-tucvbolj91] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-tucvbolj91] {
    color:var(--theme-ink);
    font-size:.82rem;
}

.citizen-photo-cell small[b-tucvbolj91] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.78rem;
}

.appointment-time-cell[b-tucvbolj91],
.service-unit-cell[b-tucvbolj91],
.provider-location-cell[b-tucvbolj91],
.queue-priority-cell[b-tucvbolj91],
.reason-cell[b-tucvbolj91],
.status-cell[b-tucvbolj91] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-tucvbolj91],
.reason-cell[b-tucvbolj91] {
    min-width:180px;
}

.appointment-time-cell strong[b-tucvbolj91],
.service-unit-cell strong[b-tucvbolj91],
.provider-location-cell strong[b-tucvbolj91],
.queue-priority-cell strong[b-tucvbolj91],
.reason-cell strong[b-tucvbolj91] {
    color:#3c5047;
    font-size:.83rem;
    line-height:1.5;
}

.appointment-time-cell small[b-tucvbolj91],
.service-unit-cell small[b-tucvbolj91],
.provider-location-cell small[b-tucvbolj91],
.queue-priority-cell small[b-tucvbolj91],
.reason-cell small[b-tucvbolj91],
.status-cell small[b-tucvbolj91] {
    margin-top:3px;
    color:#84928d;
    font-size:.78rem;
    line-height:1.5;
}

.appointment-time-cell em[b-tucvbolj91],
.provider-location-cell em[b-tucvbolj91] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-tucvbolj91],
.priority-chip[b-tucvbolj91],
.status-chip[b-tucvbolj91] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-tucvbolj91] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-tucvbolj91] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-tucvbolj91] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-tucvbolj91] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-tucvbolj91] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-tucvbolj91] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-tucvbolj91] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-tucvbolj91] { color:#987634; background:#fff4df; }

.priority-chip[b-tucvbolj91] {
    margin-top:5px;
}

.priority-chip.normal[b-tucvbolj91] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-tucvbolj91] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-tucvbolj91] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-tucvbolj91] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-tucvbolj91] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-tucvbolj91] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-tucvbolj91] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-tucvbolj91] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-tucvbolj91] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-tucvbolj91] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-tucvbolj91] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-tucvbolj91] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-tucvbolj91] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-tucvbolj91] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-tucvbolj91] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-tucvbolj91] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.78rem;
}

.identity-chip[b-tucvbolj91] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.78rem;
    font-weight:700;
}

.identity-chip.verified[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-tucvbolj91] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-tucvbolj91],
.identity-chip.not-found[b-tucvbolj91] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-tucvbolj91] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.citizen-source-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.citizen-address[b-tucvbolj91] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.78rem;
}

.citizen-source-actions[b-tucvbolj91] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-tucvbolj91],
.citizen-source-actions a[b-tucvbolj91] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-tucvbolj91] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-tucvbolj91] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-tucvbolj91] {
    color:var(--theme-primary);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-tucvbolj91] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-tucvbolj91] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.preview-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.78rem;
}

.consent-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-tucvbolj91] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-tucvbolj91] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-tucvbolj91] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-tucvbolj91] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-tucvbolj91] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
}

.source-photo-card.member > span[b-tucvbolj91] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-tucvbolj91] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-tucvbolj91] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-tucvbolj91] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-tucvbolj91] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-tucvbolj91] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-tucvbolj91] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.78rem;
    line-height:1.5;
}

.identity-box[b-tucvbolj91] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-tucvbolj91],
.identity-box small[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.identity-box strong[b-tucvbolj91] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.80rem;
}

.service-section[b-tucvbolj91],
.reason-section[b-tucvbolj91],
.reminder-section[b-tucvbolj91] {
    margin-top:16px;
}

.reference-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-tucvbolj91] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-tucvbolj91],
.timeline-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.reference-grid strong[b-tucvbolj91],
.timeline-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.78rem;
    word-break:break-word;
}

.note-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-tucvbolj91] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-tucvbolj91] {
    display:block;
    color:#87958f;
    font-size:.78rem;
}

.note-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.78rem;
}

.note-grid p[b-tucvbolj91] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.78rem;
    line-height:1.6;
}

.timeline-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-tucvbolj91] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-tucvbolj91] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.78rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-tucvbolj91] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-tucvbolj91] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-tucvbolj91] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-tucvbolj91] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-tucvbolj91],
    .preview-grid[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-tucvbolj91] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-tucvbolj91] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-tucvbolj91] {
        grid-column:1 / -1;
    }

    .reference-grid[b-tucvbolj91],
    .timeline-grid[b-tucvbolj91] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-tucvbolj91],
    .focus-grid[b-tucvbolj91],
    .citizen-source-grid[b-tucvbolj91],
    .preview-grid[b-tucvbolj91],
    .consent-grid[b-tucvbolj91],
    .source-photo-grid[b-tucvbolj91],
    .reference-grid[b-tucvbolj91],
    .note-grid[b-tucvbolj91],
    .timeline-grid[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-tucvbolj91] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-tucvbolj91] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-tucvbolj91] {
        margin:0 auto;
    }
}

@media print {
    #health-service-history-print-area[b-tucvbolj91],
    #health-service-history-print-area *[b-tucvbolj91] {
        visibility:visible !important;
    }

    #health-service-history-print-area[b-tucvbolj91] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .service-history-view-modal[b-tucvbolj91] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-tucvbolj91],
    .document-status-strip[b-tucvbolj91],
    .patient-panel[b-tucvbolj91],
    .service-section[b-tucvbolj91],
    .reason-section[b-tucvbolj91],
    .reminder-section[b-tucvbolj91],
    .document-footer[b-tucvbolj91] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.health-service-page[b-tucvbolj91] {
    font-size: 16px;
    line-height: 1.55;
}

.health-service-page[b-tucvbolj91]  .mud-typography,
.health-service-page[b-tucvbolj91]  .mud-input,
.health-service-page[b-tucvbolj91]  .mud-input-label,
.health-service-page[b-tucvbolj91]  .mud-select,
.health-service-page[b-tucvbolj91]  .mud-list-item-text,
.health-service-page[b-tucvbolj91]  .mud-button-label,
.health-service-page[b-tucvbolj91]  .mud-table-cell,
.health-service-page[b-tucvbolj91]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.health-service-page[b-tucvbolj91]  .mud-input,
.health-service-page[b-tucvbolj91]  .mud-select-input {
    font-size: .92rem !important;
}

.health-service-page[b-tucvbolj91]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.health-service-page[b-tucvbolj91]  .mud-list-item-text {
    font-size: .90rem !important;
}

.health-service-page[b-tucvbolj91]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
}

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .82rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-tucvbolj91] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-tucvbolj91] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-tucvbolj91] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-tucvbolj91] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-tucvbolj91] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-tucvbolj91] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-tucvbolj91] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-tucvbolj91] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-tucvbolj91],
.service-history-list-panel[b-tucvbolj91],
.insight-panel[b-tucvbolj91] {
    border-radius: 20px;
}

.filter-panel[b-tucvbolj91] {
    padding: 20px;
}

.list-toolbar[b-tucvbolj91] {
    padding: 19px 20px;
}

.filter-heading p[b-tucvbolj91],
.list-toolbar p[b-tucvbolj91] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-tucvbolj91] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-tucvbolj91] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-tucvbolj91],
.service-unit-cell[b-tucvbolj91],
.provider-location-cell[b-tucvbolj91],
.queue-priority-cell[b-tucvbolj91],
.reason-cell[b-tucvbolj91],
.status-cell[b-tucvbolj91] {
    min-width: 155px;
}

.provider-location-cell[b-tucvbolj91],
.reason-cell[b-tucvbolj91] {
    min-width: 215px;
}

.service-chip[b-tucvbolj91],
.priority-chip[b-tucvbolj91],
.status-chip[b-tucvbolj91],
.identity-chip[b-tucvbolj91] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-tucvbolj91] {
    min-width: 205px;
    gap: 7px;
}

.health-service-page[b-tucvbolj91]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-tucvbolj91] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-tucvbolj91],
.view-toolbar[b-tucvbolj91],
.image-preview-header[b-tucvbolj91] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-tucvbolj91],
.view-scroll[b-tucvbolj91] {
    padding: 20px;
}

.modal-footer[b-tucvbolj91] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-tucvbolj91] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-tucvbolj91] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-tucvbolj91],
.preview-grid > div[b-tucvbolj91],
.reference-grid > div[b-tucvbolj91],
.timeline-grid > div[b-tucvbolj91] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-tucvbolj91] {
    padding: 13px;
}

.photo-preview[b-tucvbolj91] {
    min-height: 200px;
}

.photo-preview img[b-tucvbolj91] {
    height: 200px;
}

.history-item[b-tucvbolj91] {
    padding: 12px;
}

.attachment-card[b-tucvbolj91],
.attachment-card img[b-tucvbolj91] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .health-service-page[b-tucvbolj91] {
        font-size: 15px;
    }

    .health-service-page[b-tucvbolj91]  .service-history-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .80rem !important;
    }

    .summary-card[b-tucvbolj91] {
        min-height: 122px;
    }

    .status-overview-card[b-tucvbolj91],
    .service-overview-card[b-tucvbolj91] {
        min-height: 82px;
    }

    .modal-body[b-tucvbolj91],
    .view-scroll[b-tucvbolj91] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #health-service-history-print-area[b-tucvbolj91] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #health-service-history-print-area h1[b-tucvbolj91] {
        font-size: 18pt !important;
    }

    #health-service-history-print-area h2[b-tucvbolj91] {
        font-size: 14pt !important;
    }

    #health-service-history-print-area h3[b-tucvbolj91] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.service-hero[b-tucvbolj91] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-tucvbolj91] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-tucvbolj91] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-tucvbolj91] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-tucvbolj91] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-tucvbolj91] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-tucvbolj91] { background:#34734b; }
.status-overview-card.follow-up > span[b-tucvbolj91] { background:#987634; }
.status-overview-card.referred > span[b-tucvbolj91] { background:#2f789f; }
.status-overview-card.cancelled > span[b-tucvbolj91] { background:#b54d43; }
.status-overview-card.month > span[b-tucvbolj91] { background:#73569b; }

.service-overview[b-tucvbolj91] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-tucvbolj91] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-tucvbolj91] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-tucvbolj91] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-tucvbolj91] {
    display:block;
    color:#7c8d86;
    font-size:.78rem;
}

.care-metrics strong[b-tucvbolj91] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-tucvbolj91],
.service-unit-cell[b-tucvbolj91],
.provider-location-cell[b-tucvbolj91],
.result-cell[b-tucvbolj91],
.follow-score-cell[b-tucvbolj91],
.status-cell[b-tucvbolj91] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-tucvbolj91],
.result-cell[b-tucvbolj91] {
    min-width:230px;
}

.history-date-cell strong[b-tucvbolj91],
.service-unit-cell strong[b-tucvbolj91],
.provider-location-cell strong[b-tucvbolj91],
.result-cell strong[b-tucvbolj91],
.follow-score-cell strong[b-tucvbolj91] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-tucvbolj91],
.service-unit-cell small[b-tucvbolj91],
.provider-location-cell small[b-tucvbolj91],
.result-cell small[b-tucvbolj91],
.follow-score-cell small[b-tucvbolj91],
.status-cell small[b-tucvbolj91] {
    margin-top:5px;
    color:#72847b;
    font-size:.78rem;
    line-height:1.55;
}

.history-date-cell em[b-tucvbolj91],
.provider-location-cell em[b-tucvbolj91] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.78rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-tucvbolj91] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.78rem;
    font-weight:800;
}

.status-chip.draft[b-tucvbolj91] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-tucvbolj91] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-tucvbolj91] { color:#987634; background:#fff4df; }
.status-chip.referred[b-tucvbolj91] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-tucvbolj91] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-tucvbolj91] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-tucvbolj91] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-tucvbolj91] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-tucvbolj91] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-tucvbolj91] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-tucvbolj91] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-tucvbolj91] {
    color:#2f789f;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-tucvbolj91] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-tucvbolj91] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.82rem;
}

.source-data-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-tucvbolj91] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-tucvbolj91] {
    display:block;
    color:var(--theme-muted);
    font-size:.78rem;
}

.source-data-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-tucvbolj91] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-tucvbolj91],
.source-actions button[b-tucvbolj91] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-tucvbolj91] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-tucvbolj91] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-tucvbolj91] {
    min-height:180px;
}

.source-photo-card img[b-tucvbolj91] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-tucvbolj91] {
    margin-top:18px;
}

.vital-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-tucvbolj91],
.quality-grid > div[b-tucvbolj91],
.follow-up-grid > div[b-tucvbolj91] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-tucvbolj91],
.quality-grid span[b-tucvbolj91],
.follow-up-grid span[b-tucvbolj91] {
    display:block;
    color:#7e8f87;
    font-size:.78rem;
}

.vital-grid strong[b-tucvbolj91],
.quality-grid strong[b-tucvbolj91],
.follow-up-grid strong[b-tucvbolj91] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-tucvbolj91] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.82rem;
    line-height:1.65;
}

.follow-up-grid[b-tucvbolj91],
.quality-grid[b-tucvbolj91] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.83rem !important;
    line-height:1.55 !important;
}

.health-service-page[b-tucvbolj91]  .service-history-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.health-service-page[b-tucvbolj91]  .mud-input,
.health-service-page[b-tucvbolj91]  .mud-select-input {
    font-size:.94rem !important;
}

.health-service-page[b-tucvbolj91]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.health-service-page[b-tucvbolj91]  .mud-list-item-text {
    font-size:.92rem !important;
}

.health-service-page[b-tucvbolj91]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-tucvbolj91] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-tucvbolj91] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-tucvbolj91] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-tucvbolj91] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-tucvbolj91] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-tucvbolj91] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-tucvbolj91] { background:rgba(104,120,114,.89); }

.view-source-button[b-tucvbolj91] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.78rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-tucvbolj91],
    .service-overview[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-tucvbolj91],
    .vital-grid[b-tucvbolj91] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-tucvbolj91] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-tucvbolj91],
    .quality-grid[b-tucvbolj91] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-tucvbolj91],
    .service-overview[b-tucvbolj91],
    .care-metrics[b-tucvbolj91],
    .source-data-grid[b-tucvbolj91],
    .source-photo-grid[b-tucvbolj91],
    .vital-grid[b-tucvbolj91],
    .follow-up-grid[b-tucvbolj91],
    .quality-grid[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-tucvbolj91] {
        grid-template-columns:minmax(0,1fr);
    }

    .health-service-page[b-tucvbolj91]  .service-history-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.81rem !important;
    }
}

@media print {
    #health-service-history-print-area[b-tucvbolj91],
    #health-service-history-print-area *[b-tucvbolj91] {
        visibility:visible !important;
    }

    #health-service-history-print-area[b-tucvbolj91] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .service-history-view-modal[b-tucvbolj91] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-tucvbolj91],
    .document-status-strip[b-tucvbolj91],
    .patient-panel[b-tucvbolj91],
    .document-section[b-tucvbolj91],
    .document-footer[b-tucvbolj91] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/03HealthAndSafety/HomeVisits.razor.rz.scp.css */
:root[b-f0r42e9rfq] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.home-visit-page[b-f0r42e9rfq] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.home-visit-page[b-f0r42e9rfq]  .home-visit-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.visit-hero[b-f0r42e9rfq] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-f0r42e9rfq] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-f0r42e9rfq] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-f0r42e9rfq],
.hero-action-panel[b-f0r42e9rfq] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-f0r42e9rfq] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-f0r42e9rfq] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-f0r42e9rfq] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-f0r42e9rfq] {
    color: #d8ede6;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-f0r42e9rfq] {
    margin-top: 3px;
    font-size: .94rem;
}

.visit-hero h1[b-f0r42e9rfq] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.visit-hero p[b-f0r42e9rfq] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-f0r42e9rfq] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .82rem;
    font-weight: 650;
}

.hero-action-panel[b-f0r42e9rfq] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-f0r42e9rfq] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-f0r42e9rfq] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-f0r42e9rfq] {
    font-size: .85rem;
}

.hero-status small[b-f0r42e9rfq] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .82rem;
}

.home-visit-page[b-f0r42e9rfq]  .hero-add-button,
.home-visit-page[b-f0r42e9rfq]  .toolbar-add-button,
.home-visit-page[b-f0r42e9rfq]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.home-visit-page[b-f0r42e9rfq]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-f0r42e9rfq],
.hero-refresh-button[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-f0r42e9rfq] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-f0r42e9rfq] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-f0r42e9rfq] {
    opacity: .55;
    cursor: wait;
}

.home-visit-page[b-f0r42e9rfq]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.home-visit-page[b-f0r42e9rfq]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-f0r42e9rfq] {
    margin-top: 2px !important;
}

.summary-card[b-f0r42e9rfq] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-f0r42e9rfq] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-f0r42e9rfq] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-f0r42e9rfq] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-f0r42e9rfq] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-f0r42e9rfq] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-f0r42e9rfq] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-f0r42e9rfq] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-f0r42e9rfq] {
    color: #788982;
    font-size: .82rem;
    font-weight: 650;
}

.summary-card p[b-f0r42e9rfq] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-f0r42e9rfq] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-f0r42e9rfq] {
    color: #798a83;
    font-size: .82rem;
}

.summary-card em[b-f0r42e9rfq] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .82rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-f0r42e9rfq],
.status-overview-card.selected[b-f0r42e9rfq] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-f0r42e9rfq] {
    background: #f5faf7;
}

.status-overview-card > span[b-f0r42e9rfq] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-f0r42e9rfq] { background:#687872; }
.status-overview-card.reviewing > span[b-f0r42e9rfq] { background:#987634; }
.status-overview-card.difference > span[b-f0r42e9rfq] { background:#b54d43; }
.status-overview-card.approved > span[b-f0r42e9rfq] { background:#2f789f; }
.status-overview-card.closed > span[b-f0r42e9rfq] { background:#34734b; }
.status-overview-card.voided > span[b-f0r42e9rfq] { background:#687872; }
.status-overview-card.today > span[b-f0r42e9rfq] { background:#73569b; }

.status-overview-card div[b-f0r42e9rfq] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-f0r42e9rfq] {
    color: var(--theme-muted);
    font-size: .82rem;
}

.status-overview-card strong[b-f0r42e9rfq] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-f0r42e9rfq] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-f0r42e9rfq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-f0r42e9rfq] {
    color: #987634;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-f0r42e9rfq] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .82rem;
    font-weight: 700;
}

.variance-grid[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-f0r42e9rfq] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-f0r42e9rfq] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-f0r42e9rfq] {
    display: block;
    color: #3c5047;
    font-size: .82rem;
}

.variance-card small[b-f0r42e9rfq] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .82rem;
}

.closing-progress[b-f0r42e9rfq] {
    margin-top: 13px;
}

.progress-track[b-f0r42e9rfq] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-f0r42e9rfq] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-f0r42e9rfq] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-f0r42e9rfq] {
    display: block;
    color: #87958f;
    font-size: .82rem;
}

.progress-metrics strong[b-f0r42e9rfq] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-f0r42e9rfq],
.visit-list-panel[b-f0r42e9rfq] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-f0r42e9rfq] {
    padding: 15px;
}

.filter-heading[b-f0r42e9rfq],
.list-toolbar[b-f0r42e9rfq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-f0r42e9rfq],
.panel-kicker[b-f0r42e9rfq] {
    color: #987634;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-f0r42e9rfq],
.list-toolbar h2[b-f0r42e9rfq] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-f0r42e9rfq],
.list-toolbar p[b-f0r42e9rfq] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .82rem;
    line-height: 1.65;
}

.clear-filter-button[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-f0r42e9rfq] {
    margin-top: 8px !important;
}

.home-visit-page[b-f0r42e9rfq]  .premium-field,
.home-visit-page[b-f0r42e9rfq]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.home-visit-page[b-f0r42e9rfq]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .82rem !important;
    text-transform: none !important;
}

.filter-summary[b-f0r42e9rfq] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .82rem;
}

.filter-summary strong[b-f0r42e9rfq] {
    color: var(--theme-primary);
}

.visit-list-panel[b-f0r42e9rfq] {
    overflow: hidden;
}

.list-toolbar[b-f0r42e9rfq] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.home-visit-page[b-f0r42e9rfq]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-f0r42e9rfq] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-f0r42e9rfq] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-f0r42e9rfq] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-f0r42e9rfq] {
    margin: 0;
    font-size: .82rem;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table {
    font-family: 'Kanit',sans-serif;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-head {
    background: #f1f7f4;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .82rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-f0r42e9rfq] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-f0r42e9rfq] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-f0r42e9rfq] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .82rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-f0r42e9rfq] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .82rem;
}

.date-shift-cell[b-f0r42e9rfq],
.counter-cashier-cell[b-f0r42e9rfq],
.money-cell[b-f0r42e9rfq],
.difference-cell[b-f0r42e9rfq],
.transaction-status-cell[b-f0r42e9rfq] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-f0r42e9rfq] {
    min-width: 175px;
}

.date-shift-cell strong[b-f0r42e9rfq],
.counter-cashier-cell strong[b-f0r42e9rfq],
.money-cell strong[b-f0r42e9rfq],
.difference-cell strong[b-f0r42e9rfq],
.transaction-status-cell strong[b-f0r42e9rfq] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-f0r42e9rfq],
.counter-cashier-cell small[b-f0r42e9rfq],
.money-cell small[b-f0r42e9rfq],
.difference-cell small[b-f0r42e9rfq] {
    margin-top: 3px;
    color: #84928d;
    font-size: .82rem;
}

.date-shift-cell em[b-f0r42e9rfq],
.counter-cashier-cell em[b-f0r42e9rfq] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .82rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-f0r42e9rfq] { color:var(--theme-primary); }
.money-cell.actual strong[b-f0r42e9rfq] { color:#2f789f; }

.difference-cell.matched strong[b-f0r42e9rfq] { color:#34734b; }
.difference-cell.over strong[b-f0r42e9rfq] { color:#987634; }
.difference-cell.short strong[b-f0r42e9rfq] { color:#b54d43; }

.status-chip[b-f0r42e9rfq],
.match-chip[b-f0r42e9rfq] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 700;
}

.status-chip i[b-f0r42e9rfq] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.difference[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-f0r42e9rfq] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-f0r42e9rfq] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.home-visit-page[b-f0r42e9rfq]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.home-visit-page[b-f0r42e9rfq]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.home-visit-page[b-f0r42e9rfq]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.home-visit-page[b-f0r42e9rfq]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.home-visit-page[b-f0r42e9rfq]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-f0r42e9rfq] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-f0r42e9rfq] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .82rem;
}

/* MODALS */

.modal-backdrop[b-f0r42e9rfq],
.image-preview-backdrop[b-f0r42e9rfq] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.visit-form-modal[b-f0r42e9rfq],
.visit-view-modal[b-f0r42e9rfq],
.delete-modal[b-f0r42e9rfq],
.image-preview-modal[b-f0r42e9rfq] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-f0r42e9rfq],
.view-toolbar[b-f0r42e9rfq],
.image-preview-header[b-f0r42e9rfq] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-f0r42e9rfq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-f0r42e9rfq] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-f0r42e9rfq],
.view-toolbar small[b-f0r42e9rfq],
.image-preview-header small[b-f0r42e9rfq] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-f0r42e9rfq],
.view-toolbar h2[b-f0r42e9rfq],
.image-preview-header h3[b-f0r42e9rfq] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-f0r42e9rfq] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.82rem;
}

.modal-body[b-f0r42e9rfq],
.view-scroll[b-f0r42e9rfq] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-f0r42e9rfq] {
    background: #e9efec;
}

.modal-footer[b-f0r42e9rfq] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.home-visit-page[b-f0r42e9rfq]  .cancel-button,
.home-visit-page[b-f0r42e9rfq]  .save-button,
.home-visit-page[b-f0r42e9rfq]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.82rem !important;
    text-transform:none !important;
}

.form-section-title[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-f0r42e9rfq] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-f0r42e9rfq] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-f0r42e9rfq] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-f0r42e9rfq] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.82rem;
}

.open-transactions-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-f0r42e9rfq] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-f0r42e9rfq],
.calculation-heading[b-f0r42e9rfq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-f0r42e9rfq],
.calculation-heading small[b-f0r42e9rfq] {
    color: #987634;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-f0r42e9rfq],
.calculation-heading h3[b-f0r42e9rfq] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-f0r42e9rfq],
.calculation-heading > span[b-f0r42e9rfq] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .82rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-f0r42e9rfq] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-f0r42e9rfq] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-f0r42e9rfq] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.source-summary-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-f0r42e9rfq] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-f0r42e9rfq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-f0r42e9rfq] {
    display:block;
    color:#84928d;
    font-size:.82rem;
}

.system-amount-card strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.reconciliation-calculation-preview[b-f0r42e9rfq] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-f0r42e9rfq] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-f0r42e9rfq] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-f0r42e9rfq] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-f0r42e9rfq] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-f0r42e9rfq] {
    display:block;
    color:#8b7b74;
    font-size:.82rem;
}

.calculation-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-f0r42e9rfq] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.82rem;
}

.calculation-grid .short span[b-f0r42e9rfq],
.calculation-grid .short strong[b-f0r42e9rfq],
.calculation-grid .short small[b-f0r42e9rfq] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-f0r42e9rfq] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-f0r42e9rfq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-f0r42e9rfq] {
    display:block;
    color:#3c5047;
    font-size:.82rem;
}

.photo-upload-heading small[b-f0r42e9rfq] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.82rem;
}

.photo-preview[b-f0r42e9rfq] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-f0r42e9rfq] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-f0r42e9rfq] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-f0r42e9rfq] {
    color:#40544b;
    font-size:.82rem;
}

.photo-empty small[b-f0r42e9rfq] {
    font-size:.82rem;
}

.photo-upload-actions[b-f0r42e9rfq] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-f0r42e9rfq],
.remove-photo-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-f0r42e9rfq] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-f0r42e9rfq] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-f0r42e9rfq] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-f0r42e9rfq],
.detail-transaction-table[b-f0r42e9rfq] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-f0r42e9rfq],
.source-transaction-row[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-f0r42e9rfq] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-f0r42e9rfq],
.source-transaction-row > span[b-f0r42e9rfq] {
    padding:7px;
    font-size:.82rem;
}

.source-transaction-row[b-f0r42e9rfq] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-f0r42e9rfq] {
    border-bottom:0;
}

.mini-photo-button[b-f0r42e9rfq] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-f0r42e9rfq],
.source-transaction-more[b-f0r42e9rfq] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.82rem;
    text-align:center;
}

.mock-rule-warning[b-f0r42e9rfq] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.82rem !important;
}

/* VIEW & PRINT */

.visit-view-modal[b-f0r42e9rfq] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-f0r42e9rfq] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
}

.home-visit-page[b-f0r42e9rfq]  .view-edit-button,
.home-visit-page[b-f0r42e9rfq]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.82rem !important;
    text-transform:none !important;
}

.home-visit-page[b-f0r42e9rfq]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-home-visit[b-f0r42e9rfq] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-f0r42e9rfq] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-f0r42e9rfq] {
    text-align:center;
}

.document-organization small[b-f0r42e9rfq] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-f0r42e9rfq] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-f0r42e9rfq] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-f0r42e9rfq] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-f0r42e9rfq],
.document-number-box small[b-f0r42e9rfq] {
    display:block;
    color:#778980;
    font-size:.82rem;
}

.document-number-box strong[b-f0r42e9rfq] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-f0r42e9rfq] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-f0r42e9rfq] {
    display:block;
    color:#83918b;
    font-size:.82rem;
}

.document-status-strip > div strong[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.82rem;
}

.scope-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.82rem;
}

.scope-reference-box[b-f0r42e9rfq] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.scope-reference-box strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.82rem;
}

.scope-reference-box small[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-f0r42e9rfq],
.transaction-summary-section[b-f0r42e9rfq],
.source-transaction-section[b-f0r42e9rfq],
.review-section[b-f0r42e9rfq] {
    margin-top:16px;
}

.section-title[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-f0r42e9rfq] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.82rem;
    font-weight:800;
}

.section-title small[b-f0r42e9rfq] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-f0r42e9rfq] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-f0r42e9rfq] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-f0r42e9rfq],
.comparison-row[b-f0r42e9rfq],
.comparison-total[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-f0r42e9rfq] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-f0r42e9rfq],
.comparison-row span[b-f0r42e9rfq],
.comparison-total span[b-f0r42e9rfq] {
    padding:8px 9px;
    font-size:.82rem;
}

.comparison-row[b-f0r42e9rfq] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-f0r42e9rfq],
.comparison-total span:not(:first-child)[b-f0r42e9rfq] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-f0r42e9rfq] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-f0r42e9rfq] { color:#34734b; }
.difference-text.over[b-f0r42e9rfq] { color:#987634; }
.difference-text.short[b-f0r42e9rfq] { color:#b54d43; }

.transaction-summary-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-f0r42e9rfq] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-f0r42e9rfq] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-f0r42e9rfq] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-f0r42e9rfq] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-f0r42e9rfq] { background:#f4fafc; }

.transaction-summary-grid span[b-f0r42e9rfq] {
    display:block;
    color:#84928c;
    font-size:.82rem;
}

.transaction-summary-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-f0r42e9rfq] {
    display:block;
    color:#798a83;
    font-size:.82rem;
}

.detail-transaction-header[b-f0r42e9rfq],
.detail-transaction-row[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-f0r42e9rfq] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-f0r42e9rfq],
.detail-transaction-row span[b-f0r42e9rfq] {
    padding:8px 7px;
    font-size:.82rem;
}

.detail-transaction-row[b-f0r42e9rfq] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-f0r42e9rfq] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.review-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
}

.review-note-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-f0r42e9rfq] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
}

.review-note-grid p[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.82rem;
    line-height:1.6;
}

.document-footer[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-f0r42e9rfq] {
    color:var(--theme-primary);
    font-size:.82rem;
}

.document-footer p[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.82rem;
    line-height:1.6;
}

.qr-placeholder[b-f0r42e9rfq] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-f0r42e9rfq] {
    font-size:.82rem;
    font-weight:700;
}

.mock-document-label[b-f0r42e9rfq] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.82rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-f0r42e9rfq],
.attachment-panel[b-f0r42e9rfq] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-f0r42e9rfq] {
    color:#987634;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-f0r42e9rfq] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.82rem;
    font-weight:700;
}

.history-list[b-f0r42e9rfq] {
    display:grid;
    gap:7px;
}

.history-item[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-f0r42e9rfq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-f0r42e9rfq] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-f0r42e9rfq] {
    color:#3c5047;
    font-size:.82rem;
}

.history-item small[b-f0r42e9rfq],
.history-item em[b-f0r42e9rfq] {
    color:#84928d;
    font-size:.82rem;
    font-style:normal;
}

.history-item p[b-f0r42e9rfq] {
    margin:4px 0;
    color:#5e7068;
    font-size:.82rem;
    line-height:1.55;
}

.attachment-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-f0r42e9rfq] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-f0r42e9rfq] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-f0r42e9rfq] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-f0r42e9rfq] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-f0r42e9rfq] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-f0r42e9rfq] { background:rgba(52,115,75,.89); }

.attachment-empty[b-f0r42e9rfq] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-f0r42e9rfq] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-f0r42e9rfq] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-f0r42e9rfq] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-f0r42e9rfq] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-f0r42e9rfq] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-f0r42e9rfq] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-f0r42e9rfq] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.82rem;
    line-height:1.7;
}

.delete-modal p strong[b-f0r42e9rfq] {
    color:#b54d43;
}

.delete-warning[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.82rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-f0r42e9rfq] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.home-visit-page[b-f0r42e9rfq]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .visit-hero[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-f0r42e9rfq] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-f0r42e9rfq] {
        grid-column:1 / -1;
    }

    .document-header[b-f0r42e9rfq] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-f0r42e9rfq] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .home-visit-page[b-f0r42e9rfq] {
        padding-top:10px;
    }

    .home-visit-page[b-f0r42e9rfq]  .home-visit-container {
        padding-inline:10px !important;
    }

    .visit-hero[b-f0r42e9rfq] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-f0r42e9rfq],
    .list-toolbar[b-f0r42e9rfq],
    .source-summary-heading[b-f0r42e9rfq],
    .calculation-heading[b-f0r42e9rfq],
    .view-toolbar[b-f0r42e9rfq],
    .section-heading[b-f0r42e9rfq] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-f0r42e9rfq],
    .variance-grid[b-f0r42e9rfq],
    .progress-metrics[b-f0r42e9rfq],
    .source-summary-grid[b-f0r42e9rfq],
    .system-amount-grid[b-f0r42e9rfq],
    .calculation-grid[b-f0r42e9rfq],
    .photo-upload-grid[b-f0r42e9rfq],
    .transaction-summary-grid[b-f0r42e9rfq],
    .review-grid[b-f0r42e9rfq],
    .review-note-grid[b-f0r42e9rfq],
    .attachment-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-f0r42e9rfq] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-f0r42e9rfq] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-f0r42e9rfq] {
        width:100%;
    }

    .print-home-visit[b-f0r42e9rfq] {
        padding:22px 18px;
    }

    .document-footer[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-f0r42e9rfq] {
        grid-column:auto;
    }

    .status-overview[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-f0r42e9rfq] {
        width:100%;
    }

    .document-header[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-f0r42e9rfq] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-f0r42e9rfq] {
        visibility:hidden !important;
    }

    #home-visit-print-area[b-f0r42e9rfq],
    #home-visit-print-area *[b-f0r42e9rfq] {
        visibility:visible !important;
    }

    #home-visit-print-area[b-f0r42e9rfq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-f0r42e9rfq] {
        display:none !important;
    }

    .modal-backdrop[b-f0r42e9rfq],
    .visit-view-modal[b-f0r42e9rfq],
    .view-scroll[b-f0r42e9rfq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq],
    .scope-panel[b-f0r42e9rfq],
    .amount-comparison-section[b-f0r42e9rfq],
    .transaction-summary-section[b-f0r42e9rfq],
    .source-transaction-section[b-f0r42e9rfq],
    .review-section[b-f0r42e9rfq],
    .document-footer[b-f0r42e9rfq] {
        break-inside:avoid;
    }

    .mock-document-label[b-f0r42e9rfq] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.visit-hero[b-f0r42e9rfq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-f0r42e9rfq] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.home-visit-page[b-f0r42e9rfq]  .hero-add-button,
.home-visit-page[b-f0r42e9rfq]  .toolbar-add-button,
.home-visit-page[b-f0r42e9rfq]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.82rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-f0r42e9rfq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-f0r42e9rfq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-f0r42e9rfq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-f0r42e9rfq] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-f0r42e9rfq] { background:#987634; }
.status-overview-card.confirmed > span[b-f0r42e9rfq] { background:#2f789f; }
.status-overview-card.checked-in > span[b-f0r42e9rfq] { background:#73569b; }
.status-overview-card.in-service > span[b-f0r42e9rfq] { background:#c46a2b; }
.status-overview-card.completed > span[b-f0r42e9rfq] { background:#34734b; }
.status-overview-card.cancelled > span[b-f0r42e9rfq] { background:#b54d43; }

.service-overview[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-f0r42e9rfq],
.service-overview-card.selected[b-f0r42e9rfq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-f0r42e9rfq] {
    background:#f4faf7;
}

.service-overview-card > span[b-f0r42e9rfq] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-f0r42e9rfq] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-f0r42e9rfq] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-muted);
    font-size:.82rem;
}

.service-overview-card strong[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-f0r42e9rfq] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-f0r42e9rfq] {
    display:block;
    color:#3c5047;
    font-size:.82rem;
}

.focus-grid small[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.82rem;
}

/* TABLE */

.citizen-photo-cell[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-f0r42e9rfq] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-f0r42e9rfq] {
    color:var(--theme-ink);
    font-size:.82rem;
}

.citizen-photo-cell small[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.82rem;
}

.appointment-time-cell[b-f0r42e9rfq],
.service-unit-cell[b-f0r42e9rfq],
.provider-location-cell[b-f0r42e9rfq],
.queue-priority-cell[b-f0r42e9rfq],
.reason-cell[b-f0r42e9rfq],
.status-cell[b-f0r42e9rfq] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-f0r42e9rfq],
.reason-cell[b-f0r42e9rfq] {
    min-width:180px;
}

.appointment-time-cell strong[b-f0r42e9rfq],
.service-unit-cell strong[b-f0r42e9rfq],
.provider-location-cell strong[b-f0r42e9rfq],
.queue-priority-cell strong[b-f0r42e9rfq],
.reason-cell strong[b-f0r42e9rfq] {
    color:#3c5047;
    font-size:.83rem;
    line-height:1.5;
}

.appointment-time-cell small[b-f0r42e9rfq],
.service-unit-cell small[b-f0r42e9rfq],
.provider-location-cell small[b-f0r42e9rfq],
.queue-priority-cell small[b-f0r42e9rfq],
.reason-cell small[b-f0r42e9rfq],
.status-cell small[b-f0r42e9rfq] {
    margin-top:3px;
    color:#84928d;
    font-size:.82rem;
    line-height:1.5;
}

.appointment-time-cell em[b-f0r42e9rfq],
.provider-location-cell em[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.82rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-f0r42e9rfq],
.priority-chip[b-f0r42e9rfq],
.status-chip[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.82rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-f0r42e9rfq] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-f0r42e9rfq] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-f0r42e9rfq] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-f0r42e9rfq] { color:#987634; background:#fff4df; }

.priority-chip[b-f0r42e9rfq] {
    margin-top:5px;
}

.priority-chip.normal[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-f0r42e9rfq] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-f0r42e9rfq] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-f0r42e9rfq] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-f0r42e9rfq] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.82rem;
}

.identity-chip[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.82rem;
    font-weight:700;
}

.identity-chip.verified[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-f0r42e9rfq],
.identity-chip.not-found[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-f0r42e9rfq] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.citizen-source-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
    word-break:break-word;
}

.citizen-address[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.82rem;
}

.citizen-source-actions[b-f0r42e9rfq] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-f0r42e9rfq],
.citizen-source-actions a[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-f0r42e9rfq] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-f0r42e9rfq] {
    color:var(--theme-primary);
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-f0r42e9rfq] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-f0r42e9rfq] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.preview-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.82rem;
}

.consent-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-f0r42e9rfq] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-f0r42e9rfq] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.82rem;
    font-weight:700;
}

.source-photo-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-f0r42e9rfq] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-f0r42e9rfq] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-f0r42e9rfq] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
}

.source-photo-card.member > span[b-f0r42e9rfq] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-f0r42e9rfq] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-f0r42e9rfq] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.82rem;
    line-height:1.5;
}

.identity-box[b-f0r42e9rfq] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-f0r42e9rfq],
.identity-box small[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.identity-box strong[b-f0r42e9rfq] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.82rem;
}

.service-section[b-f0r42e9rfq],
.reason-section[b-f0r42e9rfq],
.reminder-section[b-f0r42e9rfq] {
    margin-top:16px;
}

.reference-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-f0r42e9rfq] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-f0r42e9rfq],
.timeline-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.reference-grid strong[b-f0r42e9rfq],
.timeline-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.82rem;
    word-break:break-word;
}

.note-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-f0r42e9rfq] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-f0r42e9rfq] {
    display:block;
    color:#87958f;
    font-size:.82rem;
}

.note-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.82rem;
}

.note-grid p[b-f0r42e9rfq] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.82rem;
    line-height:1.6;
}

.timeline-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-f0r42e9rfq] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.82rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-f0r42e9rfq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-f0r42e9rfq] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-f0r42e9rfq] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-f0r42e9rfq],
    .preview-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-f0r42e9rfq] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-f0r42e9rfq] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-f0r42e9rfq] {
        grid-column:1 / -1;
    }

    .reference-grid[b-f0r42e9rfq],
    .timeline-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-f0r42e9rfq],
    .focus-grid[b-f0r42e9rfq],
    .citizen-source-grid[b-f0r42e9rfq],
    .preview-grid[b-f0r42e9rfq],
    .consent-grid[b-f0r42e9rfq],
    .source-photo-grid[b-f0r42e9rfq],
    .reference-grid[b-f0r42e9rfq],
    .note-grid[b-f0r42e9rfq],
    .timeline-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-f0r42e9rfq] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-f0r42e9rfq] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-f0r42e9rfq] {
        margin:0 auto;
    }
}

@media print {
    #home-visit-print-area[b-f0r42e9rfq],
    #home-visit-print-area *[b-f0r42e9rfq] {
        visibility:visible !important;
    }

    #home-visit-print-area[b-f0r42e9rfq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .visit-view-modal[b-f0r42e9rfq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq],
    .patient-panel[b-f0r42e9rfq],
    .service-section[b-f0r42e9rfq],
    .reason-section[b-f0r42e9rfq],
    .reminder-section[b-f0r42e9rfq],
    .document-footer[b-f0r42e9rfq] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.home-visit-page[b-f0r42e9rfq] {
    font-size: 16px;
    line-height: 1.55;
}

.home-visit-page[b-f0r42e9rfq]  .mud-typography,
.home-visit-page[b-f0r42e9rfq]  .mud-input,
.home-visit-page[b-f0r42e9rfq]  .mud-input-label,
.home-visit-page[b-f0r42e9rfq]  .mud-select,
.home-visit-page[b-f0r42e9rfq]  .mud-list-item-text,
.home-visit-page[b-f0r42e9rfq]  .mud-button-label,
.home-visit-page[b-f0r42e9rfq]  .mud-table-cell,
.home-visit-page[b-f0r42e9rfq]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input,
.home-visit-page[b-f0r42e9rfq]  .mud-select-input {
    font-size: .92rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-list-item-text {
    font-size: .90rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .82rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-f0r42e9rfq] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-f0r42e9rfq] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-f0r42e9rfq] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-f0r42e9rfq] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-f0r42e9rfq] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-f0r42e9rfq] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-f0r42e9rfq] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-f0r42e9rfq] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-f0r42e9rfq],
.visit-list-panel[b-f0r42e9rfq],
.insight-panel[b-f0r42e9rfq] {
    border-radius: 20px;
}

.filter-panel[b-f0r42e9rfq] {
    padding: 20px;
}

.list-toolbar[b-f0r42e9rfq] {
    padding: 19px 20px;
}

.filter-heading p[b-f0r42e9rfq],
.list-toolbar p[b-f0r42e9rfq] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-f0r42e9rfq] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-f0r42e9rfq] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-f0r42e9rfq],
.service-unit-cell[b-f0r42e9rfq],
.provider-location-cell[b-f0r42e9rfq],
.queue-priority-cell[b-f0r42e9rfq],
.reason-cell[b-f0r42e9rfq],
.status-cell[b-f0r42e9rfq] {
    min-width: 155px;
}

.provider-location-cell[b-f0r42e9rfq],
.reason-cell[b-f0r42e9rfq] {
    min-width: 215px;
}

.service-chip[b-f0r42e9rfq],
.priority-chip[b-f0r42e9rfq],
.status-chip[b-f0r42e9rfq],
.identity-chip[b-f0r42e9rfq] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-f0r42e9rfq] {
    min-width: 205px;
    gap: 7px;
}

.home-visit-page[b-f0r42e9rfq]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-f0r42e9rfq] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-f0r42e9rfq],
.view-toolbar[b-f0r42e9rfq],
.image-preview-header[b-f0r42e9rfq] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-f0r42e9rfq],
.view-scroll[b-f0r42e9rfq] {
    padding: 20px;
}

.modal-footer[b-f0r42e9rfq] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-f0r42e9rfq] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-f0r42e9rfq] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-f0r42e9rfq],
.preview-grid > div[b-f0r42e9rfq],
.reference-grid > div[b-f0r42e9rfq],
.timeline-grid > div[b-f0r42e9rfq] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-f0r42e9rfq] {
    padding: 13px;
}

.photo-preview[b-f0r42e9rfq] {
    min-height: 200px;
}

.photo-preview img[b-f0r42e9rfq] {
    height: 200px;
}

.history-item[b-f0r42e9rfq] {
    padding: 12px;
}

.attachment-card[b-f0r42e9rfq],
.attachment-card img[b-f0r42e9rfq] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .home-visit-page[b-f0r42e9rfq] {
        font-size: 15px;
    }

    .home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .82rem !important;
    }

    .summary-card[b-f0r42e9rfq] {
        min-height: 122px;
    }

    .status-overview-card[b-f0r42e9rfq],
    .service-overview-card[b-f0r42e9rfq] {
        min-height: 82px;
    }

    .modal-body[b-f0r42e9rfq],
    .view-scroll[b-f0r42e9rfq] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #home-visit-print-area[b-f0r42e9rfq] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #home-visit-print-area h1[b-f0r42e9rfq] {
        font-size: 18pt !important;
    }

    #home-visit-print-area h2[b-f0r42e9rfq] {
        font-size: 14pt !important;
    }

    #home-visit-print-area h3[b-f0r42e9rfq] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.visit-hero[b-f0r42e9rfq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-f0r42e9rfq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-f0r42e9rfq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-f0r42e9rfq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-f0r42e9rfq] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-f0r42e9rfq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-f0r42e9rfq] { background:#34734b; }
.status-overview-card.follow-up > span[b-f0r42e9rfq] { background:#987634; }
.status-overview-card.referred > span[b-f0r42e9rfq] { background:#2f789f; }
.status-overview-card.cancelled > span[b-f0r42e9rfq] { background:#b54d43; }
.status-overview-card.month > span[b-f0r42e9rfq] { background:#73569b; }

.service-overview[b-f0r42e9rfq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-f0r42e9rfq] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-f0r42e9rfq] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-f0r42e9rfq] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-f0r42e9rfq] {
    display:block;
    color:#7c8d86;
    font-size:.82rem;
}

.care-metrics strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-f0r42e9rfq],
.service-unit-cell[b-f0r42e9rfq],
.provider-location-cell[b-f0r42e9rfq],
.result-cell[b-f0r42e9rfq],
.follow-score-cell[b-f0r42e9rfq],
.status-cell[b-f0r42e9rfq] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-f0r42e9rfq],
.result-cell[b-f0r42e9rfq] {
    min-width:230px;
}

.history-date-cell strong[b-f0r42e9rfq],
.service-unit-cell strong[b-f0r42e9rfq],
.provider-location-cell strong[b-f0r42e9rfq],
.result-cell strong[b-f0r42e9rfq],
.follow-score-cell strong[b-f0r42e9rfq] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-f0r42e9rfq],
.service-unit-cell small[b-f0r42e9rfq],
.provider-location-cell small[b-f0r42e9rfq],
.result-cell small[b-f0r42e9rfq],
.follow-score-cell small[b-f0r42e9rfq],
.status-cell small[b-f0r42e9rfq] {
    margin-top:5px;
    color:#72847b;
    font-size:.82rem;
    line-height:1.55;
}

.history-date-cell em[b-f0r42e9rfq],
.provider-location-cell em[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.82rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.82rem;
    font-weight:800;
}

.status-chip.draft[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-f0r42e9rfq] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-f0r42e9rfq] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-f0r42e9rfq] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-f0r42e9rfq] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.82rem;
}

.source-data-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-f0r42e9rfq] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-muted);
    font-size:.82rem;
}

.source-data-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-f0r42e9rfq] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-f0r42e9rfq],
.source-actions button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-f0r42e9rfq] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-f0r42e9rfq] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-f0r42e9rfq] {
    min-height:180px;
}

.source-photo-card img[b-f0r42e9rfq] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-f0r42e9rfq] {
    margin-top:18px;
}

.vital-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-f0r42e9rfq],
.quality-grid > div[b-f0r42e9rfq],
.follow-up-grid > div[b-f0r42e9rfq] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-f0r42e9rfq],
.quality-grid span[b-f0r42e9rfq],
.follow-up-grid span[b-f0r42e9rfq] {
    display:block;
    color:#7e8f87;
    font-size:.82rem;
}

.vital-grid strong[b-f0r42e9rfq],
.quality-grid strong[b-f0r42e9rfq],
.follow-up-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-f0r42e9rfq] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.82rem;
    line-height:1.65;
}

.follow-up-grid[b-f0r42e9rfq],
.quality-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.83rem !important;
    line-height:1.55 !important;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input,
.home-visit-page[b-f0r42e9rfq]  .mud-select-input {
    font-size:.94rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-list-item-text {
    font-size:.92rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-f0r42e9rfq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-f0r42e9rfq] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-f0r42e9rfq] { background:rgba(104,120,114,.89); }

.view-source-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-f0r42e9rfq],
    .service-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-f0r42e9rfq],
    .vital-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-f0r42e9rfq] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-f0r42e9rfq],
    .quality-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-f0r42e9rfq],
    .service-overview[b-f0r42e9rfq],
    .care-metrics[b-f0r42e9rfq],
    .source-data-grid[b-f0r42e9rfq],
    .source-photo-grid[b-f0r42e9rfq],
    .vital-grid[b-f0r42e9rfq],
    .follow-up-grid[b-f0r42e9rfq],
    .quality-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.82rem !important;
    }
}

@media print {
    #home-visit-print-area[b-f0r42e9rfq],
    #home-visit-print-area *[b-f0r42e9rfq] {
        visibility:visible !important;
    }

    #home-visit-print-area[b-f0r42e9rfq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .visit-view-modal[b-f0r42e9rfq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq],
    .patient-panel[b-f0r42e9rfq],
    .document-section[b-f0r42e9rfq],
    .document-footer[b-f0r42e9rfq] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.visit-hero[b-f0r42e9rfq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-f0r42e9rfq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-f0r42e9rfq] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-f0r42e9rfq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-f0r42e9rfq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-f0r42e9rfq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-f0r42e9rfq] { background:#34734b; }
.status-overview-card.follow-up > span[b-f0r42e9rfq] { background:#987634; }
.status-overview-card.referred > span[b-f0r42e9rfq] { background:#2f789f; }
.status-overview-card.overdue > span[b-f0r42e9rfq] { background:#b54d43; }
.status-overview-card.inactive > span[b-f0r42e9rfq] { background:#687872; }

.risk-overview[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-f0r42e9rfq],
.risk-overview-card.selected[b-f0r42e9rfq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-f0r42e9rfq] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-f0r42e9rfq] {
    display:block;
    color:#71837a;
    font-size:.82rem;
}

.risk-overview-card strong[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-f0r42e9rfq] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-f0r42e9rfq],
.care-metrics strong[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-f0r42e9rfq],
.care-metrics small[b-f0r42e9rfq] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.82rem;
}

.care-metrics[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-f0r42e9rfq] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-f0r42e9rfq],
.risk-adl-cell[b-f0r42e9rfq],
.dependency-living-cell[b-f0r42e9rfq],
.caregiver-cell[b-f0r42e9rfq],
.follow-up-cell[b-f0r42e9rfq],
.status-cell[b-f0r42e9rfq] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-f0r42e9rfq] {
    min-width:190px;
}

.register-age-cell strong[b-f0r42e9rfq],
.risk-adl-cell strong[b-f0r42e9rfq],
.dependency-living-cell strong[b-f0r42e9rfq],
.caregiver-cell strong[b-f0r42e9rfq],
.follow-up-cell strong[b-f0r42e9rfq] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-f0r42e9rfq],
.risk-adl-cell small[b-f0r42e9rfq],
.dependency-living-cell small[b-f0r42e9rfq],
.caregiver-cell small[b-f0r42e9rfq],
.follow-up-cell small[b-f0r42e9rfq],
.status-cell small[b-f0r42e9rfq] {
    margin-top:5px;
    color:#72847b;
    font-size:.82rem;
    line-height:1.55;
}

.register-age-cell em[b-f0r42e9rfq],
.caregiver-cell em[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.82rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-f0r42e9rfq],
.dependency-chip[b-f0r42e9rfq],
.status-chip[b-f0r42e9rfq],
.identity-chip[b-f0r42e9rfq],
.overdue-chip[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.82rem;
    font-weight:800;
}

.risk-chip.low[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.risk-chip.high[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.status-chip.active[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }

.overdue-chip[b-f0r42e9rfq] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-f0r42e9rfq] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-f0r42e9rfq] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-f0r42e9rfq] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-f0r42e9rfq] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-f0r42e9rfq] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-muted);
    font-size:.82rem;
}

.source-data-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.82rem;
    line-height:1.6;
}

.source-actions[b-f0r42e9rfq] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-f0r42e9rfq],
.source-actions button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-f0r42e9rfq] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-f0r42e9rfq] {
    display:block;
    color:#2f789f;
    font-size:.82rem;
    font-weight:800;
}

.assessment-preview strong[b-f0r42e9rfq] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.82rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-f0r42e9rfq],
.reference-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-f0r42e9rfq],
.reference-grid > div[b-f0r42e9rfq],
.care-plan-grid > div[b-f0r42e9rfq] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-f0r42e9rfq],
.reference-grid span[b-f0r42e9rfq],
.care-plan-grid span[b-f0r42e9rfq] {
    display:block;
    color:#7e8f87;
    font-size:.82rem;
}

.assessment-grid strong[b-f0r42e9rfq],
.reference-grid strong[b-f0r42e9rfq],
.care-plan-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-f0r42e9rfq] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input,
.home-visit-page[b-f0r42e9rfq]  .mud-select-input {
    font-size:.96rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-list-item-text {
    font-size:.94rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.82rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-f0r42e9rfq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-f0r42e9rfq] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-f0r42e9rfq] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-f0r42e9rfq] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-f0r42e9rfq] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-f0r42e9rfq],
    .assessment-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-f0r42e9rfq] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-f0r42e9rfq],
    .risk-overview[b-f0r42e9rfq],
    .dependency-grid[b-f0r42e9rfq],
    .care-metrics[b-f0r42e9rfq],
    .source-data-grid[b-f0r42e9rfq],
    .assessment-grid[b-f0r42e9rfq],
    .reference-grid[b-f0r42e9rfq],
    .care-plan-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.82rem !important;
    }
}

@media print {
    #home-visit-print-area[b-f0r42e9rfq],
    #home-visit-print-area *[b-f0r42e9rfq] {
        visibility:visible !important;
    }

    #home-visit-print-area[b-f0r42e9rfq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .visit-view-modal[b-f0r42e9rfq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq],
    .patient-panel[b-f0r42e9rfq],
    .document-section[b-f0r42e9rfq],
    .document-footer[b-f0r42e9rfq] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.home-visit-page[b-f0r42e9rfq] {
    font-size:16.5px;
    line-height:1.62;
}

.visit-hero[b-f0r42e9rfq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-f0r42e9rfq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-f0r42e9rfq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-f0r42e9rfq] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-f0r42e9rfq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-f0r42e9rfq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-f0r42e9rfq] { background:#73569b; }
.status-overview-card.field > span[b-f0r42e9rfq] { background:#2f789f; }
.status-overview-card.completed > span[b-f0r42e9rfq] { background:#34734b; }
.status-overview-card.follow-up > span[b-f0r42e9rfq] { background:#987634; }
.status-overview-card.referred > span[b-f0r42e9rfq] { background:#b55b82; }

.visit-type-overview[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-f0r42e9rfq],
.visit-type-overview-card.selected[b-f0r42e9rfq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-f0r42e9rfq] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-f0r42e9rfq] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-f0r42e9rfq] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-f0r42e9rfq] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-f0r42e9rfq] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-f0r42e9rfq] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-f0r42e9rfq] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-f0r42e9rfq] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-f0r42e9rfq] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-f0r42e9rfq] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-f0r42e9rfq],
.care-metrics strong[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-f0r42e9rfq],
.care-metrics small[b-f0r42e9rfq] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-f0r42e9rfq],
.visit-type-cell[b-f0r42e9rfq],
.team-location-cell[b-f0r42e9rfq],
.result-cell[b-f0r42e9rfq],
.follow-cell[b-f0r42e9rfq],
.status-cell[b-f0r42e9rfq] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-f0r42e9rfq],
.result-cell[b-f0r42e9rfq] {
    min-width:230px;
}

.visit-date-cell strong[b-f0r42e9rfq],
.visit-type-cell strong[b-f0r42e9rfq],
.team-location-cell strong[b-f0r42e9rfq],
.result-cell strong[b-f0r42e9rfq],
.follow-cell strong[b-f0r42e9rfq] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-f0r42e9rfq],
.visit-type-cell small[b-f0r42e9rfq],
.team-location-cell small[b-f0r42e9rfq],
.result-cell small[b-f0r42e9rfq],
.follow-cell small[b-f0r42e9rfq],
.status-cell small[b-f0r42e9rfq] {
    margin-top:6px;
    color:#72847b;
    font-size:.82rem;
    line-height:1.58;
}

.visit-date-cell em[b-f0r42e9rfq],
.team-location-cell em[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.82rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-f0r42e9rfq],
.status-chip[b-f0r42e9rfq],
.identity-chip[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.82rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-f0r42e9rfq] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-f0r42e9rfq] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-f0r42e9rfq] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-f0r42e9rfq] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-f0r42e9rfq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-f0r42e9rfq] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.priority-text[b-f0r42e9rfq] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-f0r42e9rfq] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-f0r42e9rfq] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-f0r42e9rfq] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-f0r42e9rfq] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-f0r42e9rfq] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-f0r42e9rfq] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-f0r42e9rfq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-f0r42e9rfq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-f0r42e9rfq] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-f0r42e9rfq] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-f0r42e9rfq] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-f0r42e9rfq] {
    display:block;
    color:var(--theme-muted);
    font-size:.82rem;
}

.source-data-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-f0r42e9rfq] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-f0r42e9rfq] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-f0r42e9rfq] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-f0r42e9rfq] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-f0r42e9rfq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-f0r42e9rfq],
.reference-grid > div[b-f0r42e9rfq] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-f0r42e9rfq],
.reference-grid span[b-f0r42e9rfq] {
    display:block;
    color:#7e8f87;
    font-size:.82rem;
}

.vital-grid strong[b-f0r42e9rfq],
.reference-grid strong[b-f0r42e9rfq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input,
.home-visit-page[b-f0r42e9rfq]  .mud-select-input {
    font-size:1rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-list-item-text {
    font-size:.98rem !important;
}

.home-visit-page[b-f0r42e9rfq]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-f0r42e9rfq] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-f0r42e9rfq] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-f0r42e9rfq] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-f0r42e9rfq] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-f0r42e9rfq] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-f0r42e9rfq] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-f0r42e9rfq] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-f0r42e9rfq] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-f0r42e9rfq] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-f0r42e9rfq] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-f0r42e9rfq] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-f0r42e9rfq] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-f0r42e9rfq] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-f0r42e9rfq] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-f0r42e9rfq] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-f0r42e9rfq] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-f0r42e9rfq],
    .visit-type-overview[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-f0r42e9rfq],
    .reference-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-f0r42e9rfq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-f0r42e9rfq] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-f0r42e9rfq],
    .visit-type-overview[b-f0r42e9rfq],
    .target-grid[b-f0r42e9rfq],
    .care-metrics[b-f0r42e9rfq],
    .source-data-grid[b-f0r42e9rfq],
    .reference-grid[b-f0r42e9rfq],
    .vital-grid[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-f0r42e9rfq] {
        grid-template-columns:minmax(0,1fr);
    }

    .home-visit-page[b-f0r42e9rfq]  .visit-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #home-visit-print-area[b-f0r42e9rfq],
    #home-visit-print-area *[b-f0r42e9rfq] {
        visibility:visible !important;
    }

    #home-visit-print-area[b-f0r42e9rfq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .visit-view-modal[b-f0r42e9rfq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-f0r42e9rfq],
    .document-status-strip[b-f0r42e9rfq],
    .patient-panel[b-f0r42e9rfq],
    .document-section[b-f0r42e9rfq],
    .document-footer[b-f0r42e9rfq] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/04Welfare/WelfareApplications.razor.rz.scp.css */
:root[b-hi4z6ifdoq] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.welfare-page[b-hi4z6ifdoq] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.welfare-page[b-hi4z6ifdoq]  .welfare-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.welfare-hero[b-hi4z6ifdoq] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-hi4z6ifdoq] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-hi4z6ifdoq] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-hi4z6ifdoq],
.hero-action-panel[b-hi4z6ifdoq] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-hi4z6ifdoq] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-hi4z6ifdoq] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-hi4z6ifdoq] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-hi4z6ifdoq] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-hi4z6ifdoq] {
    margin-top: 3px;
    font-size: .94rem;
}

.welfare-hero h1[b-hi4z6ifdoq] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.welfare-hero p[b-hi4z6ifdoq] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-hi4z6ifdoq] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-hi4z6ifdoq] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-hi4z6ifdoq] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-hi4z6ifdoq] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-hi4z6ifdoq] {
    font-size: .85rem;
}

.hero-status small[b-hi4z6ifdoq] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.welfare-page[b-hi4z6ifdoq]  .hero-add-button,
.welfare-page[b-hi4z6ifdoq]  .toolbar-add-button,
.welfare-page[b-hi4z6ifdoq]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.welfare-page[b-hi4z6ifdoq]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-hi4z6ifdoq],
.hero-refresh-button[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-hi4z6ifdoq] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-hi4z6ifdoq] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-hi4z6ifdoq] {
    opacity: .55;
    cursor: wait;
}

.welfare-page[b-hi4z6ifdoq]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.welfare-page[b-hi4z6ifdoq]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-hi4z6ifdoq] {
    margin-top: 2px !important;
}

.summary-card[b-hi4z6ifdoq] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-hi4z6ifdoq] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-hi4z6ifdoq] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-hi4z6ifdoq] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-hi4z6ifdoq] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-hi4z6ifdoq] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-hi4z6ifdoq] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-hi4z6ifdoq] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-hi4z6ifdoq] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-hi4z6ifdoq] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-hi4z6ifdoq] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-hi4z6ifdoq] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-hi4z6ifdoq] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-hi4z6ifdoq],
.status-overview-card.selected[b-hi4z6ifdoq] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-hi4z6ifdoq] {
    background: #f5faf7;
}

.status-overview-card > span[b-hi4z6ifdoq] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-hi4z6ifdoq] { background:#687872; }
.status-overview-card.reviewing > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.difference > span[b-hi4z6ifdoq] { background:#b54d43; }
.status-overview-card.approved > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.closed > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.voided > span[b-hi4z6ifdoq] { background:#687872; }
.status-overview-card.today > span[b-hi4z6ifdoq] { background:#73569b; }

.status-overview-card div[b-hi4z6ifdoq] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-hi4z6ifdoq] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-hi4z6ifdoq] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-hi4z6ifdoq] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-hi4z6ifdoq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-hi4z6ifdoq] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-hi4z6ifdoq] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-hi4z6ifdoq] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-hi4z6ifdoq] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-hi4z6ifdoq] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-hi4z6ifdoq] {
    margin-top: 13px;
}

.progress-track[b-hi4z6ifdoq] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-hi4z6ifdoq] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-hi4z6ifdoq] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-hi4z6ifdoq] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-hi4z6ifdoq] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-hi4z6ifdoq],
.application-list-panel[b-hi4z6ifdoq] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-hi4z6ifdoq] {
    padding: 15px;
}

.filter-heading[b-hi4z6ifdoq],
.list-toolbar[b-hi4z6ifdoq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-hi4z6ifdoq],
.panel-kicker[b-hi4z6ifdoq] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-hi4z6ifdoq],
.list-toolbar h2[b-hi4z6ifdoq] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-hi4z6ifdoq],
.list-toolbar p[b-hi4z6ifdoq] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-hi4z6ifdoq] {
    margin-top: 8px !important;
}

.welfare-page[b-hi4z6ifdoq]  .premium-field,
.welfare-page[b-hi4z6ifdoq]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.welfare-page[b-hi4z6ifdoq]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-hi4z6ifdoq] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-hi4z6ifdoq] {
    color: var(--theme-primary);
}

.application-list-panel[b-hi4z6ifdoq] {
    overflow: hidden;
}

.list-toolbar[b-hi4z6ifdoq] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.welfare-page[b-hi4z6ifdoq]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-hi4z6ifdoq] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-hi4z6ifdoq] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-hi4z6ifdoq] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-hi4z6ifdoq] {
    margin: 0;
    font-size: .84rem;
}

.welfare-page[b-hi4z6ifdoq]  .application-table {
    font-family: 'Kanit',sans-serif;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head {
    background: #f1f7f4;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-hi4z6ifdoq] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-hi4z6ifdoq] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-hi4z6ifdoq] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-hi4z6ifdoq] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-hi4z6ifdoq],
.counter-cashier-cell[b-hi4z6ifdoq],
.money-cell[b-hi4z6ifdoq],
.difference-cell[b-hi4z6ifdoq],
.transaction-status-cell[b-hi4z6ifdoq] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-hi4z6ifdoq] {
    min-width: 175px;
}

.date-shift-cell strong[b-hi4z6ifdoq],
.counter-cashier-cell strong[b-hi4z6ifdoq],
.money-cell strong[b-hi4z6ifdoq],
.difference-cell strong[b-hi4z6ifdoq],
.transaction-status-cell strong[b-hi4z6ifdoq] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-hi4z6ifdoq],
.counter-cashier-cell small[b-hi4z6ifdoq],
.money-cell small[b-hi4z6ifdoq],
.difference-cell small[b-hi4z6ifdoq] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-hi4z6ifdoq],
.counter-cashier-cell em[b-hi4z6ifdoq] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-hi4z6ifdoq] { color:var(--theme-primary); }
.money-cell.actual strong[b-hi4z6ifdoq] { color:#2f789f; }

.difference-cell.matched strong[b-hi4z6ifdoq] { color:#34734b; }
.difference-cell.over strong[b-hi4z6ifdoq] { color:#987634; }
.difference-cell.short strong[b-hi4z6ifdoq] { color:#b54d43; }

.status-chip[b-hi4z6ifdoq],
.match-chip[b-hi4z6ifdoq] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-hi4z6ifdoq] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.difference[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-hi4z6ifdoq] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-hi4z6ifdoq] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.welfare-page[b-hi4z6ifdoq]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.welfare-page[b-hi4z6ifdoq]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.welfare-page[b-hi4z6ifdoq]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.welfare-page[b-hi4z6ifdoq]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.welfare-page[b-hi4z6ifdoq]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-hi4z6ifdoq] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-hi4z6ifdoq] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-hi4z6ifdoq],
.image-preview-backdrop[b-hi4z6ifdoq] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.application-form-modal[b-hi4z6ifdoq],
.application-view-modal[b-hi4z6ifdoq],
.delete-modal[b-hi4z6ifdoq],
.image-preview-modal[b-hi4z6ifdoq] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-hi4z6ifdoq],
.view-toolbar[b-hi4z6ifdoq],
.image-preview-header[b-hi4z6ifdoq] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-hi4z6ifdoq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-hi4z6ifdoq] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-hi4z6ifdoq],
.view-toolbar small[b-hi4z6ifdoq],
.image-preview-header small[b-hi4z6ifdoq] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-hi4z6ifdoq],
.view-toolbar h2[b-hi4z6ifdoq],
.image-preview-header h3[b-hi4z6ifdoq] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-hi4z6ifdoq] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-hi4z6ifdoq],
.view-scroll[b-hi4z6ifdoq] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-hi4z6ifdoq] {
    background: #e9efec;
}

.modal-footer[b-hi4z6ifdoq] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.welfare-page[b-hi4z6ifdoq]  .cancel-button,
.welfare-page[b-hi4z6ifdoq]  .save-button,
.welfare-page[b-hi4z6ifdoq]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-hi4z6ifdoq] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-hi4z6ifdoq] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-hi4z6ifdoq] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-hi4z6ifdoq] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-hi4z6ifdoq] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-hi4z6ifdoq],
.calculation-heading[b-hi4z6ifdoq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-hi4z6ifdoq],
.calculation-heading small[b-hi4z6ifdoq] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-hi4z6ifdoq],
.calculation-heading h3[b-hi4z6ifdoq] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-hi4z6ifdoq],
.calculation-heading > span[b-hi4z6ifdoq] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-hi4z6ifdoq] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-hi4z6ifdoq] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-hi4z6ifdoq] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-hi4z6ifdoq] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-hi4z6ifdoq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-hi4z6ifdoq] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-hi4z6ifdoq] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-hi4z6ifdoq] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-hi4z6ifdoq] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-hi4z6ifdoq] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-hi4z6ifdoq] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-hi4z6ifdoq] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-hi4z6ifdoq],
.calculation-grid .short strong[b-hi4z6ifdoq],
.calculation-grid .short small[b-hi4z6ifdoq] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-hi4z6ifdoq] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-hi4z6ifdoq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-hi4z6ifdoq] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-hi4z6ifdoq] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-hi4z6ifdoq] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-hi4z6ifdoq] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-hi4z6ifdoq] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-hi4z6ifdoq] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-hi4z6ifdoq] {
    font-size:.84rem;
}

.photo-upload-actions[b-hi4z6ifdoq] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-hi4z6ifdoq],
.remove-photo-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-hi4z6ifdoq] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-hi4z6ifdoq] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-hi4z6ifdoq] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-hi4z6ifdoq],
.detail-transaction-table[b-hi4z6ifdoq] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-hi4z6ifdoq],
.source-transaction-row[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-hi4z6ifdoq] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-hi4z6ifdoq],
.source-transaction-row > span[b-hi4z6ifdoq] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-hi4z6ifdoq] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-hi4z6ifdoq] {
    border-bottom:0;
}

.mini-photo-button[b-hi4z6ifdoq] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-hi4z6ifdoq],
.source-transaction-more[b-hi4z6ifdoq] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-hi4z6ifdoq] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.application-view-modal[b-hi4z6ifdoq] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-hi4z6ifdoq] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.welfare-page[b-hi4z6ifdoq]  .view-edit-button,
.welfare-page[b-hi4z6ifdoq]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.welfare-page[b-hi4z6ifdoq]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-welfare-application[b-hi4z6ifdoq] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-hi4z6ifdoq] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-hi4z6ifdoq] {
    text-align:center;
}

.document-organization small[b-hi4z6ifdoq] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-hi4z6ifdoq] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-hi4z6ifdoq] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-hi4z6ifdoq] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-hi4z6ifdoq],
.document-number-box small[b-hi4z6ifdoq] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-hi4z6ifdoq] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-hi4z6ifdoq] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-hi4z6ifdoq] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-hi4z6ifdoq] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-hi4z6ifdoq],
.transaction-summary-section[b-hi4z6ifdoq],
.source-transaction-section[b-hi4z6ifdoq],
.review-section[b-hi4z6ifdoq] {
    margin-top:16px;
}

.section-title[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-hi4z6ifdoq] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-hi4z6ifdoq] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-hi4z6ifdoq] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-hi4z6ifdoq] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-hi4z6ifdoq],
.comparison-row[b-hi4z6ifdoq],
.comparison-total[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-hi4z6ifdoq] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-hi4z6ifdoq],
.comparison-row span[b-hi4z6ifdoq],
.comparison-total span[b-hi4z6ifdoq] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-hi4z6ifdoq] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-hi4z6ifdoq],
.comparison-total span:not(:first-child)[b-hi4z6ifdoq] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-hi4z6ifdoq] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-hi4z6ifdoq] { color:#34734b; }
.difference-text.over[b-hi4z6ifdoq] { color:#987634; }
.difference-text.short[b-hi4z6ifdoq] { color:#b54d43; }

.transaction-summary-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-hi4z6ifdoq] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-hi4z6ifdoq] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-hi4z6ifdoq] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-hi4z6ifdoq] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-hi4z6ifdoq] { background:#f4fafc; }

.transaction-summary-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-hi4z6ifdoq] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-hi4z6ifdoq],
.detail-transaction-row[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-hi4z6ifdoq] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-hi4z6ifdoq],
.detail-transaction-row span[b-hi4z6ifdoq] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-hi4z6ifdoq] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-hi4z6ifdoq] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-hi4z6ifdoq] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-hi4z6ifdoq] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-hi4z6ifdoq] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-hi4z6ifdoq] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-hi4z6ifdoq] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-hi4z6ifdoq],
.attachment-panel[b-hi4z6ifdoq] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-hi4z6ifdoq] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-hi4z6ifdoq] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-hi4z6ifdoq] {
    display:grid;
    gap:7px;
}

.history-item[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-hi4z6ifdoq] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-hi4z6ifdoq] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-hi4z6ifdoq] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-hi4z6ifdoq],
.history-item em[b-hi4z6ifdoq] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-hi4z6ifdoq] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-hi4z6ifdoq] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-hi4z6ifdoq] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-hi4z6ifdoq] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.89); }

.attachment-empty[b-hi4z6ifdoq] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-hi4z6ifdoq] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-hi4z6ifdoq] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-hi4z6ifdoq] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-hi4z6ifdoq] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-hi4z6ifdoq] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-hi4z6ifdoq] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-hi4z6ifdoq] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-hi4z6ifdoq] {
    color:#b54d43;
}

.delete-warning[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-hi4z6ifdoq] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.welfare-page[b-hi4z6ifdoq]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .welfare-hero[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-hi4z6ifdoq] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-hi4z6ifdoq] {
        grid-column:1 / -1;
    }

    .document-header[b-hi4z6ifdoq] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-hi4z6ifdoq] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .welfare-page[b-hi4z6ifdoq] {
        padding-top:10px;
    }

    .welfare-page[b-hi4z6ifdoq]  .welfare-container {
        padding-inline:10px !important;
    }

    .welfare-hero[b-hi4z6ifdoq] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-hi4z6ifdoq],
    .list-toolbar[b-hi4z6ifdoq],
    .source-summary-heading[b-hi4z6ifdoq],
    .calculation-heading[b-hi4z6ifdoq],
    .view-toolbar[b-hi4z6ifdoq],
    .section-heading[b-hi4z6ifdoq] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-hi4z6ifdoq],
    .variance-grid[b-hi4z6ifdoq],
    .progress-metrics[b-hi4z6ifdoq],
    .source-summary-grid[b-hi4z6ifdoq],
    .system-amount-grid[b-hi4z6ifdoq],
    .calculation-grid[b-hi4z6ifdoq],
    .photo-upload-grid[b-hi4z6ifdoq],
    .transaction-summary-grid[b-hi4z6ifdoq],
    .review-grid[b-hi4z6ifdoq],
    .review-note-grid[b-hi4z6ifdoq],
    .attachment-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-hi4z6ifdoq] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-hi4z6ifdoq] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-hi4z6ifdoq] {
        width:100%;
    }

    .print-welfare-application[b-hi4z6ifdoq] {
        padding:22px 18px;
    }

    .document-footer[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-hi4z6ifdoq] {
        grid-column:auto;
    }

    .status-overview[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-hi4z6ifdoq] {
        width:100%;
    }

    .document-header[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-hi4z6ifdoq] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-hi4z6ifdoq] {
        visibility:hidden !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-hi4z6ifdoq] {
        display:none !important;
    }

    .modal-backdrop[b-hi4z6ifdoq],
    .application-view-modal[b-hi4z6ifdoq],
    .view-scroll[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .scope-panel[b-hi4z6ifdoq],
    .amount-comparison-section[b-hi4z6ifdoq],
    .transaction-summary-section[b-hi4z6ifdoq],
    .source-transaction-section[b-hi4z6ifdoq],
    .review-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }

    .mock-document-label[b-hi4z6ifdoq] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.welfare-hero[b-hi4z6ifdoq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-hi4z6ifdoq] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.welfare-page[b-hi4z6ifdoq]  .hero-add-button,
.welfare-page[b-hi4z6ifdoq]  .toolbar-add-button,
.welfare-page[b-hi4z6ifdoq]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-hi4z6ifdoq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-hi4z6ifdoq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-hi4z6ifdoq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-hi4z6ifdoq] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.confirmed > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.checked-in > span[b-hi4z6ifdoq] { background:#73569b; }
.status-overview-card.in-service > span[b-hi4z6ifdoq] { background:#c46a2b; }
.status-overview-card.completed > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.cancelled > span[b-hi4z6ifdoq] { background:#b54d43; }

.service-overview[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-hi4z6ifdoq],
.service-overview-card.selected[b-hi4z6ifdoq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-hi4z6ifdoq] {
    background:#f4faf7;
}

.service-overview-card > span[b-hi4z6ifdoq] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-hi4z6ifdoq] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-hi4z6ifdoq] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-hi4z6ifdoq] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-hi4z6ifdoq] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-hi4z6ifdoq],
.service-unit-cell[b-hi4z6ifdoq],
.provider-location-cell[b-hi4z6ifdoq],
.queue-priority-cell[b-hi4z6ifdoq],
.reason-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-hi4z6ifdoq],
.reason-cell[b-hi4z6ifdoq] {
    min-width:180px;
}

.appointment-time-cell strong[b-hi4z6ifdoq],
.service-unit-cell strong[b-hi4z6ifdoq],
.provider-location-cell strong[b-hi4z6ifdoq],
.queue-priority-cell strong[b-hi4z6ifdoq],
.reason-cell strong[b-hi4z6ifdoq] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-hi4z6ifdoq],
.service-unit-cell small[b-hi4z6ifdoq],
.provider-location-cell small[b-hi4z6ifdoq],
.queue-priority-cell small[b-hi4z6ifdoq],
.reason-cell small[b-hi4z6ifdoq],
.status-cell small[b-hi4z6ifdoq] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-hi4z6ifdoq],
.provider-location-cell em[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-hi4z6ifdoq],
.priority-chip[b-hi4z6ifdoq],
.status-chip[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-hi4z6ifdoq] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }

.priority-chip[b-hi4z6ifdoq] {
    margin-top:5px;
}

.priority-chip.normal[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-hi4z6ifdoq] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-hi4z6ifdoq] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-hi4z6ifdoq] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-hi4z6ifdoq],
.identity-chip.not-found[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-hi4z6ifdoq] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-hi4z6ifdoq] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-hi4z6ifdoq],
.citizen-source-actions a[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-hi4z6ifdoq] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-hi4z6ifdoq] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-hi4z6ifdoq] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-hi4z6ifdoq] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-hi4z6ifdoq] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-hi4z6ifdoq] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-hi4z6ifdoq] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-hi4z6ifdoq] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-hi4z6ifdoq] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-hi4z6ifdoq] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-hi4z6ifdoq] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-hi4z6ifdoq] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-hi4z6ifdoq],
.identity-box small[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-hi4z6ifdoq] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-hi4z6ifdoq],
.reason-section[b-hi4z6ifdoq],
.reminder-section[b-hi4z6ifdoq] {
    margin-top:16px;
}

.reference-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-hi4z6ifdoq] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-hi4z6ifdoq],
.timeline-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-hi4z6ifdoq],
.timeline-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-hi4z6ifdoq] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-hi4z6ifdoq] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-hi4z6ifdoq] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-hi4z6ifdoq],
    .preview-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-hi4z6ifdoq] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-hi4z6ifdoq] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-hi4z6ifdoq] {
        grid-column:1 / -1;
    }

    .reference-grid[b-hi4z6ifdoq],
    .timeline-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-hi4z6ifdoq],
    .focus-grid[b-hi4z6ifdoq],
    .citizen-source-grid[b-hi4z6ifdoq],
    .preview-grid[b-hi4z6ifdoq],
    .consent-grid[b-hi4z6ifdoq],
    .source-photo-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq],
    .note-grid[b-hi4z6ifdoq],
    .timeline-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-hi4z6ifdoq] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-hi4z6ifdoq] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-hi4z6ifdoq] {
        margin:0 auto;
    }
}

@media print {
    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .application-view-modal[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .patient-panel[b-hi4z6ifdoq],
    .service-section[b-hi4z6ifdoq],
    .reason-section[b-hi4z6ifdoq],
    .reminder-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.welfare-page[b-hi4z6ifdoq] {
    font-size: 16px;
    line-height: 1.55;
}

.welfare-page[b-hi4z6ifdoq]  .mud-typography,
.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-input-label,
.welfare-page[b-hi4z6ifdoq]  .mud-select,
.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text,
.welfare-page[b-hi4z6ifdoq]  .mud-button-label,
.welfare-page[b-hi4z6ifdoq]  .mud-table-cell,
.welfare-page[b-hi4z6ifdoq]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-select-input {
    font-size: .92rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text {
    font-size: .90rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-hi4z6ifdoq] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-hi4z6ifdoq] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-hi4z6ifdoq] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-hi4z6ifdoq] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-hi4z6ifdoq] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-hi4z6ifdoq] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-hi4z6ifdoq] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-hi4z6ifdoq] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-hi4z6ifdoq],
.application-list-panel[b-hi4z6ifdoq],
.insight-panel[b-hi4z6ifdoq] {
    border-radius: 20px;
}

.filter-panel[b-hi4z6ifdoq] {
    padding: 20px;
}

.list-toolbar[b-hi4z6ifdoq] {
    padding: 19px 20px;
}

.filter-heading p[b-hi4z6ifdoq],
.list-toolbar p[b-hi4z6ifdoq] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-hi4z6ifdoq] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-hi4z6ifdoq] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-hi4z6ifdoq],
.service-unit-cell[b-hi4z6ifdoq],
.provider-location-cell[b-hi4z6ifdoq],
.queue-priority-cell[b-hi4z6ifdoq],
.reason-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    min-width: 155px;
}

.provider-location-cell[b-hi4z6ifdoq],
.reason-cell[b-hi4z6ifdoq] {
    min-width: 215px;
}

.service-chip[b-hi4z6ifdoq],
.priority-chip[b-hi4z6ifdoq],
.status-chip[b-hi4z6ifdoq],
.identity-chip[b-hi4z6ifdoq] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-hi4z6ifdoq] {
    min-width: 205px;
    gap: 7px;
}

.welfare-page[b-hi4z6ifdoq]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-hi4z6ifdoq] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-hi4z6ifdoq],
.view-toolbar[b-hi4z6ifdoq],
.image-preview-header[b-hi4z6ifdoq] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-hi4z6ifdoq],
.view-scroll[b-hi4z6ifdoq] {
    padding: 20px;
}

.modal-footer[b-hi4z6ifdoq] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-hi4z6ifdoq] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-hi4z6ifdoq] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-hi4z6ifdoq],
.preview-grid > div[b-hi4z6ifdoq],
.reference-grid > div[b-hi4z6ifdoq],
.timeline-grid > div[b-hi4z6ifdoq] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-hi4z6ifdoq] {
    padding: 13px;
}

.photo-preview[b-hi4z6ifdoq] {
    min-height: 200px;
}

.photo-preview img[b-hi4z6ifdoq] {
    height: 200px;
}

.history-item[b-hi4z6ifdoq] {
    padding: 12px;
}

.attachment-card[b-hi4z6ifdoq],
.attachment-card img[b-hi4z6ifdoq] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .welfare-page[b-hi4z6ifdoq] {
        font-size: 15px;
    }

    .welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-hi4z6ifdoq] {
        min-height: 122px;
    }

    .status-overview-card[b-hi4z6ifdoq],
    .service-overview-card[b-hi4z6ifdoq] {
        min-height: 82px;
    }

    .modal-body[b-hi4z6ifdoq],
    .view-scroll[b-hi4z6ifdoq] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #welfare-application-print-area[b-hi4z6ifdoq] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #welfare-application-print-area h1[b-hi4z6ifdoq] {
        font-size: 18pt !important;
    }

    #welfare-application-print-area h2[b-hi4z6ifdoq] {
        font-size: 14pt !important;
    }

    #welfare-application-print-area h3[b-hi4z6ifdoq] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.welfare-hero[b-hi4z6ifdoq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-hi4z6ifdoq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-hi4z6ifdoq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-hi4z6ifdoq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-hi4z6ifdoq] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.follow-up > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.referred > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.cancelled > span[b-hi4z6ifdoq] { background:#b54d43; }
.status-overview-card.month > span[b-hi4z6ifdoq] { background:#73569b; }

.service-overview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-hi4z6ifdoq] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-hi4z6ifdoq] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-hi4z6ifdoq] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-hi4z6ifdoq] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-hi4z6ifdoq],
.service-unit-cell[b-hi4z6ifdoq],
.provider-location-cell[b-hi4z6ifdoq],
.result-cell[b-hi4z6ifdoq],
.follow-score-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-hi4z6ifdoq],
.result-cell[b-hi4z6ifdoq] {
    min-width:230px;
}

.history-date-cell strong[b-hi4z6ifdoq],
.service-unit-cell strong[b-hi4z6ifdoq],
.provider-location-cell strong[b-hi4z6ifdoq],
.result-cell strong[b-hi4z6ifdoq],
.follow-score-cell strong[b-hi4z6ifdoq] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-hi4z6ifdoq],
.service-unit-cell small[b-hi4z6ifdoq],
.provider-location-cell small[b-hi4z6ifdoq],
.result-cell small[b-hi4z6ifdoq],
.follow-score-cell small[b-hi4z6ifdoq],
.status-cell small[b-hi4z6ifdoq] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-hi4z6ifdoq],
.provider-location-cell em[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-hi4z6ifdoq] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-hi4z6ifdoq] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-hi4z6ifdoq] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-hi4z6ifdoq] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-hi4z6ifdoq] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-hi4z6ifdoq] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-hi4z6ifdoq],
.source-actions button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-hi4z6ifdoq] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-hi4z6ifdoq] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-hi4z6ifdoq] {
    min-height:180px;
}

.source-photo-card img[b-hi4z6ifdoq] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-hi4z6ifdoq] {
    margin-top:18px;
}

.vital-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-hi4z6ifdoq],
.quality-grid > div[b-hi4z6ifdoq],
.follow-up-grid > div[b-hi4z6ifdoq] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-hi4z6ifdoq],
.quality-grid span[b-hi4z6ifdoq],
.follow-up-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-hi4z6ifdoq],
.quality-grid strong[b-hi4z6ifdoq],
.follow-up-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-hi4z6ifdoq] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-hi4z6ifdoq],
.quality-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-select-input {
    font-size:.94rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text {
    font-size:.92rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-hi4z6ifdoq] { background:rgba(104,120,114,.89); }

.view-source-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-hi4z6ifdoq],
    .service-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-hi4z6ifdoq],
    .vital-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-hi4z6ifdoq] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-hi4z6ifdoq],
    .quality-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-hi4z6ifdoq],
    .service-overview[b-hi4z6ifdoq],
    .care-metrics[b-hi4z6ifdoq],
    .source-data-grid[b-hi4z6ifdoq],
    .source-photo-grid[b-hi4z6ifdoq],
    .vital-grid[b-hi4z6ifdoq],
    .follow-up-grid[b-hi4z6ifdoq],
    .quality-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .application-view-modal[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .patient-panel[b-hi4z6ifdoq],
    .document-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.welfare-hero[b-hi4z6ifdoq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-hi4z6ifdoq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-hi4z6ifdoq] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-hi4z6ifdoq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-hi4z6ifdoq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.follow-up > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.referred > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.overdue > span[b-hi4z6ifdoq] { background:#b54d43; }
.status-overview-card.inactive > span[b-hi4z6ifdoq] { background:#687872; }

.risk-overview[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-hi4z6ifdoq],
.risk-overview-card.selected[b-hi4z6ifdoq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-hi4z6ifdoq] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-hi4z6ifdoq] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-hi4z6ifdoq] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-hi4z6ifdoq],
.care-metrics strong[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-hi4z6ifdoq],
.care-metrics small[b-hi4z6ifdoq] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-hi4z6ifdoq] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-hi4z6ifdoq],
.risk-adl-cell[b-hi4z6ifdoq],
.dependency-living-cell[b-hi4z6ifdoq],
.caregiver-cell[b-hi4z6ifdoq],
.follow-up-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-hi4z6ifdoq] {
    min-width:190px;
}

.register-age-cell strong[b-hi4z6ifdoq],
.risk-adl-cell strong[b-hi4z6ifdoq],
.dependency-living-cell strong[b-hi4z6ifdoq],
.caregiver-cell strong[b-hi4z6ifdoq],
.follow-up-cell strong[b-hi4z6ifdoq] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-hi4z6ifdoq],
.risk-adl-cell small[b-hi4z6ifdoq],
.dependency-living-cell small[b-hi4z6ifdoq],
.caregiver-cell small[b-hi4z6ifdoq],
.follow-up-cell small[b-hi4z6ifdoq],
.status-cell small[b-hi4z6ifdoq] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-hi4z6ifdoq],
.caregiver-cell em[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-hi4z6ifdoq],
.dependency-chip[b-hi4z6ifdoq],
.status-chip[b-hi4z6ifdoq],
.identity-chip[b-hi4z6ifdoq],
.overdue-chip[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.risk-chip.high[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.active[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }

.overdue-chip[b-hi4z6ifdoq] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-hi4z6ifdoq] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-hi4z6ifdoq] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-hi4z6ifdoq] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-hi4z6ifdoq] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-hi4z6ifdoq] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-hi4z6ifdoq] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-hi4z6ifdoq],
.source-actions button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-hi4z6ifdoq] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-hi4z6ifdoq] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-hi4z6ifdoq],
.reference-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-hi4z6ifdoq],
.reference-grid > div[b-hi4z6ifdoq],
.care-plan-grid > div[b-hi4z6ifdoq] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-hi4z6ifdoq],
.reference-grid span[b-hi4z6ifdoq],
.care-plan-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-hi4z6ifdoq],
.reference-grid strong[b-hi4z6ifdoq],
.care-plan-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-hi4z6ifdoq] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-select-input {
    font-size:.96rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text {
    font-size:.94rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-hi4z6ifdoq],
    .assessment-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-hi4z6ifdoq],
    .risk-overview[b-hi4z6ifdoq],
    .dependency-grid[b-hi4z6ifdoq],
    .care-metrics[b-hi4z6ifdoq],
    .source-data-grid[b-hi4z6ifdoq],
    .assessment-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq],
    .care-plan-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .application-view-modal[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .patient-panel[b-hi4z6ifdoq],
    .document-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.welfare-page[b-hi4z6ifdoq] {
    font-size:16.5px;
    line-height:1.62;
}

.welfare-hero[b-hi4z6ifdoq] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-hi4z6ifdoq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-hi4z6ifdoq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-hi4z6ifdoq] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-hi4z6ifdoq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-hi4z6ifdoq] { background:#73569b; }
.status-overview-card.field > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.completed > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.follow-up > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.referred > span[b-hi4z6ifdoq] { background:#b55b82; }

.visit-type-overview[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-hi4z6ifdoq],
.visit-type-overview-card.selected[b-hi4z6ifdoq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-hi4z6ifdoq] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-hi4z6ifdoq] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-hi4z6ifdoq] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-hi4z6ifdoq] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-hi4z6ifdoq] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-hi4z6ifdoq] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-hi4z6ifdoq] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-hi4z6ifdoq] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-hi4z6ifdoq] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-hi4z6ifdoq],
.care-metrics strong[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-hi4z6ifdoq],
.care-metrics small[b-hi4z6ifdoq] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-hi4z6ifdoq],
.visit-type-cell[b-hi4z6ifdoq],
.team-location-cell[b-hi4z6ifdoq],
.result-cell[b-hi4z6ifdoq],
.follow-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-hi4z6ifdoq],
.result-cell[b-hi4z6ifdoq] {
    min-width:230px;
}

.visit-date-cell strong[b-hi4z6ifdoq],
.visit-type-cell strong[b-hi4z6ifdoq],
.team-location-cell strong[b-hi4z6ifdoq],
.result-cell strong[b-hi4z6ifdoq],
.follow-cell strong[b-hi4z6ifdoq] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-hi4z6ifdoq],
.visit-type-cell small[b-hi4z6ifdoq],
.team-location-cell small[b-hi4z6ifdoq],
.result-cell small[b-hi4z6ifdoq],
.follow-cell small[b-hi4z6ifdoq],
.status-cell small[b-hi4z6ifdoq] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-hi4z6ifdoq],
.team-location-cell em[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-hi4z6ifdoq],
.status-chip[b-hi4z6ifdoq],
.identity-chip[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.referred[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.priority-text[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-hi4z6ifdoq] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-hi4z6ifdoq] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-hi4z6ifdoq] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-hi4z6ifdoq] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-hi4z6ifdoq] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-hi4z6ifdoq] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-hi4z6ifdoq] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-hi4z6ifdoq] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-hi4z6ifdoq] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-hi4z6ifdoq] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-hi4z6ifdoq] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-hi4z6ifdoq] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-hi4z6ifdoq] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-hi4z6ifdoq],
.reference-grid > div[b-hi4z6ifdoq] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-hi4z6ifdoq],
.reference-grid span[b-hi4z6ifdoq] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-hi4z6ifdoq],
.reference-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-select-input {
    font-size:1rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text {
    font-size:.98rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-hi4z6ifdoq],
    .visit-type-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-hi4z6ifdoq],
    .visit-type-overview[b-hi4z6ifdoq],
    .target-grid[b-hi4z6ifdoq],
    .care-metrics[b-hi4z6ifdoq],
    .source-data-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq],
    .vital-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .application-view-modal[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .patient-panel[b-hi4z6ifdoq],
    .document-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.welfare-page[b-hi4z6ifdoq] {
    font-size:17px;
    line-height:1.65;
}

.welfare-hero[b-hi4z6ifdoq] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-hi4z6ifdoq] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-hi4z6ifdoq] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-hi4z6ifdoq] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-hi4z6ifdoq] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-hi4z6ifdoq] { background:#987634; }
.status-overview-card.review > span[b-hi4z6ifdoq] { background:#2f789f; }
.status-overview-card.eligible > span[b-hi4z6ifdoq] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-hi4z6ifdoq] { background:#34734b; }
.status-overview-card.paid > span[b-hi4z6ifdoq] { background:#73569b; }

.type-overview[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-hi4z6ifdoq],
.type-overview-card.selected[b-hi4z6ifdoq] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-hi4z6ifdoq] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-hi4z6ifdoq] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-hi4z6ifdoq] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-hi4z6ifdoq] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-hi4z6ifdoq] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-hi4z6ifdoq] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-hi4z6ifdoq] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-hi4z6ifdoq] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-hi4z6ifdoq],
.target-grid button[b-hi4z6ifdoq] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-hi4z6ifdoq] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-hi4z6ifdoq] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-hi4z6ifdoq],
.welfare-type-cell[b-hi4z6ifdoq],
.household-cell[b-hi4z6ifdoq],
.amount-cell[b-hi4z6ifdoq],
.officer-cell[b-hi4z6ifdoq],
.status-cell[b-hi4z6ifdoq] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-hi4z6ifdoq],
.officer-cell[b-hi4z6ifdoq] {
    min-width:210px;
}

.application-no-cell strong[b-hi4z6ifdoq],
.welfare-type-cell strong[b-hi4z6ifdoq],
.household-cell strong[b-hi4z6ifdoq],
.amount-cell strong[b-hi4z6ifdoq],
.officer-cell strong[b-hi4z6ifdoq] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-hi4z6ifdoq],
.welfare-type-cell small[b-hi4z6ifdoq],
.household-cell small[b-hi4z6ifdoq],
.amount-cell small[b-hi4z6ifdoq],
.officer-cell small[b-hi4z6ifdoq],
.status-cell small[b-hi4z6ifdoq] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-hi4z6ifdoq],
.household-cell em[b-hi4z6ifdoq],
.amount-cell em[b-hi4z6ifdoq],
.officer-cell em[b-hi4z6ifdoq],
.citizen-photo-cell em[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-hi4z6ifdoq],
.status-chip[b-hi4z6ifdoq],
.source-group-chip[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-hi4z6ifdoq] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-hi4z6ifdoq] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-hi4z6ifdoq] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-hi4z6ifdoq] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-hi4z6ifdoq] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-hi4z6ifdoq] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-hi4z6ifdoq] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-hi4z6ifdoq] { color:#687872; background:#edf1ef; }

.source-group-chip[b-hi4z6ifdoq] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-hi4z6ifdoq] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-hi4z6ifdoq] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-hi4z6ifdoq],
.amount-preview[b-hi4z6ifdoq] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-hi4z6ifdoq] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-hi4z6ifdoq],
.amount-preview > div[b-hi4z6ifdoq] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-hi4z6ifdoq],
.amount-preview small[b-hi4z6ifdoq] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-hi4z6ifdoq] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-hi4z6ifdoq],
.amount-preview strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-hi4z6ifdoq],
.amount-preview span[b-hi4z6ifdoq] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-hi4z6ifdoq] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-hi4z6ifdoq] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-hi4z6ifdoq],
.amount-document-grid small[b-hi4z6ifdoq] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-hi4z6ifdoq] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-hi4z6ifdoq] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-hi4z6ifdoq] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-hi4z6ifdoq] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input,
.welfare-page[b-hi4z6ifdoq]  .mud-select-input {
    font-size:1.02rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-list-item-text {
    font-size:1rem !important;
}

.welfare-page[b-hi4z6ifdoq]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-hi4z6ifdoq] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-hi4z6ifdoq] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-hi4z6ifdoq] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-hi4z6ifdoq] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-hi4z6ifdoq] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-hi4z6ifdoq] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-hi4z6ifdoq] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-hi4z6ifdoq],
    .type-overview[b-hi4z6ifdoq] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-hi4z6ifdoq],
    .amount-document-grid[b-hi4z6ifdoq] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-hi4z6ifdoq],
    .type-overview[b-hi4z6ifdoq],
    .budget-grid[b-hi4z6ifdoq],
    .target-grid[b-hi4z6ifdoq],
    .care-metrics[b-hi4z6ifdoq],
    .source-data-grid[b-hi4z6ifdoq],
    .reference-grid[b-hi4z6ifdoq],
    .assessment-preview[b-hi4z6ifdoq],
    .amount-preview[b-hi4z6ifdoq],
    .amount-document-grid[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-hi4z6ifdoq] {
        grid-template-columns:minmax(0,1fr);
    }

    .welfare-page[b-hi4z6ifdoq]  .application-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #welfare-application-print-area[b-hi4z6ifdoq],
    #welfare-application-print-area *[b-hi4z6ifdoq] {
        visibility:visible !important;
    }

    #welfare-application-print-area[b-hi4z6ifdoq] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .application-view-modal[b-hi4z6ifdoq] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-hi4z6ifdoq],
    .document-status-strip[b-hi4z6ifdoq],
    .patient-panel[b-hi4z6ifdoq],
    .document-section[b-hi4z6ifdoq],
    .document-footer[b-hi4z6ifdoq] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/04Welfare/WelfareBeneficiaries.razor.rz.scp.css */
:root[b-nywnafej5k] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.beneficiary-page[b-nywnafej5k] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.beneficiary-hero[b-nywnafej5k] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-nywnafej5k] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-nywnafej5k] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-nywnafej5k],
.hero-action-panel[b-nywnafej5k] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-nywnafej5k] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-nywnafej5k] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-nywnafej5k] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-nywnafej5k] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-nywnafej5k] {
    margin-top: 3px;
    font-size: .94rem;
}

.beneficiary-hero h1[b-nywnafej5k] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.beneficiary-hero p[b-nywnafej5k] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-nywnafej5k] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-nywnafej5k] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-nywnafej5k] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-nywnafej5k] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-nywnafej5k] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-nywnafej5k] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-nywnafej5k] {
    font-size: .85rem;
}

.hero-status small[b-nywnafej5k] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.beneficiary-page[b-nywnafej5k]  .hero-add-button,
.beneficiary-page[b-nywnafej5k]  .toolbar-add-button,
.beneficiary-page[b-nywnafej5k]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.beneficiary-page[b-nywnafej5k]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-nywnafej5k],
.hero-refresh-button[b-nywnafej5k] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-nywnafej5k] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-nywnafej5k] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-nywnafej5k] {
    opacity: .55;
    cursor: wait;
}

.beneficiary-page[b-nywnafej5k]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.beneficiary-page[b-nywnafej5k]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-nywnafej5k] {
    margin-top: 2px !important;
}

.summary-card[b-nywnafej5k] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-nywnafej5k] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-nywnafej5k] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-nywnafej5k] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-nywnafej5k] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-nywnafej5k] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-nywnafej5k] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-nywnafej5k] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-nywnafej5k] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-nywnafej5k] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-nywnafej5k] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-nywnafej5k] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-nywnafej5k] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-nywnafej5k] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-nywnafej5k] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-nywnafej5k],
.status-overview-card.selected[b-nywnafej5k] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-nywnafej5k] {
    background: #f5faf7;
}

.status-overview-card > span[b-nywnafej5k] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-nywnafej5k] { background:#687872; }
.status-overview-card.reviewing > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.difference > span[b-nywnafej5k] { background:#b54d43; }
.status-overview-card.approved > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.closed > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.voided > span[b-nywnafej5k] { background:#687872; }
.status-overview-card.today > span[b-nywnafej5k] { background:#73569b; }

.status-overview-card div[b-nywnafej5k] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-nywnafej5k] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-nywnafej5k] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-nywnafej5k] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-nywnafej5k] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-nywnafej5k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-nywnafej5k] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-nywnafej5k] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-nywnafej5k] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-nywnafej5k] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-nywnafej5k] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-nywnafej5k] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-nywnafej5k] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-nywnafej5k] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-nywnafej5k] {
    margin-top: 13px;
}

.progress-track[b-nywnafej5k] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-nywnafej5k] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-nywnafej5k] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-nywnafej5k] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-nywnafej5k] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-nywnafej5k] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-nywnafej5k],
.beneficiary-list-panel[b-nywnafej5k] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-nywnafej5k] {
    padding: 15px;
}

.filter-heading[b-nywnafej5k],
.list-toolbar[b-nywnafej5k] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-nywnafej5k],
.panel-kicker[b-nywnafej5k] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-nywnafej5k],
.list-toolbar h2[b-nywnafej5k] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-nywnafej5k],
.list-toolbar p[b-nywnafej5k] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-nywnafej5k] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-nywnafej5k] {
    margin-top: 8px !important;
}

.beneficiary-page[b-nywnafej5k]  .premium-field,
.beneficiary-page[b-nywnafej5k]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.beneficiary-page[b-nywnafej5k]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-nywnafej5k] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-nywnafej5k] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-nywnafej5k] {
    color: var(--theme-primary);
}

.beneficiary-list-panel[b-nywnafej5k] {
    overflow: hidden;
}

.list-toolbar[b-nywnafej5k] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.beneficiary-page[b-nywnafej5k]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-nywnafej5k] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-nywnafej5k] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-nywnafej5k] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-nywnafej5k] {
    margin: 0;
    font-size: .84rem;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table {
    font-family: 'Kanit',sans-serif;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head {
    background: #f1f7f4;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-nywnafej5k] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-nywnafej5k] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-nywnafej5k] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-nywnafej5k] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-nywnafej5k] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-nywnafej5k] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-nywnafej5k],
.counter-cashier-cell[b-nywnafej5k],
.money-cell[b-nywnafej5k],
.difference-cell[b-nywnafej5k],
.transaction-status-cell[b-nywnafej5k] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-nywnafej5k] {
    min-width: 175px;
}

.date-shift-cell strong[b-nywnafej5k],
.counter-cashier-cell strong[b-nywnafej5k],
.money-cell strong[b-nywnafej5k],
.difference-cell strong[b-nywnafej5k],
.transaction-status-cell strong[b-nywnafej5k] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-nywnafej5k],
.counter-cashier-cell small[b-nywnafej5k],
.money-cell small[b-nywnafej5k],
.difference-cell small[b-nywnafej5k] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-nywnafej5k],
.counter-cashier-cell em[b-nywnafej5k] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-nywnafej5k] { color:var(--theme-primary); }
.money-cell.actual strong[b-nywnafej5k] { color:#2f789f; }

.difference-cell.matched strong[b-nywnafej5k] { color:#34734b; }
.difference-cell.over strong[b-nywnafej5k] { color:#987634; }
.difference-cell.short strong[b-nywnafej5k] { color:#b54d43; }

.status-chip[b-nywnafej5k],
.match-chip[b-nywnafej5k] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-nywnafej5k] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.difference[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-nywnafej5k] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-nywnafej5k] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.beneficiary-page[b-nywnafej5k]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.beneficiary-page[b-nywnafej5k]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.beneficiary-page[b-nywnafej5k]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.beneficiary-page[b-nywnafej5k]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.beneficiary-page[b-nywnafej5k]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-nywnafej5k] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-nywnafej5k] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-nywnafej5k],
.image-preview-backdrop[b-nywnafej5k] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.beneficiary-form-modal[b-nywnafej5k],
.beneficiary-view-modal[b-nywnafej5k],
.delete-modal[b-nywnafej5k],
.image-preview-modal[b-nywnafej5k] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-nywnafej5k],
.view-toolbar[b-nywnafej5k],
.image-preview-header[b-nywnafej5k] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-nywnafej5k] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-nywnafej5k] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-nywnafej5k],
.view-toolbar small[b-nywnafej5k],
.image-preview-header small[b-nywnafej5k] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-nywnafej5k],
.view-toolbar h2[b-nywnafej5k],
.image-preview-header h3[b-nywnafej5k] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-nywnafej5k] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-nywnafej5k],
.view-scroll[b-nywnafej5k] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-nywnafej5k] {
    background: #e9efec;
}

.modal-footer[b-nywnafej5k] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.beneficiary-page[b-nywnafej5k]  .cancel-button,
.beneficiary-page[b-nywnafej5k]  .save-button,
.beneficiary-page[b-nywnafej5k]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-nywnafej5k] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-nywnafej5k] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-nywnafej5k] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-nywnafej5k] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-nywnafej5k] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-nywnafej5k] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-nywnafej5k],
.calculation-heading[b-nywnafej5k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-nywnafej5k],
.calculation-heading small[b-nywnafej5k] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-nywnafej5k],
.calculation-heading h3[b-nywnafej5k] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-nywnafej5k],
.calculation-heading > span[b-nywnafej5k] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-nywnafej5k] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-nywnafej5k] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-nywnafej5k] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-nywnafej5k] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-nywnafej5k] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-nywnafej5k] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-nywnafej5k] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-nywnafej5k] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-nywnafej5k] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-nywnafej5k] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-nywnafej5k] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-nywnafej5k] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-nywnafej5k] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-nywnafej5k] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-nywnafej5k] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-nywnafej5k],
.calculation-grid .short strong[b-nywnafej5k],
.calculation-grid .short small[b-nywnafej5k] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-nywnafej5k] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-nywnafej5k] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-nywnafej5k] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-nywnafej5k] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-nywnafej5k] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-nywnafej5k] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-nywnafej5k] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-nywnafej5k] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-nywnafej5k] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-nywnafej5k] {
    font-size:.84rem;
}

.photo-upload-actions[b-nywnafej5k] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-nywnafej5k],
.remove-photo-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-nywnafej5k] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-nywnafej5k] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-nywnafej5k] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-nywnafej5k],
.detail-transaction-table[b-nywnafej5k] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-nywnafej5k],
.source-transaction-row[b-nywnafej5k] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-nywnafej5k] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-nywnafej5k],
.source-transaction-row > span[b-nywnafej5k] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-nywnafej5k] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-nywnafej5k] {
    border-bottom:0;
}

.mini-photo-button[b-nywnafej5k] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-nywnafej5k],
.source-transaction-more[b-nywnafej5k] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-nywnafej5k] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.beneficiary-view-modal[b-nywnafej5k] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-nywnafej5k] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.beneficiary-page[b-nywnafej5k]  .view-edit-button,
.beneficiary-page[b-nywnafej5k]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.beneficiary-page[b-nywnafej5k]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-beneficiary-profile[b-nywnafej5k] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-nywnafej5k] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-nywnafej5k] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-nywnafej5k] {
    text-align:center;
}

.document-organization small[b-nywnafej5k] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-nywnafej5k] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-nywnafej5k] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-nywnafej5k] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-nywnafej5k],
.document-number-box small[b-nywnafej5k] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-nywnafej5k] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-nywnafej5k] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-nywnafej5k] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-nywnafej5k] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-nywnafej5k] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-nywnafej5k] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-nywnafej5k] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-nywnafej5k],
.transaction-summary-section[b-nywnafej5k],
.source-transaction-section[b-nywnafej5k],
.review-section[b-nywnafej5k] {
    margin-top:16px;
}

.section-title[b-nywnafej5k] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-nywnafej5k] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-nywnafej5k] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-nywnafej5k] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-nywnafej5k] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-nywnafej5k],
.comparison-row[b-nywnafej5k],
.comparison-total[b-nywnafej5k] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-nywnafej5k] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-nywnafej5k],
.comparison-row span[b-nywnafej5k],
.comparison-total span[b-nywnafej5k] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-nywnafej5k] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-nywnafej5k],
.comparison-total span:not(:first-child)[b-nywnafej5k] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-nywnafej5k] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-nywnafej5k] { color:#34734b; }
.difference-text.over[b-nywnafej5k] { color:#987634; }
.difference-text.short[b-nywnafej5k] { color:#b54d43; }

.transaction-summary-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-nywnafej5k] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-nywnafej5k] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-nywnafej5k] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-nywnafej5k] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-nywnafej5k] { background:#f4fafc; }

.transaction-summary-grid span[b-nywnafej5k] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-nywnafej5k] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-nywnafej5k],
.detail-transaction-row[b-nywnafej5k] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-nywnafej5k] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-nywnafej5k],
.detail-transaction-row span[b-nywnafej5k] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-nywnafej5k] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-nywnafej5k] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-nywnafej5k] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-nywnafej5k] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-nywnafej5k] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-nywnafej5k] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-nywnafej5k] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-nywnafej5k] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-nywnafej5k] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-nywnafej5k] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-nywnafej5k],
.attachment-panel[b-nywnafej5k] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-nywnafej5k] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-nywnafej5k] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-nywnafej5k] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-nywnafej5k] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-nywnafej5k] {
    display:grid;
    gap:7px;
}

.history-item[b-nywnafej5k] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-nywnafej5k] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-nywnafej5k] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-nywnafej5k] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-nywnafej5k],
.history-item em[b-nywnafej5k] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-nywnafej5k] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-nywnafej5k] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-nywnafej5k] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-nywnafej5k] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-nywnafej5k] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-nywnafej5k] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-nywnafej5k] { background:rgba(52,115,75,.89); }

.attachment-empty[b-nywnafej5k] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-nywnafej5k] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-nywnafej5k] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-nywnafej5k] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-nywnafej5k] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-nywnafej5k] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-nywnafej5k] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-nywnafej5k] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-nywnafej5k] {
    color:#b54d43;
}

.delete-warning[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-nywnafej5k] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.beneficiary-page[b-nywnafej5k]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-nywnafej5k] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-nywnafej5k] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .beneficiary-hero[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-nywnafej5k] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-nywnafej5k] {
        grid-column:1 / -1;
    }

    .document-header[b-nywnafej5k] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-nywnafej5k] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .beneficiary-page[b-nywnafej5k] {
        padding-top:10px;
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-container {
        padding-inline:10px !important;
    }

    .beneficiary-hero[b-nywnafej5k] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-nywnafej5k],
    .list-toolbar[b-nywnafej5k],
    .source-summary-heading[b-nywnafej5k],
    .calculation-heading[b-nywnafej5k],
    .view-toolbar[b-nywnafej5k],
    .section-heading[b-nywnafej5k] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-nywnafej5k],
    .variance-grid[b-nywnafej5k],
    .progress-metrics[b-nywnafej5k],
    .source-summary-grid[b-nywnafej5k],
    .system-amount-grid[b-nywnafej5k],
    .calculation-grid[b-nywnafej5k],
    .photo-upload-grid[b-nywnafej5k],
    .transaction-summary-grid[b-nywnafej5k],
    .review-grid[b-nywnafej5k],
    .review-note-grid[b-nywnafej5k],
    .attachment-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-nywnafej5k] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-nywnafej5k] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-nywnafej5k] {
        width:100%;
    }

    .print-beneficiary-profile[b-nywnafej5k] {
        padding:22px 18px;
    }

    .document-footer[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-nywnafej5k] {
        grid-column:auto;
    }

    .status-overview[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-nywnafej5k] {
        width:100%;
    }

    .document-header[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-nywnafej5k] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-nywnafej5k] {
        visibility:hidden !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-nywnafej5k] {
        display:none !important;
    }

    .modal-backdrop[b-nywnafej5k],
    .beneficiary-view-modal[b-nywnafej5k],
    .view-scroll[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .scope-panel[b-nywnafej5k],
    .amount-comparison-section[b-nywnafej5k],
    .transaction-summary-section[b-nywnafej5k],
    .source-transaction-section[b-nywnafej5k],
    .review-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }

    .mock-document-label[b-nywnafej5k] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-nywnafej5k] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.beneficiary-page[b-nywnafej5k]  .hero-add-button,
.beneficiary-page[b-nywnafej5k]  .toolbar-add-button,
.beneficiary-page[b-nywnafej5k]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-nywnafej5k] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.confirmed > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.checked-in > span[b-nywnafej5k] { background:#73569b; }
.status-overview-card.in-service > span[b-nywnafej5k] { background:#c46a2b; }
.status-overview-card.completed > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.cancelled > span[b-nywnafej5k] { background:#b54d43; }

.service-overview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-nywnafej5k],
.service-overview-card.selected[b-nywnafej5k] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-nywnafej5k] {
    background:#f4faf7;
}

.service-overview-card > span[b-nywnafej5k] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-nywnafej5k] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-nywnafej5k] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-nywnafej5k] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-nywnafej5k] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-nywnafej5k] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-nywnafej5k] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-nywnafej5k] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-nywnafej5k] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-nywnafej5k],
.service-unit-cell[b-nywnafej5k],
.provider-location-cell[b-nywnafej5k],
.queue-priority-cell[b-nywnafej5k],
.reason-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-nywnafej5k],
.reason-cell[b-nywnafej5k] {
    min-width:180px;
}

.appointment-time-cell strong[b-nywnafej5k],
.service-unit-cell strong[b-nywnafej5k],
.provider-location-cell strong[b-nywnafej5k],
.queue-priority-cell strong[b-nywnafej5k],
.reason-cell strong[b-nywnafej5k] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-nywnafej5k],
.service-unit-cell small[b-nywnafej5k],
.provider-location-cell small[b-nywnafej5k],
.queue-priority-cell small[b-nywnafej5k],
.reason-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-nywnafej5k],
.provider-location-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-nywnafej5k],
.priority-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-nywnafej5k] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-nywnafej5k] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-nywnafej5k] { color:#987634; background:#fff4df; }

.priority-chip[b-nywnafej5k] {
    margin-top:5px;
}

.priority-chip.normal[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-nywnafej5k] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-nywnafej5k] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-nywnafej5k] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-nywnafej5k] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-nywnafej5k] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-nywnafej5k] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-nywnafej5k] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-nywnafej5k] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-nywnafej5k],
.identity-chip.not-found[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-nywnafej5k] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-nywnafej5k] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-nywnafej5k],
.citizen-source-actions a[b-nywnafej5k] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-nywnafej5k] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-nywnafej5k] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-nywnafej5k] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-nywnafej5k] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-nywnafej5k] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-nywnafej5k] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-nywnafej5k] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-nywnafej5k] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-nywnafej5k] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-nywnafej5k] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-nywnafej5k] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-nywnafej5k] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-nywnafej5k] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-nywnafej5k] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-nywnafej5k],
.identity-box small[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-nywnafej5k] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-nywnafej5k],
.reason-section[b-nywnafej5k],
.reminder-section[b-nywnafej5k] {
    margin-top:16px;
}

.reference-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-nywnafej5k] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-nywnafej5k],
.timeline-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-nywnafej5k],
.timeline-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-nywnafej5k] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-nywnafej5k] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-nywnafej5k] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-nywnafej5k] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-nywnafej5k] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-nywnafej5k] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-nywnafej5k],
    .preview-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-nywnafej5k] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-nywnafej5k] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-nywnafej5k] {
        grid-column:1 / -1;
    }

    .reference-grid[b-nywnafej5k],
    .timeline-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-nywnafej5k],
    .focus-grid[b-nywnafej5k],
    .citizen-source-grid[b-nywnafej5k],
    .preview-grid[b-nywnafej5k],
    .consent-grid[b-nywnafej5k],
    .source-photo-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k],
    .note-grid[b-nywnafej5k],
    .timeline-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-nywnafej5k] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-nywnafej5k] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-nywnafej5k] {
        margin:0 auto;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .service-section[b-nywnafej5k],
    .reason-section[b-nywnafej5k],
    .reminder-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.beneficiary-page[b-nywnafej5k] {
    font-size: 16px;
    line-height: 1.55;
}

.beneficiary-page[b-nywnafej5k]  .mud-typography,
.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-input-label,
.beneficiary-page[b-nywnafej5k]  .mud-select,
.beneficiary-page[b-nywnafej5k]  .mud-list-item-text,
.beneficiary-page[b-nywnafej5k]  .mud-button-label,
.beneficiary-page[b-nywnafej5k]  .mud-table-cell,
.beneficiary-page[b-nywnafej5k]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size: .92rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size: .90rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-nywnafej5k] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-nywnafej5k] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-nywnafej5k] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-nywnafej5k] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-nywnafej5k] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-nywnafej5k] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-nywnafej5k] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-nywnafej5k] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-nywnafej5k],
.beneficiary-list-panel[b-nywnafej5k],
.insight-panel[b-nywnafej5k] {
    border-radius: 20px;
}

.filter-panel[b-nywnafej5k] {
    padding: 20px;
}

.list-toolbar[b-nywnafej5k] {
    padding: 19px 20px;
}

.filter-heading p[b-nywnafej5k],
.list-toolbar p[b-nywnafej5k] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-nywnafej5k] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-nywnafej5k] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-nywnafej5k],
.service-unit-cell[b-nywnafej5k],
.provider-location-cell[b-nywnafej5k],
.queue-priority-cell[b-nywnafej5k],
.reason-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    min-width: 155px;
}

.provider-location-cell[b-nywnafej5k],
.reason-cell[b-nywnafej5k] {
    min-width: 215px;
}

.service-chip[b-nywnafej5k],
.priority-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k],
.identity-chip[b-nywnafej5k] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-nywnafej5k] {
    min-width: 205px;
    gap: 7px;
}

.beneficiary-page[b-nywnafej5k]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-nywnafej5k] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-nywnafej5k],
.view-toolbar[b-nywnafej5k],
.image-preview-header[b-nywnafej5k] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-nywnafej5k],
.view-scroll[b-nywnafej5k] {
    padding: 20px;
}

.modal-footer[b-nywnafej5k] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-nywnafej5k] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-nywnafej5k] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-nywnafej5k],
.preview-grid > div[b-nywnafej5k],
.reference-grid > div[b-nywnafej5k],
.timeline-grid > div[b-nywnafej5k] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-nywnafej5k] {
    padding: 13px;
}

.photo-preview[b-nywnafej5k] {
    min-height: 200px;
}

.photo-preview img[b-nywnafej5k] {
    height: 200px;
}

.history-item[b-nywnafej5k] {
    padding: 12px;
}

.attachment-card[b-nywnafej5k],
.attachment-card img[b-nywnafej5k] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .beneficiary-page[b-nywnafej5k] {
        font-size: 15px;
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-nywnafej5k] {
        min-height: 122px;
    }

    .status-overview-card[b-nywnafej5k],
    .service-overview-card[b-nywnafej5k] {
        min-height: 82px;
    }

    .modal-body[b-nywnafej5k],
    .view-scroll[b-nywnafej5k] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #beneficiary-profile-print-area[b-nywnafej5k] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #beneficiary-profile-print-area h1[b-nywnafej5k] {
        font-size: 18pt !important;
    }

    #beneficiary-profile-print-area h2[b-nywnafej5k] {
        font-size: 14pt !important;
    }

    #beneficiary-profile-print-area h3[b-nywnafej5k] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-nywnafej5k] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.follow-up > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.referred > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.cancelled > span[b-nywnafej5k] { background:#b54d43; }
.status-overview-card.month > span[b-nywnafej5k] { background:#73569b; }

.service-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-nywnafej5k] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-nywnafej5k] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-nywnafej5k] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-nywnafej5k] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-nywnafej5k],
.service-unit-cell[b-nywnafej5k],
.provider-location-cell[b-nywnafej5k],
.result-cell[b-nywnafej5k],
.follow-score-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-nywnafej5k],
.result-cell[b-nywnafej5k] {
    min-width:230px;
}

.history-date-cell strong[b-nywnafej5k],
.service-unit-cell strong[b-nywnafej5k],
.provider-location-cell strong[b-nywnafej5k],
.result-cell strong[b-nywnafej5k],
.follow-score-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-nywnafej5k],
.service-unit-cell small[b-nywnafej5k],
.provider-location-cell small[b-nywnafej5k],
.result-cell small[b-nywnafej5k],
.follow-score-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-nywnafej5k],
.provider-location-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.referred[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-nywnafej5k] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-nywnafej5k] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-nywnafej5k] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-nywnafej5k] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-nywnafej5k] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-nywnafej5k] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-nywnafej5k] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-nywnafej5k] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-nywnafej5k],
.source-actions button[b-nywnafej5k] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-nywnafej5k] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-nywnafej5k] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-nywnafej5k] {
    min-height:180px;
}

.source-photo-card img[b-nywnafej5k] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-nywnafej5k] {
    margin-top:18px;
}

.vital-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-nywnafej5k],
.quality-grid > div[b-nywnafej5k],
.follow-up-grid > div[b-nywnafej5k] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-nywnafej5k],
.quality-grid span[b-nywnafej5k],
.follow-up-grid span[b-nywnafej5k] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-nywnafej5k],
.quality-grid strong[b-nywnafej5k],
.follow-up-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-nywnafej5k] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-nywnafej5k],
.quality-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size:.94rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size:.92rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-nywnafej5k] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-nywnafej5k] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-nywnafej5k] { background:rgba(104,120,114,.89); }

.view-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-nywnafej5k],
    .service-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-nywnafej5k],
    .vital-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-nywnafej5k] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-nywnafej5k],
    .quality-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-nywnafej5k],
    .service-overview[b-nywnafej5k],
    .care-metrics[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .source-photo-grid[b-nywnafej5k],
    .vital-grid[b-nywnafej5k],
    .follow-up-grid[b-nywnafej5k],
    .quality-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .document-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-nywnafej5k] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.follow-up > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.referred > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.overdue > span[b-nywnafej5k] { background:#b54d43; }
.status-overview-card.inactive > span[b-nywnafej5k] { background:#687872; }

.risk-overview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-nywnafej5k],
.risk-overview-card.selected[b-nywnafej5k] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-nywnafej5k] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-nywnafej5k] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-nywnafej5k] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-nywnafej5k] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-nywnafej5k],
.care-metrics strong[b-nywnafej5k] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-nywnafej5k],
.care-metrics small[b-nywnafej5k] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-nywnafej5k] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-nywnafej5k],
.risk-adl-cell[b-nywnafej5k],
.dependency-living-cell[b-nywnafej5k],
.caregiver-cell[b-nywnafej5k],
.follow-up-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-nywnafej5k] {
    min-width:190px;
}

.register-age-cell strong[b-nywnafej5k],
.risk-adl-cell strong[b-nywnafej5k],
.dependency-living-cell strong[b-nywnafej5k],
.caregiver-cell strong[b-nywnafej5k],
.follow-up-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-nywnafej5k],
.risk-adl-cell small[b-nywnafej5k],
.dependency-living-cell small[b-nywnafej5k],
.caregiver-cell small[b-nywnafej5k],
.follow-up-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-nywnafej5k],
.caregiver-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-nywnafej5k],
.dependency-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k],
.identity-chip[b-nywnafej5k],
.overdue-chip[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-nywnafej5k] { color:#987634; background:#fff4df; }
.risk-chip.high[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-nywnafej5k] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.active[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.referred[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.overdue-chip[b-nywnafej5k] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-nywnafej5k] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-nywnafej5k] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-nywnafej5k] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-nywnafej5k] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-nywnafej5k] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-nywnafej5k] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-nywnafej5k] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-nywnafej5k] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-nywnafej5k],
.source-actions button[b-nywnafej5k] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-nywnafej5k] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-nywnafej5k] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-nywnafej5k] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-nywnafej5k],
.reference-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-nywnafej5k],
.reference-grid > div[b-nywnafej5k],
.care-plan-grid > div[b-nywnafej5k] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-nywnafej5k],
.reference-grid span[b-nywnafej5k],
.care-plan-grid span[b-nywnafej5k] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-nywnafej5k],
.reference-grid strong[b-nywnafej5k],
.care-plan-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-nywnafej5k] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size:.96rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size:.94rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-nywnafej5k] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-nywnafej5k] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-nywnafej5k] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-nywnafej5k] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-nywnafej5k] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-nywnafej5k] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-nywnafej5k],
    .assessment-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-nywnafej5k],
    .risk-overview[b-nywnafej5k],
    .dependency-grid[b-nywnafej5k],
    .care-metrics[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .assessment-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k],
    .care-plan-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .document-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.beneficiary-page[b-nywnafej5k] {
    font-size:16.5px;
    line-height:1.62;
}

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-nywnafej5k] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-nywnafej5k] { background:#73569b; }
.status-overview-card.field > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.completed > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.follow-up > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.referred > span[b-nywnafej5k] { background:#b55b82; }

.visit-type-overview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-nywnafej5k],
.visit-type-overview-card.selected[b-nywnafej5k] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-nywnafej5k] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-nywnafej5k] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-nywnafej5k] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-nywnafej5k] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-nywnafej5k] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-nywnafej5k] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-nywnafej5k] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-nywnafej5k] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-nywnafej5k] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-nywnafej5k],
.care-metrics strong[b-nywnafej5k] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-nywnafej5k],
.care-metrics small[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-nywnafej5k],
.visit-type-cell[b-nywnafej5k],
.team-location-cell[b-nywnafej5k],
.result-cell[b-nywnafej5k],
.follow-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-nywnafej5k],
.result-cell[b-nywnafej5k] {
    min-width:230px;
}

.visit-date-cell strong[b-nywnafej5k],
.visit-type-cell strong[b-nywnafej5k],
.team-location-cell strong[b-nywnafej5k],
.result-cell strong[b-nywnafej5k],
.follow-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-nywnafej5k],
.visit-type-cell small[b-nywnafej5k],
.team-location-cell small[b-nywnafej5k],
.result-cell small[b-nywnafej5k],
.follow-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-nywnafej5k],
.team-location-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k],
.identity-chip[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-nywnafej5k] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.referred[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.priority-text[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-nywnafej5k] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-nywnafej5k] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-nywnafej5k] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-nywnafej5k] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-nywnafej5k] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-nywnafej5k] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-nywnafej5k] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-nywnafej5k] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-nywnafej5k] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-nywnafej5k] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-nywnafej5k] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-nywnafej5k] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-nywnafej5k] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-nywnafej5k] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-nywnafej5k] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-nywnafej5k] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-nywnafej5k] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-nywnafej5k] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-nywnafej5k],
.reference-grid > div[b-nywnafej5k] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-nywnafej5k],
.reference-grid span[b-nywnafej5k] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-nywnafej5k],
.reference-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size:1rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size:.98rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-nywnafej5k],
    .visit-type-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-nywnafej5k],
    .visit-type-overview[b-nywnafej5k],
    .target-grid[b-nywnafej5k],
    .care-metrics[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k],
    .vital-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .document-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.beneficiary-page[b-nywnafej5k] {
    font-size:17px;
    line-height:1.65;
}

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-nywnafej5k] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.review > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.eligible > span[b-nywnafej5k] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-nywnafej5k] { background:#34734b; }
.status-overview-card.paid > span[b-nywnafej5k] { background:#73569b; }

.type-overview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-nywnafej5k],
.type-overview-card.selected[b-nywnafej5k] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-nywnafej5k] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-nywnafej5k] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-nywnafej5k] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-nywnafej5k] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-nywnafej5k] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-nywnafej5k] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-nywnafej5k] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-nywnafej5k],
.target-grid button[b-nywnafej5k] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-nywnafej5k] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-nywnafej5k],
.welfare-type-cell[b-nywnafej5k],
.household-cell[b-nywnafej5k],
.amount-cell[b-nywnafej5k],
.officer-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-nywnafej5k],
.officer-cell[b-nywnafej5k] {
    min-width:210px;
}

.application-no-cell strong[b-nywnafej5k],
.welfare-type-cell strong[b-nywnafej5k],
.household-cell strong[b-nywnafej5k],
.amount-cell strong[b-nywnafej5k],
.officer-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-nywnafej5k],
.welfare-type-cell small[b-nywnafej5k],
.household-cell small[b-nywnafej5k],
.amount-cell small[b-nywnafej5k],
.officer-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-nywnafej5k],
.household-cell em[b-nywnafej5k],
.amount-cell em[b-nywnafej5k],
.officer-cell em[b-nywnafej5k],
.citizen-photo-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k],
.source-group-chip[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-nywnafej5k] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.source-group-chip[b-nywnafej5k] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-nywnafej5k] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-nywnafej5k],
.amount-preview[b-nywnafej5k] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-nywnafej5k] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-nywnafej5k] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-nywnafej5k],
.amount-preview > div[b-nywnafej5k] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-nywnafej5k],
.amount-preview small[b-nywnafej5k] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-nywnafej5k] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-nywnafej5k],
.amount-preview strong[b-nywnafej5k] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-nywnafej5k],
.amount-preview span[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-nywnafej5k] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-nywnafej5k],
.amount-document-grid small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-nywnafej5k] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-nywnafej5k] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-nywnafej5k] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-nywnafej5k] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size:1.02rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size:1rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-nywnafej5k] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-nywnafej5k],
    .type-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-nywnafej5k],
    .amount-document-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-nywnafej5k],
    .type-overview[b-nywnafej5k],
    .budget-grid[b-nywnafej5k],
    .target-grid[b-nywnafej5k],
    .care-metrics[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k],
    .assessment-preview[b-nywnafej5k],
    .amount-preview[b-nywnafej5k],
    .amount-document-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .document-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.beneficiary-page[b-nywnafej5k] {
    font-size:17px;
    line-height:1.66;
}

.beneficiary-hero[b-nywnafej5k] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-nywnafej5k] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-nywnafej5k] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-nywnafej5k] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-nywnafej5k] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-nywnafej5k] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-nywnafej5k] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-nywnafej5k] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-nywnafej5k] { background:#2f789f; }
.status-overview-card.payment > span[b-nywnafej5k] { background:#b54d43; }
.status-overview-card.suspended > span[b-nywnafej5k] { background:#987634; }
.status-overview-card.expiring > span[b-nywnafej5k] { background:#73569b; }

.target-overview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-nywnafej5k] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-nywnafej5k],
.target-overview-card.selected[b-nywnafej5k] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-nywnafej5k] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-nywnafej5k] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-nywnafej5k] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-nywnafej5k] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-nywnafej5k] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-nywnafej5k] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-nywnafej5k] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-nywnafej5k] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-nywnafej5k],
.follow-grid button[b-nywnafej5k] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-nywnafej5k] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-nywnafej5k] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-nywnafej5k] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-nywnafej5k] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-nywnafej5k] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-nywnafej5k],
.benefit-cell[b-nywnafej5k],
.period-cell[b-nywnafej5k],
.amount-cell[b-nywnafej5k],
.payment-cycle-cell[b-nywnafej5k],
.status-cell[b-nywnafej5k] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-nywnafej5k] {
    min-width:225px;
}

.registry-cell strong[b-nywnafej5k],
.benefit-cell strong[b-nywnafej5k],
.period-cell strong[b-nywnafej5k],
.amount-cell strong[b-nywnafej5k],
.payment-cycle-cell strong[b-nywnafej5k] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-nywnafej5k],
.benefit-cell small[b-nywnafej5k],
.period-cell small[b-nywnafej5k],
.amount-cell small[b-nywnafej5k],
.payment-cycle-cell small[b-nywnafej5k],
.status-cell small[b-nywnafej5k] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-nywnafej5k],
.period-cell em[b-nywnafej5k],
.amount-cell em[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-nywnafej5k],
.cycle-chip[b-nywnafej5k],
.verify-chip[b-nywnafej5k],
.status-chip[b-nywnafej5k],
.source-group-chip[b-nywnafej5k] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-nywnafej5k] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-nywnafej5k] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-nywnafej5k] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-nywnafej5k] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-nywnafej5k] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-nywnafej5k] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-nywnafej5k] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-nywnafej5k] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-nywnafej5k] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-nywnafej5k] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-nywnafej5k] { color:#987634; background:#fff4df; }
.status-chip.expired[b-nywnafej5k] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-nywnafej5k] { color:#687872; background:#edf1ef; }

.source-group-chip[b-nywnafej5k] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-nywnafej5k] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-nywnafej5k] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-nywnafej5k] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-nywnafej5k] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-nywnafej5k] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-nywnafej5k] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-nywnafej5k] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-nywnafej5k] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-nywnafej5k] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.beneficiary-page[b-nywnafej5k]  .mud-input,
.beneficiary-page[b-nywnafej5k]  .mud-select-input {
    font-size:1.02rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-list-item-text {
    font-size:1rem !important;
}

.beneficiary-page[b-nywnafej5k]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-nywnafej5k] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-nywnafej5k] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-nywnafej5k] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-nywnafej5k] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-nywnafej5k] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-nywnafej5k] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-nywnafej5k] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-nywnafej5k] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-nywnafej5k],
    .target-overview[b-nywnafej5k] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-nywnafej5k] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-nywnafej5k],
    .target-overview[b-nywnafej5k],
    .amount-metrics[b-nywnafej5k],
    .follow-grid[b-nywnafej5k],
    .condition-switch-grid[b-nywnafej5k],
    .amount-preview[b-nywnafej5k],
    .source-data-grid[b-nywnafej5k],
    .reference-grid[b-nywnafej5k],
    .amount-document-grid[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-nywnafej5k] {
        grid-template-columns:minmax(0,1fr);
    }

    .beneficiary-page[b-nywnafej5k]  .beneficiary-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #beneficiary-profile-print-area[b-nywnafej5k],
    #beneficiary-profile-print-area *[b-nywnafej5k] {
        visibility:visible !important;
    }

    #beneficiary-profile-print-area[b-nywnafej5k] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .beneficiary-view-modal[b-nywnafej5k] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-nywnafej5k],
    .document-status-strip[b-nywnafej5k],
    .patient-panel[b-nywnafej5k],
    .document-section[b-nywnafej5k],
    .document-footer[b-nywnafej5k] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/04Welfare/WelfareBenefits.razor.rz.scp.css */
:root[b-mqbxz5oty6] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.benefit-page[b-mqbxz5oty6] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.benefit-page[b-mqbxz5oty6]  .benefit-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.benefit-hero[b-mqbxz5oty6] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-mqbxz5oty6] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-mqbxz5oty6] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-mqbxz5oty6],
.hero-action-panel[b-mqbxz5oty6] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-mqbxz5oty6] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-mqbxz5oty6] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-mqbxz5oty6] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-mqbxz5oty6] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-mqbxz5oty6] {
    margin-top: 3px;
    font-size: .94rem;
}

.benefit-hero h1[b-mqbxz5oty6] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.benefit-hero p[b-mqbxz5oty6] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-mqbxz5oty6] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-mqbxz5oty6] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-mqbxz5oty6] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-mqbxz5oty6] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-mqbxz5oty6] {
    font-size: .85rem;
}

.hero-status small[b-mqbxz5oty6] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.benefit-page[b-mqbxz5oty6]  .hero-add-button,
.benefit-page[b-mqbxz5oty6]  .toolbar-add-button,
.benefit-page[b-mqbxz5oty6]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.benefit-page[b-mqbxz5oty6]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-mqbxz5oty6],
.hero-refresh-button[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-mqbxz5oty6] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-mqbxz5oty6] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-mqbxz5oty6] {
    opacity: .55;
    cursor: wait;
}

.benefit-page[b-mqbxz5oty6]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.benefit-page[b-mqbxz5oty6]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-mqbxz5oty6] {
    margin-top: 2px !important;
}

.summary-card[b-mqbxz5oty6] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-mqbxz5oty6] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-mqbxz5oty6] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-mqbxz5oty6] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-mqbxz5oty6] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-mqbxz5oty6] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-mqbxz5oty6] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-mqbxz5oty6] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-mqbxz5oty6] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-mqbxz5oty6] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-mqbxz5oty6] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-mqbxz5oty6] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-mqbxz5oty6] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-mqbxz5oty6],
.status-overview-card.selected[b-mqbxz5oty6] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-mqbxz5oty6] {
    background: #f5faf7;
}

.status-overview-card > span[b-mqbxz5oty6] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-mqbxz5oty6] { background:#687872; }
.status-overview-card.reviewing > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.difference > span[b-mqbxz5oty6] { background:#b54d43; }
.status-overview-card.approved > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.closed > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.voided > span[b-mqbxz5oty6] { background:#687872; }
.status-overview-card.today > span[b-mqbxz5oty6] { background:#73569b; }

.status-overview-card div[b-mqbxz5oty6] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-mqbxz5oty6] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-mqbxz5oty6] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-mqbxz5oty6] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-mqbxz5oty6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-mqbxz5oty6] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-mqbxz5oty6] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-mqbxz5oty6] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-mqbxz5oty6] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-mqbxz5oty6] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-mqbxz5oty6] {
    margin-top: 13px;
}

.progress-track[b-mqbxz5oty6] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-mqbxz5oty6] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-mqbxz5oty6] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-mqbxz5oty6] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-mqbxz5oty6] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-mqbxz5oty6],
.benefit-list-panel[b-mqbxz5oty6] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-mqbxz5oty6] {
    padding: 15px;
}

.filter-heading[b-mqbxz5oty6],
.list-toolbar[b-mqbxz5oty6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-mqbxz5oty6],
.panel-kicker[b-mqbxz5oty6] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-mqbxz5oty6],
.list-toolbar h2[b-mqbxz5oty6] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-mqbxz5oty6],
.list-toolbar p[b-mqbxz5oty6] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-mqbxz5oty6] {
    margin-top: 8px !important;
}

.benefit-page[b-mqbxz5oty6]  .premium-field,
.benefit-page[b-mqbxz5oty6]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.benefit-page[b-mqbxz5oty6]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-mqbxz5oty6] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-mqbxz5oty6] {
    color: var(--theme-primary);
}

.benefit-list-panel[b-mqbxz5oty6] {
    overflow: hidden;
}

.list-toolbar[b-mqbxz5oty6] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.benefit-page[b-mqbxz5oty6]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-mqbxz5oty6] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-mqbxz5oty6] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-mqbxz5oty6] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-mqbxz5oty6] {
    margin: 0;
    font-size: .84rem;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table {
    font-family: 'Kanit',sans-serif;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head {
    background: #f1f7f4;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-mqbxz5oty6] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-mqbxz5oty6] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-mqbxz5oty6] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-mqbxz5oty6] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-mqbxz5oty6],
.counter-cashier-cell[b-mqbxz5oty6],
.money-cell[b-mqbxz5oty6],
.difference-cell[b-mqbxz5oty6],
.transaction-status-cell[b-mqbxz5oty6] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-mqbxz5oty6] {
    min-width: 175px;
}

.date-shift-cell strong[b-mqbxz5oty6],
.counter-cashier-cell strong[b-mqbxz5oty6],
.money-cell strong[b-mqbxz5oty6],
.difference-cell strong[b-mqbxz5oty6],
.transaction-status-cell strong[b-mqbxz5oty6] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-mqbxz5oty6],
.counter-cashier-cell small[b-mqbxz5oty6],
.money-cell small[b-mqbxz5oty6],
.difference-cell small[b-mqbxz5oty6] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-mqbxz5oty6],
.counter-cashier-cell em[b-mqbxz5oty6] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-mqbxz5oty6] { color:var(--theme-primary); }
.money-cell.actual strong[b-mqbxz5oty6] { color:#2f789f; }

.difference-cell.matched strong[b-mqbxz5oty6] { color:#34734b; }
.difference-cell.over strong[b-mqbxz5oty6] { color:#987634; }
.difference-cell.short strong[b-mqbxz5oty6] { color:#b54d43; }

.status-chip[b-mqbxz5oty6],
.match-chip[b-mqbxz5oty6] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-mqbxz5oty6] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.difference[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-mqbxz5oty6] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-mqbxz5oty6] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.benefit-page[b-mqbxz5oty6]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.benefit-page[b-mqbxz5oty6]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.benefit-page[b-mqbxz5oty6]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.benefit-page[b-mqbxz5oty6]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.benefit-page[b-mqbxz5oty6]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-mqbxz5oty6] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-mqbxz5oty6] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-mqbxz5oty6],
.image-preview-backdrop[b-mqbxz5oty6] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.benefit-form-modal[b-mqbxz5oty6],
.benefit-view-modal[b-mqbxz5oty6],
.delete-modal[b-mqbxz5oty6],
.image-preview-modal[b-mqbxz5oty6] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-mqbxz5oty6],
.view-toolbar[b-mqbxz5oty6],
.image-preview-header[b-mqbxz5oty6] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-mqbxz5oty6] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-mqbxz5oty6] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-mqbxz5oty6],
.view-toolbar small[b-mqbxz5oty6],
.image-preview-header small[b-mqbxz5oty6] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-mqbxz5oty6],
.view-toolbar h2[b-mqbxz5oty6],
.image-preview-header h3[b-mqbxz5oty6] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-mqbxz5oty6] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-mqbxz5oty6],
.view-scroll[b-mqbxz5oty6] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-mqbxz5oty6] {
    background: #e9efec;
}

.modal-footer[b-mqbxz5oty6] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.benefit-page[b-mqbxz5oty6]  .cancel-button,
.benefit-page[b-mqbxz5oty6]  .save-button,
.benefit-page[b-mqbxz5oty6]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-mqbxz5oty6] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-mqbxz5oty6] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-mqbxz5oty6] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-mqbxz5oty6] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-mqbxz5oty6] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-mqbxz5oty6],
.calculation-heading[b-mqbxz5oty6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-mqbxz5oty6],
.calculation-heading small[b-mqbxz5oty6] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-mqbxz5oty6],
.calculation-heading h3[b-mqbxz5oty6] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-mqbxz5oty6],
.calculation-heading > span[b-mqbxz5oty6] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-mqbxz5oty6] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-mqbxz5oty6] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-mqbxz5oty6] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-mqbxz5oty6] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-mqbxz5oty6] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-mqbxz5oty6] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-mqbxz5oty6] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-mqbxz5oty6] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-mqbxz5oty6] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-mqbxz5oty6] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-mqbxz5oty6] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-mqbxz5oty6] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-mqbxz5oty6] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-mqbxz5oty6],
.calculation-grid .short strong[b-mqbxz5oty6],
.calculation-grid .short small[b-mqbxz5oty6] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-mqbxz5oty6] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-mqbxz5oty6] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-mqbxz5oty6] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-mqbxz5oty6] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-mqbxz5oty6] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-mqbxz5oty6] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-mqbxz5oty6] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-mqbxz5oty6] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-mqbxz5oty6] {
    font-size:.84rem;
}

.photo-upload-actions[b-mqbxz5oty6] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-mqbxz5oty6],
.remove-photo-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-mqbxz5oty6] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-mqbxz5oty6] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-mqbxz5oty6] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-mqbxz5oty6],
.detail-transaction-table[b-mqbxz5oty6] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-mqbxz5oty6],
.source-transaction-row[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-mqbxz5oty6] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-mqbxz5oty6],
.source-transaction-row > span[b-mqbxz5oty6] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-mqbxz5oty6] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-mqbxz5oty6] {
    border-bottom:0;
}

.mini-photo-button[b-mqbxz5oty6] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-mqbxz5oty6],
.source-transaction-more[b-mqbxz5oty6] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-mqbxz5oty6] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.benefit-view-modal[b-mqbxz5oty6] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.benefit-page[b-mqbxz5oty6]  .view-edit-button,
.benefit-page[b-mqbxz5oty6]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.benefit-page[b-mqbxz5oty6]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-benefit-profile[b-mqbxz5oty6] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-mqbxz5oty6] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-mqbxz5oty6] {
    text-align:center;
}

.document-organization small[b-mqbxz5oty6] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-mqbxz5oty6] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-mqbxz5oty6] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-mqbxz5oty6] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-mqbxz5oty6],
.document-number-box small[b-mqbxz5oty6] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-mqbxz5oty6] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-mqbxz5oty6] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-mqbxz5oty6] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-mqbxz5oty6] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-mqbxz5oty6],
.transaction-summary-section[b-mqbxz5oty6],
.source-transaction-section[b-mqbxz5oty6],
.review-section[b-mqbxz5oty6] {
    margin-top:16px;
}

.section-title[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-mqbxz5oty6] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-mqbxz5oty6] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-mqbxz5oty6] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-mqbxz5oty6] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-mqbxz5oty6],
.comparison-row[b-mqbxz5oty6],
.comparison-total[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-mqbxz5oty6] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-mqbxz5oty6],
.comparison-row span[b-mqbxz5oty6],
.comparison-total span[b-mqbxz5oty6] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-mqbxz5oty6] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-mqbxz5oty6],
.comparison-total span:not(:first-child)[b-mqbxz5oty6] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-mqbxz5oty6] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-mqbxz5oty6] { color:#34734b; }
.difference-text.over[b-mqbxz5oty6] { color:#987634; }
.difference-text.short[b-mqbxz5oty6] { color:#b54d43; }

.transaction-summary-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-mqbxz5oty6] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-mqbxz5oty6] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-mqbxz5oty6] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-mqbxz5oty6] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-mqbxz5oty6] { background:#f4fafc; }

.transaction-summary-grid span[b-mqbxz5oty6] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-mqbxz5oty6] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-mqbxz5oty6],
.detail-transaction-row[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-mqbxz5oty6] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-mqbxz5oty6],
.detail-transaction-row span[b-mqbxz5oty6] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-mqbxz5oty6] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-mqbxz5oty6] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-mqbxz5oty6] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-mqbxz5oty6] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-mqbxz5oty6] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-mqbxz5oty6] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-mqbxz5oty6] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-mqbxz5oty6],
.attachment-panel[b-mqbxz5oty6] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-mqbxz5oty6] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-mqbxz5oty6] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-mqbxz5oty6] {
    display:grid;
    gap:7px;
}

.history-item[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-mqbxz5oty6] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-mqbxz5oty6] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-mqbxz5oty6] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-mqbxz5oty6],
.history-item em[b-mqbxz5oty6] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-mqbxz5oty6] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-mqbxz5oty6] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-mqbxz5oty6] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-mqbxz5oty6] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-mqbxz5oty6] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-mqbxz5oty6] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-mqbxz5oty6] { background:rgba(52,115,75,.89); }

.attachment-empty[b-mqbxz5oty6] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-mqbxz5oty6] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-mqbxz5oty6] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-mqbxz5oty6] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-mqbxz5oty6] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-mqbxz5oty6] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-mqbxz5oty6] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-mqbxz5oty6] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-mqbxz5oty6] {
    color:#b54d43;
}

.delete-warning[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-mqbxz5oty6] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.benefit-page[b-mqbxz5oty6]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .benefit-hero[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-mqbxz5oty6] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-mqbxz5oty6] {
        grid-column:1 / -1;
    }

    .document-header[b-mqbxz5oty6] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-mqbxz5oty6] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .benefit-page[b-mqbxz5oty6] {
        padding-top:10px;
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-container {
        padding-inline:10px !important;
    }

    .benefit-hero[b-mqbxz5oty6] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-mqbxz5oty6],
    .list-toolbar[b-mqbxz5oty6],
    .source-summary-heading[b-mqbxz5oty6],
    .calculation-heading[b-mqbxz5oty6],
    .view-toolbar[b-mqbxz5oty6],
    .section-heading[b-mqbxz5oty6] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-mqbxz5oty6],
    .variance-grid[b-mqbxz5oty6],
    .progress-metrics[b-mqbxz5oty6],
    .source-summary-grid[b-mqbxz5oty6],
    .system-amount-grid[b-mqbxz5oty6],
    .calculation-grid[b-mqbxz5oty6],
    .photo-upload-grid[b-mqbxz5oty6],
    .transaction-summary-grid[b-mqbxz5oty6],
    .review-grid[b-mqbxz5oty6],
    .review-note-grid[b-mqbxz5oty6],
    .attachment-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-mqbxz5oty6] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-mqbxz5oty6] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-mqbxz5oty6] {
        width:100%;
    }

    .print-benefit-profile[b-mqbxz5oty6] {
        padding:22px 18px;
    }

    .document-footer[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-mqbxz5oty6] {
        grid-column:auto;
    }

    .status-overview[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-mqbxz5oty6] {
        width:100%;
    }

    .document-header[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-mqbxz5oty6] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-mqbxz5oty6] {
        visibility:hidden !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-mqbxz5oty6] {
        display:none !important;
    }

    .modal-backdrop[b-mqbxz5oty6],
    .benefit-view-modal[b-mqbxz5oty6],
    .view-scroll[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .scope-panel[b-mqbxz5oty6],
    .amount-comparison-section[b-mqbxz5oty6],
    .transaction-summary-section[b-mqbxz5oty6],
    .source-transaction-section[b-mqbxz5oty6],
    .review-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }

    .mock-document-label[b-mqbxz5oty6] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-mqbxz5oty6] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.benefit-page[b-mqbxz5oty6]  .hero-add-button,
.benefit-page[b-mqbxz5oty6]  .toolbar-add-button,
.benefit-page[b-mqbxz5oty6]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-mqbxz5oty6] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.confirmed > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.checked-in > span[b-mqbxz5oty6] { background:#73569b; }
.status-overview-card.in-service > span[b-mqbxz5oty6] { background:#c46a2b; }
.status-overview-card.completed > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.cancelled > span[b-mqbxz5oty6] { background:#b54d43; }

.service-overview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-mqbxz5oty6],
.service-overview-card.selected[b-mqbxz5oty6] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-mqbxz5oty6] {
    background:#f4faf7;
}

.service-overview-card > span[b-mqbxz5oty6] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-mqbxz5oty6] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-mqbxz5oty6] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-mqbxz5oty6] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-mqbxz5oty6],
.service-unit-cell[b-mqbxz5oty6],
.provider-location-cell[b-mqbxz5oty6],
.queue-priority-cell[b-mqbxz5oty6],
.reason-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-mqbxz5oty6],
.reason-cell[b-mqbxz5oty6] {
    min-width:180px;
}

.appointment-time-cell strong[b-mqbxz5oty6],
.service-unit-cell strong[b-mqbxz5oty6],
.provider-location-cell strong[b-mqbxz5oty6],
.queue-priority-cell strong[b-mqbxz5oty6],
.reason-cell strong[b-mqbxz5oty6] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-mqbxz5oty6],
.service-unit-cell small[b-mqbxz5oty6],
.provider-location-cell small[b-mqbxz5oty6],
.queue-priority-cell small[b-mqbxz5oty6],
.reason-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-mqbxz5oty6],
.provider-location-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-mqbxz5oty6],
.priority-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-mqbxz5oty6] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-mqbxz5oty6] { color:#987634; background:#fff4df; }

.priority-chip[b-mqbxz5oty6] {
    margin-top:5px;
}

.priority-chip.normal[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-mqbxz5oty6] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-mqbxz5oty6] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-mqbxz5oty6] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-mqbxz5oty6],
.identity-chip.not-found[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-mqbxz5oty6] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-mqbxz5oty6],
.citizen-source-actions a[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-mqbxz5oty6] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-mqbxz5oty6] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-mqbxz5oty6] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-mqbxz5oty6] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-mqbxz5oty6] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-mqbxz5oty6] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-mqbxz5oty6] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-mqbxz5oty6] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-mqbxz5oty6] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-mqbxz5oty6] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-mqbxz5oty6] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-mqbxz5oty6] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-mqbxz5oty6],
.identity-box small[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-mqbxz5oty6] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-mqbxz5oty6],
.reason-section[b-mqbxz5oty6],
.reminder-section[b-mqbxz5oty6] {
    margin-top:16px;
}

.reference-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-mqbxz5oty6] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-mqbxz5oty6],
.timeline-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-mqbxz5oty6],
.timeline-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-mqbxz5oty6] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-mqbxz5oty6] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-mqbxz5oty6] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-mqbxz5oty6] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mqbxz5oty6] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-mqbxz5oty6] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-mqbxz5oty6],
    .preview-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-mqbxz5oty6] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-mqbxz5oty6] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-mqbxz5oty6] {
        grid-column:1 / -1;
    }

    .reference-grid[b-mqbxz5oty6],
    .timeline-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-mqbxz5oty6],
    .focus-grid[b-mqbxz5oty6],
    .citizen-source-grid[b-mqbxz5oty6],
    .preview-grid[b-mqbxz5oty6],
    .consent-grid[b-mqbxz5oty6],
    .source-photo-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6],
    .note-grid[b-mqbxz5oty6],
    .timeline-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-mqbxz5oty6] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-mqbxz5oty6] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-mqbxz5oty6] {
        margin:0 auto;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .patient-panel[b-mqbxz5oty6],
    .service-section[b-mqbxz5oty6],
    .reason-section[b-mqbxz5oty6],
    .reminder-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.benefit-page[b-mqbxz5oty6] {
    font-size: 16px;
    line-height: 1.55;
}

.benefit-page[b-mqbxz5oty6]  .mud-typography,
.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-input-label,
.benefit-page[b-mqbxz5oty6]  .mud-select,
.benefit-page[b-mqbxz5oty6]  .mud-list-item-text,
.benefit-page[b-mqbxz5oty6]  .mud-button-label,
.benefit-page[b-mqbxz5oty6]  .mud-table-cell,
.benefit-page[b-mqbxz5oty6]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size: .92rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size: .90rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-mqbxz5oty6] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-mqbxz5oty6] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-mqbxz5oty6] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-mqbxz5oty6] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-mqbxz5oty6] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-mqbxz5oty6] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-mqbxz5oty6] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-mqbxz5oty6] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-mqbxz5oty6],
.benefit-list-panel[b-mqbxz5oty6],
.insight-panel[b-mqbxz5oty6] {
    border-radius: 20px;
}

.filter-panel[b-mqbxz5oty6] {
    padding: 20px;
}

.list-toolbar[b-mqbxz5oty6] {
    padding: 19px 20px;
}

.filter-heading p[b-mqbxz5oty6],
.list-toolbar p[b-mqbxz5oty6] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-mqbxz5oty6] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-mqbxz5oty6] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-mqbxz5oty6],
.service-unit-cell[b-mqbxz5oty6],
.provider-location-cell[b-mqbxz5oty6],
.queue-priority-cell[b-mqbxz5oty6],
.reason-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    min-width: 155px;
}

.provider-location-cell[b-mqbxz5oty6],
.reason-cell[b-mqbxz5oty6] {
    min-width: 215px;
}

.service-chip[b-mqbxz5oty6],
.priority-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6],
.identity-chip[b-mqbxz5oty6] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-mqbxz5oty6] {
    min-width: 205px;
    gap: 7px;
}

.benefit-page[b-mqbxz5oty6]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-mqbxz5oty6] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-mqbxz5oty6],
.view-toolbar[b-mqbxz5oty6],
.image-preview-header[b-mqbxz5oty6] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-mqbxz5oty6],
.view-scroll[b-mqbxz5oty6] {
    padding: 20px;
}

.modal-footer[b-mqbxz5oty6] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-mqbxz5oty6] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-mqbxz5oty6] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-mqbxz5oty6],
.preview-grid > div[b-mqbxz5oty6],
.reference-grid > div[b-mqbxz5oty6],
.timeline-grid > div[b-mqbxz5oty6] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-mqbxz5oty6] {
    padding: 13px;
}

.photo-preview[b-mqbxz5oty6] {
    min-height: 200px;
}

.photo-preview img[b-mqbxz5oty6] {
    height: 200px;
}

.history-item[b-mqbxz5oty6] {
    padding: 12px;
}

.attachment-card[b-mqbxz5oty6],
.attachment-card img[b-mqbxz5oty6] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .benefit-page[b-mqbxz5oty6] {
        font-size: 15px;
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-mqbxz5oty6] {
        min-height: 122px;
    }

    .status-overview-card[b-mqbxz5oty6],
    .service-overview-card[b-mqbxz5oty6] {
        min-height: 82px;
    }

    .modal-body[b-mqbxz5oty6],
    .view-scroll[b-mqbxz5oty6] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #benefit-profile-print-area[b-mqbxz5oty6] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #benefit-profile-print-area h1[b-mqbxz5oty6] {
        font-size: 18pt !important;
    }

    #benefit-profile-print-area h2[b-mqbxz5oty6] {
        font-size: 14pt !important;
    }

    #benefit-profile-print-area h3[b-mqbxz5oty6] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-mqbxz5oty6] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.follow-up > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.referred > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.cancelled > span[b-mqbxz5oty6] { background:#b54d43; }
.status-overview-card.month > span[b-mqbxz5oty6] { background:#73569b; }

.service-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-mqbxz5oty6] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-mqbxz5oty6] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mqbxz5oty6] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-mqbxz5oty6] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-mqbxz5oty6],
.service-unit-cell[b-mqbxz5oty6],
.provider-location-cell[b-mqbxz5oty6],
.result-cell[b-mqbxz5oty6],
.follow-score-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-mqbxz5oty6],
.result-cell[b-mqbxz5oty6] {
    min-width:230px;
}

.history-date-cell strong[b-mqbxz5oty6],
.service-unit-cell strong[b-mqbxz5oty6],
.provider-location-cell strong[b-mqbxz5oty6],
.result-cell strong[b-mqbxz5oty6],
.follow-score-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-mqbxz5oty6],
.service-unit-cell small[b-mqbxz5oty6],
.provider-location-cell small[b-mqbxz5oty6],
.result-cell small[b-mqbxz5oty6],
.follow-score-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-mqbxz5oty6],
.provider-location-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mqbxz5oty6] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-mqbxz5oty6] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mqbxz5oty6] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-mqbxz5oty6] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mqbxz5oty6] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mqbxz5oty6],
.source-actions button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-mqbxz5oty6] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-mqbxz5oty6] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-mqbxz5oty6] {
    min-height:180px;
}

.source-photo-card img[b-mqbxz5oty6] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-mqbxz5oty6] {
    margin-top:18px;
}

.vital-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-mqbxz5oty6],
.quality-grid > div[b-mqbxz5oty6],
.follow-up-grid > div[b-mqbxz5oty6] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mqbxz5oty6],
.quality-grid span[b-mqbxz5oty6],
.follow-up-grid span[b-mqbxz5oty6] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-mqbxz5oty6],
.quality-grid strong[b-mqbxz5oty6],
.follow-up-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-mqbxz5oty6] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-mqbxz5oty6],
.quality-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size:.94rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size:.92rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mqbxz5oty6] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-mqbxz5oty6] { background:rgba(104,120,114,.89); }

.view-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-mqbxz5oty6],
    .service-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mqbxz5oty6],
    .vital-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-mqbxz5oty6] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-mqbxz5oty6],
    .quality-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-mqbxz5oty6],
    .service-overview[b-mqbxz5oty6],
    .care-metrics[b-mqbxz5oty6],
    .source-data-grid[b-mqbxz5oty6],
    .source-photo-grid[b-mqbxz5oty6],
    .vital-grid[b-mqbxz5oty6],
    .follow-up-grid[b-mqbxz5oty6],
    .quality-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .patient-panel[b-mqbxz5oty6],
    .document-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-mqbxz5oty6] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.follow-up > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.referred > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.overdue > span[b-mqbxz5oty6] { background:#b54d43; }
.status-overview-card.inactive > span[b-mqbxz5oty6] { background:#687872; }

.risk-overview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-mqbxz5oty6],
.risk-overview-card.selected[b-mqbxz5oty6] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-mqbxz5oty6] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-mqbxz5oty6] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-mqbxz5oty6],
.care-metrics strong[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-mqbxz5oty6],
.care-metrics small[b-mqbxz5oty6] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mqbxz5oty6] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-mqbxz5oty6],
.risk-adl-cell[b-mqbxz5oty6],
.dependency-living-cell[b-mqbxz5oty6],
.caregiver-cell[b-mqbxz5oty6],
.follow-up-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-mqbxz5oty6] {
    min-width:190px;
}

.register-age-cell strong[b-mqbxz5oty6],
.risk-adl-cell strong[b-mqbxz5oty6],
.dependency-living-cell strong[b-mqbxz5oty6],
.caregiver-cell strong[b-mqbxz5oty6],
.follow-up-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-mqbxz5oty6],
.risk-adl-cell small[b-mqbxz5oty6],
.dependency-living-cell small[b-mqbxz5oty6],
.caregiver-cell small[b-mqbxz5oty6],
.follow-up-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-mqbxz5oty6],
.caregiver-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-mqbxz5oty6],
.dependency-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6],
.identity-chip[b-mqbxz5oty6],
.overdue-chip[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.risk-chip.high[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.active[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }

.overdue-chip[b-mqbxz5oty6] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-mqbxz5oty6] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mqbxz5oty6] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mqbxz5oty6] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-mqbxz5oty6] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mqbxz5oty6] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mqbxz5oty6],
.source-actions button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-mqbxz5oty6] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-mqbxz5oty6] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-mqbxz5oty6] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-mqbxz5oty6],
.reference-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-mqbxz5oty6],
.reference-grid > div[b-mqbxz5oty6],
.care-plan-grid > div[b-mqbxz5oty6] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-mqbxz5oty6],
.reference-grid span[b-mqbxz5oty6],
.care-plan-grid span[b-mqbxz5oty6] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-mqbxz5oty6],
.reference-grid strong[b-mqbxz5oty6],
.care-plan-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-mqbxz5oty6] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size:.96rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size:.94rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-mqbxz5oty6] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-mqbxz5oty6] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mqbxz5oty6] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mqbxz5oty6] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-mqbxz5oty6],
    .assessment-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mqbxz5oty6],
    .risk-overview[b-mqbxz5oty6],
    .dependency-grid[b-mqbxz5oty6],
    .care-metrics[b-mqbxz5oty6],
    .source-data-grid[b-mqbxz5oty6],
    .assessment-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6],
    .care-plan-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .patient-panel[b-mqbxz5oty6],
    .document-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.benefit-page[b-mqbxz5oty6] {
    font-size:16.5px;
    line-height:1.62;
}

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-mqbxz5oty6] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-mqbxz5oty6] { background:#73569b; }
.status-overview-card.field > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.completed > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.follow-up > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.referred > span[b-mqbxz5oty6] { background:#b55b82; }

.visit-type-overview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-mqbxz5oty6],
.visit-type-overview-card.selected[b-mqbxz5oty6] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-mqbxz5oty6] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-mqbxz5oty6] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-mqbxz5oty6] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-mqbxz5oty6] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-mqbxz5oty6] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-mqbxz5oty6] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-mqbxz5oty6] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-mqbxz5oty6] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-mqbxz5oty6],
.care-metrics strong[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-mqbxz5oty6],
.care-metrics small[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-mqbxz5oty6],
.visit-type-cell[b-mqbxz5oty6],
.team-location-cell[b-mqbxz5oty6],
.result-cell[b-mqbxz5oty6],
.follow-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-mqbxz5oty6],
.result-cell[b-mqbxz5oty6] {
    min-width:230px;
}

.visit-date-cell strong[b-mqbxz5oty6],
.visit-type-cell strong[b-mqbxz5oty6],
.team-location-cell strong[b-mqbxz5oty6],
.result-cell strong[b-mqbxz5oty6],
.follow-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-mqbxz5oty6],
.visit-type-cell small[b-mqbxz5oty6],
.team-location-cell small[b-mqbxz5oty6],
.result-cell small[b-mqbxz5oty6],
.follow-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-mqbxz5oty6],
.team-location-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6],
.identity-chip[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.priority-text[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-mqbxz5oty6] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mqbxz5oty6] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mqbxz5oty6] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mqbxz5oty6] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mqbxz5oty6] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-mqbxz5oty6] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-mqbxz5oty6] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-mqbxz5oty6] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-mqbxz5oty6] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-mqbxz5oty6] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-mqbxz5oty6],
.reference-grid > div[b-mqbxz5oty6] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mqbxz5oty6],
.reference-grid span[b-mqbxz5oty6] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-mqbxz5oty6],
.reference-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size:1rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size:.98rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-mqbxz5oty6] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-mqbxz5oty6] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-mqbxz5oty6],
    .visit-type-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mqbxz5oty6],
    .visit-type-overview[b-mqbxz5oty6],
    .target-grid[b-mqbxz5oty6],
    .care-metrics[b-mqbxz5oty6],
    .source-data-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6],
    .vital-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .patient-panel[b-mqbxz5oty6],
    .document-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.benefit-page[b-mqbxz5oty6] {
    font-size:17px;
    line-height:1.65;
}

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-mqbxz5oty6] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.review > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.eligible > span[b-mqbxz5oty6] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.paid > span[b-mqbxz5oty6] { background:#73569b; }

.type-overview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-mqbxz5oty6],
.type-overview-card.selected[b-mqbxz5oty6] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-mqbxz5oty6] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-mqbxz5oty6] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-mqbxz5oty6] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-mqbxz5oty6] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-mqbxz5oty6] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-mqbxz5oty6] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-mqbxz5oty6] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-mqbxz5oty6],
.target-grid button[b-mqbxz5oty6] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-mqbxz5oty6] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-mqbxz5oty6],
.welfare-type-cell[b-mqbxz5oty6],
.household-cell[b-mqbxz5oty6],
.amount-cell[b-mqbxz5oty6],
.officer-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-mqbxz5oty6],
.officer-cell[b-mqbxz5oty6] {
    min-width:210px;
}

.application-no-cell strong[b-mqbxz5oty6],
.welfare-type-cell strong[b-mqbxz5oty6],
.household-cell strong[b-mqbxz5oty6],
.amount-cell strong[b-mqbxz5oty6],
.officer-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-mqbxz5oty6],
.welfare-type-cell small[b-mqbxz5oty6],
.household-cell small[b-mqbxz5oty6],
.amount-cell small[b-mqbxz5oty6],
.officer-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-mqbxz5oty6],
.household-cell em[b-mqbxz5oty6],
.amount-cell em[b-mqbxz5oty6],
.officer-cell em[b-mqbxz5oty6],
.citizen-photo-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6],
.source-group-chip[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }

.source-group-chip[b-mqbxz5oty6] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-mqbxz5oty6] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-mqbxz5oty6],
.amount-preview[b-mqbxz5oty6] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-mqbxz5oty6] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-mqbxz5oty6] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-mqbxz5oty6],
.amount-preview > div[b-mqbxz5oty6] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-mqbxz5oty6],
.amount-preview small[b-mqbxz5oty6] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-mqbxz5oty6] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-mqbxz5oty6],
.amount-preview strong[b-mqbxz5oty6] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-mqbxz5oty6],
.amount-preview span[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-mqbxz5oty6] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-mqbxz5oty6],
.amount-document-grid small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-mqbxz5oty6] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-mqbxz5oty6] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-mqbxz5oty6] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-mqbxz5oty6] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size:1.02rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size:1rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-mqbxz5oty6] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-mqbxz5oty6] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mqbxz5oty6] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mqbxz5oty6],
    .type-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-mqbxz5oty6],
    .amount-document-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mqbxz5oty6],
    .type-overview[b-mqbxz5oty6],
    .budget-grid[b-mqbxz5oty6],
    .target-grid[b-mqbxz5oty6],
    .care-metrics[b-mqbxz5oty6],
    .source-data-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6],
    .assessment-preview[b-mqbxz5oty6],
    .amount-preview[b-mqbxz5oty6],
    .amount-document-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .patient-panel[b-mqbxz5oty6],
    .document-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFIT CATALOG โ€” LARGE PREMIUM TEXT
   ========================================================= */

.benefit-page[b-mqbxz5oty6] {
    font-size:17px;
    line-height:1.66;
}

.benefit-hero[b-mqbxz5oty6] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(47,120,159,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-mqbxz5oty6] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.applicants[b-mqbxz5oty6] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.budget[b-mqbxz5oty6] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.remaining[b-mqbxz5oty6] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mqbxz5oty6] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mqbxz5oty6] { background:var(--theme-primary); }
.status-overview-card.open > span[b-mqbxz5oty6] { background:#34734b; }
.status-overview-card.upcoming > span[b-mqbxz5oty6] { background:#2f789f; }
.status-overview-card.paused > span[b-mqbxz5oty6] { background:#987634; }
.status-overview-card.closed > span[b-mqbxz5oty6] { background:#687872; }

.category-overview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.category-overview-card[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.category-overview-card:hover[b-mqbxz5oty6],
.category-overview-card.selected[b-mqbxz5oty6] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.category-overview-card > span[b-mqbxz5oty6] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.category-overview-card.allowance > span[b-mqbxz5oty6] {
    color:#987634;
    background:#fff4df;
}

.category-overview-card.social > span[b-mqbxz5oty6] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.category-overview-card.housing > span[b-mqbxz5oty6] {
    color:#2f789f;
    background:#e8f3f8;
}

.category-overview-card.care > span[b-mqbxz5oty6] {
    color:#73569b;
    background:#f0eafb;
}

.category-overview-card.education > span[b-mqbxz5oty6] {
    color:#2f789f;
    background:#e8f3f8;
}

.category-overview-card.occupation > span[b-mqbxz5oty6] {
    color:#34734b;
    background:#e7f5ec;
}

.category-overview-card small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.category-overview-card strong[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

/* BUDGET INSIGHT */

.budget-progress[b-mqbxz5oty6] {
    margin-top:15px;
}

.budget-progress > div[b-mqbxz5oty6] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.budget-progress > div > span[b-mqbxz5oty6] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

.budget-metrics[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:13px;
}

.budget-metrics > div[b-mqbxz5oty6] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-metrics small[b-mqbxz5oty6] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-metrics strong[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.20rem;
}

/* TABLE CELLS */

.benefit-photo-cell[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:68px minmax(0,1fr);
    min-width:265px;
    align-items:center;
    gap:12px;
}

.benefit-photo-mini[b-mqbxz5oty6] {
    display:grid;
    width:68px;
    height:68px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e9f4ef;
}

.benefit-photo-mini button[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.benefit-photo-mini img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.benefit-photo-cell strong[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.58;
}

.benefit-photo-cell small[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

.benefit-photo-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:7px;
    padding:0 10px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.target-rule-cell[b-mqbxz5oty6],
.benefit-amount-cell[b-mqbxz5oty6],
.budget-cell[b-mqbxz5oty6],
.application-stat-cell[b-mqbxz5oty6],
.period-cell[b-mqbxz5oty6],
.status-cell[b-mqbxz5oty6] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.target-rule-cell[b-mqbxz5oty6] {
    min-width:210px;
}

.target-rule-cell strong[b-mqbxz5oty6],
.benefit-amount-cell strong[b-mqbxz5oty6],
.budget-cell strong[b-mqbxz5oty6],
.application-stat-cell strong[b-mqbxz5oty6],
.period-cell strong[b-mqbxz5oty6] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.target-rule-cell small[b-mqbxz5oty6],
.benefit-amount-cell small[b-mqbxz5oty6],
.budget-cell small[b-mqbxz5oty6],
.application-stat-cell small[b-mqbxz5oty6],
.period-cell small[b-mqbxz5oty6],
.status-cell small[b-mqbxz5oty6] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.benefit-amount-cell em[b-mqbxz5oty6],
.budget-cell em[b-mqbxz5oty6],
.application-stat-cell em[b-mqbxz5oty6],
.period-cell em[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.table-progress[b-mqbxz5oty6] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mqbxz5oty6] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

/* CHIPS */

.category-chip[b-mqbxz5oty6],
.target-chip[b-mqbxz5oty6],
.status-chip[b-mqbxz5oty6] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.category-chip.allowance[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.category-chip.social-assistance[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.category-chip.emergency[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.category-chip.housing[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.category-chip.care-support[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.category-chip.education[b-mqbxz5oty6] { color:#2f789f; background:#e8f3f8; }
.category-chip.occupation[b-mqbxz5oty6] { color:#34734b; background:#e7f5ec; }
.category-chip.health[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }

.target-chip.general[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.target-chip.elderly[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.target-chip.disabled[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.target-chip.elderly-disabled[b-mqbxz5oty6] { color:#73569b; background:#f0eafb; }
.target-chip.child-family[b-mqbxz5oty6] { color:#b55b82; background:#fdebf3; }
.target-chip.low-income[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.target-chip.vulnerable-family[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }
.status-chip.active[b-mqbxz5oty6] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.paused[b-mqbxz5oty6] { color:#987634; background:#fff4df; }
.status-chip.closed[b-mqbxz5oty6] { color:#b54d43; background:#fff0ee; }
.status-chip.inactive[b-mqbxz5oty6] { color:#687872; background:#edf1ef; }

.row-source-action[b-mqbxz5oty6] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM CONDITIONS */

.condition-switch-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-mqbxz5oty6] {
    display:flex;
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-mqbxz5oty6] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.budget-preview[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.budget-preview > div[b-mqbxz5oty6] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.budget-preview small[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.budget-preview strong[b-mqbxz5oty6] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-preview span[b-mqbxz5oty6] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL COVER */

.cover-panel[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr);
    gap:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.cover-photo[b-mqbxz5oty6] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.cover-photo img[b-mqbxz5oty6] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.cover-content small[b-mqbxz5oty6] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.cover-content h2[b-mqbxz5oty6] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.cover-content p[b-mqbxz5oty6] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.cover-meta[b-mqbxz5oty6] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.cover-meta span[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-weight:750;
}

/* LINKED APPLICATIONS */

.applicant-photo-panel[b-mqbxz5oty6] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.linked-applicant-grid[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:14px;
}

.linked-applicant-grid button[b-mqbxz5oty6] {
    display:grid;
    grid-template-columns:84px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:12px;
    padding:11px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.linked-applicant-grid img[b-mqbxz5oty6] {
    width:84px;
    height:84px;
    object-fit:cover;
    border-radius:13px;
}

.linked-applicant-grid strong[b-mqbxz5oty6] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.linked-applicant-grid small[b-mqbxz5oty6] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.empty-linked-photo[b-mqbxz5oty6] {
    margin-top:13px;
    padding:23px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

/* LARGE TEXT */

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.benefit-page[b-mqbxz5oty6]  .mud-input,
.benefit-page[b-mqbxz5oty6]  .mud-select-input {
    font-size:1.02rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-list-item-text {
    font-size:1rem !important;
}

.benefit-page[b-mqbxz5oty6]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mqbxz5oty6] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.cover > span[b-mqbxz5oty6] { background:rgba(10,114,87,.90); }
.attachment-card.criteria > span[b-mqbxz5oty6] { background:rgba(152,118,52,.90); }
.attachment-card.form > span[b-mqbxz5oty6] { background:rgba(47,120,159,.90); }
.attachment-card.public-relation > span[b-mqbxz5oty6] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mqbxz5oty6],
    .category-overview[b-mqbxz5oty6] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-applicant-grid[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .cover-panel[b-mqbxz5oty6] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .budget-preview[b-mqbxz5oty6] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-mqbxz5oty6],
    .category-overview[b-mqbxz5oty6],
    .budget-metrics[b-mqbxz5oty6],
    .target-grid[b-mqbxz5oty6],
    .condition-switch-grid[b-mqbxz5oty6],
    .budget-preview[b-mqbxz5oty6],
    .reference-grid[b-mqbxz5oty6],
    .amount-document-grid[b-mqbxz5oty6],
    .linked-applicant-grid[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .cover-panel[b-mqbxz5oty6] {
        grid-template-columns:minmax(0,1fr);
    }

    .benefit-page[b-mqbxz5oty6]  .benefit-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #benefit-profile-print-area[b-mqbxz5oty6],
    #benefit-profile-print-area *[b-mqbxz5oty6] {
        visibility:visible !important;
    }

    #benefit-profile-print-area[b-mqbxz5oty6] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .benefit-view-modal[b-mqbxz5oty6] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mqbxz5oty6],
    .document-status-strip[b-mqbxz5oty6],
    .cover-panel[b-mqbxz5oty6],
    .document-section[b-mqbxz5oty6],
    .document-footer[b-mqbxz5oty6] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/04Welfare/WelfareDisbursement.razor.rz.scp.css */
:root[b-ljok4eb3st] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.disbursement-page[b-ljok4eb3st] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.disbursement-hero[b-ljok4eb3st] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-ljok4eb3st] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-ljok4eb3st] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-ljok4eb3st],
.hero-action-panel[b-ljok4eb3st] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-ljok4eb3st] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-ljok4eb3st] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-ljok4eb3st] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-ljok4eb3st] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-ljok4eb3st] {
    margin-top: 3px;
    font-size: .94rem;
}

.disbursement-hero h1[b-ljok4eb3st] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.disbursement-hero p[b-ljok4eb3st] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-ljok4eb3st] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-ljok4eb3st] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-ljok4eb3st] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-ljok4eb3st] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-ljok4eb3st] {
    font-size: .85rem;
}

.hero-status small[b-ljok4eb3st] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.disbursement-page[b-ljok4eb3st]  .hero-add-button,
.disbursement-page[b-ljok4eb3st]  .toolbar-add-button,
.disbursement-page[b-ljok4eb3st]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.disbursement-page[b-ljok4eb3st]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-ljok4eb3st],
.hero-refresh-button[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-ljok4eb3st] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-ljok4eb3st] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-ljok4eb3st] {
    opacity: .55;
    cursor: wait;
}

.disbursement-page[b-ljok4eb3st]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.disbursement-page[b-ljok4eb3st]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-ljok4eb3st] {
    margin-top: 2px !important;
}

.summary-card[b-ljok4eb3st] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-ljok4eb3st] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-ljok4eb3st] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-ljok4eb3st] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-ljok4eb3st] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-ljok4eb3st] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-ljok4eb3st] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-ljok4eb3st] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-ljok4eb3st] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-ljok4eb3st] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-ljok4eb3st] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-ljok4eb3st] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-ljok4eb3st] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-ljok4eb3st],
.status-overview-card.selected[b-ljok4eb3st] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-ljok4eb3st] {
    background: #f5faf7;
}

.status-overview-card > span[b-ljok4eb3st] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-ljok4eb3st] { background:#687872; }
.status-overview-card.reviewing > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.difference > span[b-ljok4eb3st] { background:#b54d43; }
.status-overview-card.approved > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.closed > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.voided > span[b-ljok4eb3st] { background:#687872; }
.status-overview-card.today > span[b-ljok4eb3st] { background:#73569b; }

.status-overview-card div[b-ljok4eb3st] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-ljok4eb3st] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-ljok4eb3st] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-ljok4eb3st] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-ljok4eb3st] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-ljok4eb3st] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-ljok4eb3st] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-ljok4eb3st] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-ljok4eb3st] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-ljok4eb3st] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-ljok4eb3st] {
    margin-top: 13px;
}

.progress-track[b-ljok4eb3st] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-ljok4eb3st] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-ljok4eb3st] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-ljok4eb3st] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-ljok4eb3st] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-ljok4eb3st],
.disbursement-list-panel[b-ljok4eb3st] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-ljok4eb3st] {
    padding: 15px;
}

.filter-heading[b-ljok4eb3st],
.list-toolbar[b-ljok4eb3st] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-ljok4eb3st],
.panel-kicker[b-ljok4eb3st] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-ljok4eb3st],
.list-toolbar h2[b-ljok4eb3st] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-ljok4eb3st],
.list-toolbar p[b-ljok4eb3st] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-ljok4eb3st] {
    margin-top: 8px !important;
}

.disbursement-page[b-ljok4eb3st]  .premium-field,
.disbursement-page[b-ljok4eb3st]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.disbursement-page[b-ljok4eb3st]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-ljok4eb3st] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-ljok4eb3st] {
    color: var(--theme-primary);
}

.disbursement-list-panel[b-ljok4eb3st] {
    overflow: hidden;
}

.list-toolbar[b-ljok4eb3st] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.disbursement-page[b-ljok4eb3st]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-ljok4eb3st] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-ljok4eb3st] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-ljok4eb3st] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-ljok4eb3st] {
    margin: 0;
    font-size: .84rem;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table {
    font-family: 'Kanit',sans-serif;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head {
    background: #f1f7f4;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-ljok4eb3st] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-ljok4eb3st] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-ljok4eb3st] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-ljok4eb3st] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-ljok4eb3st],
.counter-cashier-cell[b-ljok4eb3st],
.money-cell[b-ljok4eb3st],
.difference-cell[b-ljok4eb3st],
.transaction-status-cell[b-ljok4eb3st] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-ljok4eb3st] {
    min-width: 175px;
}

.date-shift-cell strong[b-ljok4eb3st],
.counter-cashier-cell strong[b-ljok4eb3st],
.money-cell strong[b-ljok4eb3st],
.difference-cell strong[b-ljok4eb3st],
.transaction-status-cell strong[b-ljok4eb3st] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-ljok4eb3st],
.counter-cashier-cell small[b-ljok4eb3st],
.money-cell small[b-ljok4eb3st],
.difference-cell small[b-ljok4eb3st] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-ljok4eb3st],
.counter-cashier-cell em[b-ljok4eb3st] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-ljok4eb3st] { color:var(--theme-primary); }
.money-cell.actual strong[b-ljok4eb3st] { color:#2f789f; }

.difference-cell.matched strong[b-ljok4eb3st] { color:#34734b; }
.difference-cell.over strong[b-ljok4eb3st] { color:#987634; }
.difference-cell.short strong[b-ljok4eb3st] { color:#b54d43; }

.status-chip[b-ljok4eb3st],
.match-chip[b-ljok4eb3st] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-ljok4eb3st] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.difference[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-ljok4eb3st] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-ljok4eb3st] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.disbursement-page[b-ljok4eb3st]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.disbursement-page[b-ljok4eb3st]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.disbursement-page[b-ljok4eb3st]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.disbursement-page[b-ljok4eb3st]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.disbursement-page[b-ljok4eb3st]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-ljok4eb3st] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-ljok4eb3st] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-ljok4eb3st],
.image-preview-backdrop[b-ljok4eb3st] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.disbursement-form-modal[b-ljok4eb3st],
.disbursement-view-modal[b-ljok4eb3st],
.delete-modal[b-ljok4eb3st],
.image-preview-modal[b-ljok4eb3st] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-ljok4eb3st],
.view-toolbar[b-ljok4eb3st],
.image-preview-header[b-ljok4eb3st] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-ljok4eb3st] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-ljok4eb3st] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-ljok4eb3st],
.view-toolbar small[b-ljok4eb3st],
.image-preview-header small[b-ljok4eb3st] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-ljok4eb3st],
.view-toolbar h2[b-ljok4eb3st],
.image-preview-header h3[b-ljok4eb3st] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-ljok4eb3st] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-ljok4eb3st],
.view-scroll[b-ljok4eb3st] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-ljok4eb3st] {
    background: #e9efec;
}

.modal-footer[b-ljok4eb3st] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.disbursement-page[b-ljok4eb3st]  .cancel-button,
.disbursement-page[b-ljok4eb3st]  .save-button,
.disbursement-page[b-ljok4eb3st]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-ljok4eb3st] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-ljok4eb3st] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-ljok4eb3st] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-ljok4eb3st] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-ljok4eb3st],
.calculation-heading[b-ljok4eb3st] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-ljok4eb3st],
.calculation-heading small[b-ljok4eb3st] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-ljok4eb3st],
.calculation-heading h3[b-ljok4eb3st] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-ljok4eb3st],
.calculation-heading > span[b-ljok4eb3st] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-ljok4eb3st] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-ljok4eb3st] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-ljok4eb3st] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-ljok4eb3st] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-ljok4eb3st] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-ljok4eb3st] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-ljok4eb3st] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-ljok4eb3st] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-ljok4eb3st] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-ljok4eb3st] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-ljok4eb3st] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-ljok4eb3st] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-ljok4eb3st],
.calculation-grid .short strong[b-ljok4eb3st],
.calculation-grid .short small[b-ljok4eb3st] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-ljok4eb3st] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-ljok4eb3st] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-ljok4eb3st] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-ljok4eb3st] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-ljok4eb3st] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-ljok4eb3st] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-ljok4eb3st] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-ljok4eb3st] {
    font-size:.84rem;
}

.photo-upload-actions[b-ljok4eb3st] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-ljok4eb3st],
.remove-photo-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-ljok4eb3st] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-ljok4eb3st] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-ljok4eb3st] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-ljok4eb3st],
.detail-transaction-table[b-ljok4eb3st] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-ljok4eb3st],
.source-transaction-row[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-ljok4eb3st] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-ljok4eb3st],
.source-transaction-row > span[b-ljok4eb3st] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-ljok4eb3st] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-ljok4eb3st] {
    border-bottom:0;
}

.mini-photo-button[b-ljok4eb3st] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-ljok4eb3st],
.source-transaction-more[b-ljok4eb3st] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-ljok4eb3st] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.disbursement-view-modal[b-ljok4eb3st] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.disbursement-page[b-ljok4eb3st]  .view-edit-button,
.disbursement-page[b-ljok4eb3st]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.disbursement-page[b-ljok4eb3st]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-disbursement-profile[b-ljok4eb3st] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-ljok4eb3st] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-ljok4eb3st] {
    text-align:center;
}

.document-organization small[b-ljok4eb3st] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-ljok4eb3st] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-ljok4eb3st] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-ljok4eb3st] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-ljok4eb3st],
.document-number-box small[b-ljok4eb3st] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-ljok4eb3st] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-ljok4eb3st] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-ljok4eb3st] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-ljok4eb3st] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-ljok4eb3st] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-ljok4eb3st] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-ljok4eb3st],
.transaction-summary-section[b-ljok4eb3st],
.source-transaction-section[b-ljok4eb3st],
.review-section[b-ljok4eb3st] {
    margin-top:16px;
}

.section-title[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-ljok4eb3st] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-ljok4eb3st] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-ljok4eb3st] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-ljok4eb3st] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-ljok4eb3st],
.comparison-row[b-ljok4eb3st],
.comparison-total[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-ljok4eb3st] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-ljok4eb3st],
.comparison-row span[b-ljok4eb3st],
.comparison-total span[b-ljok4eb3st] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-ljok4eb3st] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-ljok4eb3st],
.comparison-total span:not(:first-child)[b-ljok4eb3st] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-ljok4eb3st] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-ljok4eb3st] { color:#34734b; }
.difference-text.over[b-ljok4eb3st] { color:#987634; }
.difference-text.short[b-ljok4eb3st] { color:#b54d43; }

.transaction-summary-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-ljok4eb3st] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-ljok4eb3st] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-ljok4eb3st] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-ljok4eb3st] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-ljok4eb3st] { background:#f4fafc; }

.transaction-summary-grid span[b-ljok4eb3st] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-ljok4eb3st] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-ljok4eb3st],
.detail-transaction-row[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-ljok4eb3st] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-ljok4eb3st],
.detail-transaction-row span[b-ljok4eb3st] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-ljok4eb3st] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-ljok4eb3st] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-ljok4eb3st] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-ljok4eb3st] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-ljok4eb3st] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-ljok4eb3st] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-ljok4eb3st] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-ljok4eb3st] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-ljok4eb3st] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-ljok4eb3st],
.attachment-panel[b-ljok4eb3st] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-ljok4eb3st] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-ljok4eb3st] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-ljok4eb3st] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-ljok4eb3st] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-ljok4eb3st] {
    display:grid;
    gap:7px;
}

.history-item[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-ljok4eb3st] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-ljok4eb3st] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-ljok4eb3st] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-ljok4eb3st],
.history-item em[b-ljok4eb3st] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-ljok4eb3st] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-ljok4eb3st] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-ljok4eb3st] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-ljok4eb3st] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-ljok4eb3st] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-ljok4eb3st] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-ljok4eb3st] { background:rgba(52,115,75,.89); }

.attachment-empty[b-ljok4eb3st] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-ljok4eb3st] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-ljok4eb3st] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-ljok4eb3st] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-ljok4eb3st] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-ljok4eb3st] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-ljok4eb3st] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-ljok4eb3st] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-ljok4eb3st] {
    color:#b54d43;
}

.delete-warning[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-ljok4eb3st] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.disbursement-page[b-ljok4eb3st]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .disbursement-hero[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-ljok4eb3st] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-ljok4eb3st] {
        grid-column:1 / -1;
    }

    .document-header[b-ljok4eb3st] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-ljok4eb3st] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .disbursement-page[b-ljok4eb3st] {
        padding-top:10px;
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-container {
        padding-inline:10px !important;
    }

    .disbursement-hero[b-ljok4eb3st] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-ljok4eb3st],
    .list-toolbar[b-ljok4eb3st],
    .source-summary-heading[b-ljok4eb3st],
    .calculation-heading[b-ljok4eb3st],
    .view-toolbar[b-ljok4eb3st],
    .section-heading[b-ljok4eb3st] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-ljok4eb3st],
    .variance-grid[b-ljok4eb3st],
    .progress-metrics[b-ljok4eb3st],
    .source-summary-grid[b-ljok4eb3st],
    .system-amount-grid[b-ljok4eb3st],
    .calculation-grid[b-ljok4eb3st],
    .photo-upload-grid[b-ljok4eb3st],
    .transaction-summary-grid[b-ljok4eb3st],
    .review-grid[b-ljok4eb3st],
    .review-note-grid[b-ljok4eb3st],
    .attachment-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-ljok4eb3st] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-ljok4eb3st] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-ljok4eb3st] {
        width:100%;
    }

    .print-disbursement-profile[b-ljok4eb3st] {
        padding:22px 18px;
    }

    .document-footer[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-ljok4eb3st] {
        grid-column:auto;
    }

    .status-overview[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-ljok4eb3st] {
        width:100%;
    }

    .document-header[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-ljok4eb3st] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-ljok4eb3st] {
        visibility:hidden !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-ljok4eb3st] {
        display:none !important;
    }

    .modal-backdrop[b-ljok4eb3st],
    .disbursement-view-modal[b-ljok4eb3st],
    .view-scroll[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .scope-panel[b-ljok4eb3st],
    .amount-comparison-section[b-ljok4eb3st],
    .transaction-summary-section[b-ljok4eb3st],
    .source-transaction-section[b-ljok4eb3st],
    .review-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }

    .mock-document-label[b-ljok4eb3st] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-ljok4eb3st] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.disbursement-page[b-ljok4eb3st]  .hero-add-button,
.disbursement-page[b-ljok4eb3st]  .toolbar-add-button,
.disbursement-page[b-ljok4eb3st]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-ljok4eb3st] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.confirmed > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.checked-in > span[b-ljok4eb3st] { background:#73569b; }
.status-overview-card.in-service > span[b-ljok4eb3st] { background:#c46a2b; }
.status-overview-card.completed > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.cancelled > span[b-ljok4eb3st] { background:#b54d43; }

.service-overview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-ljok4eb3st],
.service-overview-card.selected[b-ljok4eb3st] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-ljok4eb3st] {
    background:#f4faf7;
}

.service-overview-card > span[b-ljok4eb3st] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-ljok4eb3st] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-ljok4eb3st] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-ljok4eb3st] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-ljok4eb3st] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-ljok4eb3st] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-ljok4eb3st],
.service-unit-cell[b-ljok4eb3st],
.provider-location-cell[b-ljok4eb3st],
.queue-priority-cell[b-ljok4eb3st],
.reason-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-ljok4eb3st],
.reason-cell[b-ljok4eb3st] {
    min-width:180px;
}

.appointment-time-cell strong[b-ljok4eb3st],
.service-unit-cell strong[b-ljok4eb3st],
.provider-location-cell strong[b-ljok4eb3st],
.queue-priority-cell strong[b-ljok4eb3st],
.reason-cell strong[b-ljok4eb3st] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-ljok4eb3st],
.service-unit-cell small[b-ljok4eb3st],
.provider-location-cell small[b-ljok4eb3st],
.queue-priority-cell small[b-ljok4eb3st],
.reason-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-ljok4eb3st],
.provider-location-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-ljok4eb3st],
.priority-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-ljok4eb3st] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-ljok4eb3st] { color:#987634; background:#fff4df; }

.priority-chip[b-ljok4eb3st] {
    margin-top:5px;
}

.priority-chip.normal[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-ljok4eb3st] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-ljok4eb3st] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-ljok4eb3st] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-ljok4eb3st] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-ljok4eb3st] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-ljok4eb3st] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-ljok4eb3st],
.identity-chip.not-found[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-ljok4eb3st] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-ljok4eb3st],
.citizen-source-actions a[b-ljok4eb3st] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-ljok4eb3st] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-ljok4eb3st] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-ljok4eb3st] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-ljok4eb3st] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-ljok4eb3st] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-ljok4eb3st] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-ljok4eb3st] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-ljok4eb3st] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-ljok4eb3st] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-ljok4eb3st] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-ljok4eb3st] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-ljok4eb3st] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-ljok4eb3st] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-ljok4eb3st] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-ljok4eb3st],
.identity-box small[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-ljok4eb3st] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-ljok4eb3st],
.reason-section[b-ljok4eb3st],
.reminder-section[b-ljok4eb3st] {
    margin-top:16px;
}

.reference-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-ljok4eb3st] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-ljok4eb3st],
.timeline-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-ljok4eb3st],
.timeline-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-ljok4eb3st] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-ljok4eb3st] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-ljok4eb3st] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-ljok4eb3st] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-ljok4eb3st] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-ljok4eb3st] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-ljok4eb3st],
    .preview-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-ljok4eb3st] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-ljok4eb3st] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-ljok4eb3st] {
        grid-column:1 / -1;
    }

    .reference-grid[b-ljok4eb3st],
    .timeline-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-ljok4eb3st],
    .focus-grid[b-ljok4eb3st],
    .citizen-source-grid[b-ljok4eb3st],
    .preview-grid[b-ljok4eb3st],
    .consent-grid[b-ljok4eb3st],
    .source-photo-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .note-grid[b-ljok4eb3st],
    .timeline-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-ljok4eb3st] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-ljok4eb3st] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-ljok4eb3st] {
        margin:0 auto;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .service-section[b-ljok4eb3st],
    .reason-section[b-ljok4eb3st],
    .reminder-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.disbursement-page[b-ljok4eb3st] {
    font-size: 16px;
    line-height: 1.55;
}

.disbursement-page[b-ljok4eb3st]  .mud-typography,
.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-input-label,
.disbursement-page[b-ljok4eb3st]  .mud-select,
.disbursement-page[b-ljok4eb3st]  .mud-list-item-text,
.disbursement-page[b-ljok4eb3st]  .mud-button-label,
.disbursement-page[b-ljok4eb3st]  .mud-table-cell,
.disbursement-page[b-ljok4eb3st]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size: .92rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size: .90rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-ljok4eb3st] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-ljok4eb3st] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-ljok4eb3st] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-ljok4eb3st] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-ljok4eb3st] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-ljok4eb3st] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-ljok4eb3st] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-ljok4eb3st] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-ljok4eb3st],
.disbursement-list-panel[b-ljok4eb3st],
.insight-panel[b-ljok4eb3st] {
    border-radius: 20px;
}

.filter-panel[b-ljok4eb3st] {
    padding: 20px;
}

.list-toolbar[b-ljok4eb3st] {
    padding: 19px 20px;
}

.filter-heading p[b-ljok4eb3st],
.list-toolbar p[b-ljok4eb3st] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-ljok4eb3st] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-ljok4eb3st] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-ljok4eb3st],
.service-unit-cell[b-ljok4eb3st],
.provider-location-cell[b-ljok4eb3st],
.queue-priority-cell[b-ljok4eb3st],
.reason-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    min-width: 155px;
}

.provider-location-cell[b-ljok4eb3st],
.reason-cell[b-ljok4eb3st] {
    min-width: 215px;
}

.service-chip[b-ljok4eb3st],
.priority-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st],
.identity-chip[b-ljok4eb3st] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-ljok4eb3st] {
    min-width: 205px;
    gap: 7px;
}

.disbursement-page[b-ljok4eb3st]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-ljok4eb3st] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-ljok4eb3st],
.view-toolbar[b-ljok4eb3st],
.image-preview-header[b-ljok4eb3st] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-ljok4eb3st],
.view-scroll[b-ljok4eb3st] {
    padding: 20px;
}

.modal-footer[b-ljok4eb3st] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-ljok4eb3st] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-ljok4eb3st] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-ljok4eb3st],
.preview-grid > div[b-ljok4eb3st],
.reference-grid > div[b-ljok4eb3st],
.timeline-grid > div[b-ljok4eb3st] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-ljok4eb3st] {
    padding: 13px;
}

.photo-preview[b-ljok4eb3st] {
    min-height: 200px;
}

.photo-preview img[b-ljok4eb3st] {
    height: 200px;
}

.history-item[b-ljok4eb3st] {
    padding: 12px;
}

.attachment-card[b-ljok4eb3st],
.attachment-card img[b-ljok4eb3st] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .disbursement-page[b-ljok4eb3st] {
        font-size: 15px;
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-ljok4eb3st] {
        min-height: 122px;
    }

    .status-overview-card[b-ljok4eb3st],
    .service-overview-card[b-ljok4eb3st] {
        min-height: 82px;
    }

    .modal-body[b-ljok4eb3st],
    .view-scroll[b-ljok4eb3st] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #disbursement-profile-print-area[b-ljok4eb3st] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #disbursement-profile-print-area h1[b-ljok4eb3st] {
        font-size: 18pt !important;
    }

    #disbursement-profile-print-area h2[b-ljok4eb3st] {
        font-size: 14pt !important;
    }

    #disbursement-profile-print-area h3[b-ljok4eb3st] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-ljok4eb3st] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.follow-up > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.referred > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.cancelled > span[b-ljok4eb3st] { background:#b54d43; }
.status-overview-card.month > span[b-ljok4eb3st] { background:#73569b; }

.service-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-ljok4eb3st] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-ljok4eb3st] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-ljok4eb3st] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-ljok4eb3st],
.service-unit-cell[b-ljok4eb3st],
.provider-location-cell[b-ljok4eb3st],
.result-cell[b-ljok4eb3st],
.follow-score-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-ljok4eb3st],
.result-cell[b-ljok4eb3st] {
    min-width:230px;
}

.history-date-cell strong[b-ljok4eb3st],
.service-unit-cell strong[b-ljok4eb3st],
.provider-location-cell strong[b-ljok4eb3st],
.result-cell strong[b-ljok4eb3st],
.follow-score-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-ljok4eb3st],
.service-unit-cell small[b-ljok4eb3st],
.provider-location-cell small[b-ljok4eb3st],
.result-cell small[b-ljok4eb3st],
.follow-score-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-ljok4eb3st],
.provider-location-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.referred[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-ljok4eb3st] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-ljok4eb3st] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-ljok4eb3st] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-ljok4eb3st] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-ljok4eb3st] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-ljok4eb3st] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-ljok4eb3st] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-ljok4eb3st],
.source-actions button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-ljok4eb3st] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-ljok4eb3st] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-ljok4eb3st] {
    min-height:180px;
}

.source-photo-card img[b-ljok4eb3st] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-ljok4eb3st] {
    margin-top:18px;
}

.vital-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-ljok4eb3st],
.quality-grid > div[b-ljok4eb3st],
.follow-up-grid > div[b-ljok4eb3st] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-ljok4eb3st],
.quality-grid span[b-ljok4eb3st],
.follow-up-grid span[b-ljok4eb3st] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-ljok4eb3st],
.quality-grid strong[b-ljok4eb3st],
.follow-up-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-ljok4eb3st] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-ljok4eb3st],
.quality-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:.94rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:.92rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-ljok4eb3st] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-ljok4eb3st] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-ljok4eb3st] { background:rgba(104,120,114,.89); }

.view-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-ljok4eb3st],
    .service-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-ljok4eb3st],
    .vital-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-ljok4eb3st] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-ljok4eb3st],
    .quality-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-ljok4eb3st],
    .service-overview[b-ljok4eb3st],
    .care-metrics[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .source-photo-grid[b-ljok4eb3st],
    .vital-grid[b-ljok4eb3st],
    .follow-up-grid[b-ljok4eb3st],
    .quality-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-ljok4eb3st] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.follow-up > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.referred > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.overdue > span[b-ljok4eb3st] { background:#b54d43; }
.status-overview-card.inactive > span[b-ljok4eb3st] { background:#687872; }

.risk-overview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-ljok4eb3st],
.risk-overview-card.selected[b-ljok4eb3st] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-ljok4eb3st] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-ljok4eb3st] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-ljok4eb3st],
.care-metrics strong[b-ljok4eb3st] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-ljok4eb3st],
.care-metrics small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-ljok4eb3st] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-ljok4eb3st],
.risk-adl-cell[b-ljok4eb3st],
.dependency-living-cell[b-ljok4eb3st],
.caregiver-cell[b-ljok4eb3st],
.follow-up-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-ljok4eb3st] {
    min-width:190px;
}

.register-age-cell strong[b-ljok4eb3st],
.risk-adl-cell strong[b-ljok4eb3st],
.dependency-living-cell strong[b-ljok4eb3st],
.caregiver-cell strong[b-ljok4eb3st],
.follow-up-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-ljok4eb3st],
.risk-adl-cell small[b-ljok4eb3st],
.dependency-living-cell small[b-ljok4eb3st],
.caregiver-cell small[b-ljok4eb3st],
.follow-up-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-ljok4eb3st],
.caregiver-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-ljok4eb3st],
.dependency-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st],
.identity-chip[b-ljok4eb3st],
.overdue-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.risk-chip.high[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.active[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.referred[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.overdue-chip[b-ljok4eb3st] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-ljok4eb3st] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-ljok4eb3st] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-ljok4eb3st] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-ljok4eb3st] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-ljok4eb3st] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-ljok4eb3st] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-ljok4eb3st] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-ljok4eb3st],
.source-actions button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-ljok4eb3st] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-ljok4eb3st] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-ljok4eb3st] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-ljok4eb3st],
.reference-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-ljok4eb3st],
.reference-grid > div[b-ljok4eb3st],
.care-plan-grid > div[b-ljok4eb3st] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-ljok4eb3st],
.reference-grid span[b-ljok4eb3st],
.care-plan-grid span[b-ljok4eb3st] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-ljok4eb3st],
.reference-grid strong[b-ljok4eb3st],
.care-plan-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-ljok4eb3st] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:.96rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:.94rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-ljok4eb3st] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-ljok4eb3st] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-ljok4eb3st] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-ljok4eb3st] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-ljok4eb3st] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-ljok4eb3st] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-ljok4eb3st],
    .assessment-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-ljok4eb3st],
    .risk-overview[b-ljok4eb3st],
    .dependency-grid[b-ljok4eb3st],
    .care-metrics[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .assessment-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .care-plan-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.disbursement-page[b-ljok4eb3st] {
    font-size:16.5px;
    line-height:1.62;
}

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-ljok4eb3st] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-ljok4eb3st] { background:#73569b; }
.status-overview-card.field > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.completed > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.follow-up > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.referred > span[b-ljok4eb3st] { background:#b55b82; }

.visit-type-overview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-ljok4eb3st],
.visit-type-overview-card.selected[b-ljok4eb3st] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-ljok4eb3st] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-ljok4eb3st] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-ljok4eb3st] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-ljok4eb3st] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-ljok4eb3st] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-ljok4eb3st] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-ljok4eb3st],
.care-metrics strong[b-ljok4eb3st] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-ljok4eb3st],
.care-metrics small[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-ljok4eb3st],
.visit-type-cell[b-ljok4eb3st],
.team-location-cell[b-ljok4eb3st],
.result-cell[b-ljok4eb3st],
.follow-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-ljok4eb3st],
.result-cell[b-ljok4eb3st] {
    min-width:230px;
}

.visit-date-cell strong[b-ljok4eb3st],
.visit-type-cell strong[b-ljok4eb3st],
.team-location-cell strong[b-ljok4eb3st],
.result-cell strong[b-ljok4eb3st],
.follow-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-ljok4eb3st],
.visit-type-cell small[b-ljok4eb3st],
.team-location-cell small[b-ljok4eb3st],
.result-cell small[b-ljok4eb3st],
.follow-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-ljok4eb3st],
.team-location-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st],
.identity-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.referred[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.priority-text[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-ljok4eb3st] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-ljok4eb3st] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-ljok4eb3st] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-ljok4eb3st] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-ljok4eb3st] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-ljok4eb3st] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-ljok4eb3st] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-ljok4eb3st] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-ljok4eb3st] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-ljok4eb3st] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-ljok4eb3st] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-ljok4eb3st] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-ljok4eb3st] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-ljok4eb3st],
.reference-grid > div[b-ljok4eb3st] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-ljok4eb3st],
.reference-grid span[b-ljok4eb3st] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-ljok4eb3st],
.reference-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:1rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:.98rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-ljok4eb3st],
    .visit-type-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-ljok4eb3st],
    .visit-type-overview[b-ljok4eb3st],
    .target-grid[b-ljok4eb3st],
    .care-metrics[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .vital-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.disbursement-page[b-ljok4eb3st] {
    font-size:17px;
    line-height:1.65;
}

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-ljok4eb3st] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.review > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.eligible > span[b-ljok4eb3st] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.paid > span[b-ljok4eb3st] { background:#73569b; }

.type-overview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-ljok4eb3st],
.type-overview-card.selected[b-ljok4eb3st] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-ljok4eb3st] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-ljok4eb3st] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-ljok4eb3st] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-ljok4eb3st] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-ljok4eb3st] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-ljok4eb3st],
.target-grid button[b-ljok4eb3st] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-ljok4eb3st],
.welfare-type-cell[b-ljok4eb3st],
.household-cell[b-ljok4eb3st],
.amount-cell[b-ljok4eb3st],
.officer-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-ljok4eb3st],
.officer-cell[b-ljok4eb3st] {
    min-width:210px;
}

.application-no-cell strong[b-ljok4eb3st],
.welfare-type-cell strong[b-ljok4eb3st],
.household-cell strong[b-ljok4eb3st],
.amount-cell strong[b-ljok4eb3st],
.officer-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-ljok4eb3st],
.welfare-type-cell small[b-ljok4eb3st],
.household-cell small[b-ljok4eb3st],
.amount-cell small[b-ljok4eb3st],
.officer-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-ljok4eb3st],
.household-cell em[b-ljok4eb3st],
.amount-cell em[b-ljok4eb3st],
.officer-cell em[b-ljok4eb3st],
.citizen-photo-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st],
.source-group-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.source-group-chip[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-ljok4eb3st] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-ljok4eb3st],
.amount-preview[b-ljok4eb3st] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-ljok4eb3st] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-ljok4eb3st] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-ljok4eb3st],
.amount-preview > div[b-ljok4eb3st] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-ljok4eb3st],
.amount-preview small[b-ljok4eb3st] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-ljok4eb3st] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-ljok4eb3st],
.amount-preview strong[b-ljok4eb3st] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-ljok4eb3st],
.amount-preview span[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-ljok4eb3st] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-ljok4eb3st],
.amount-document-grid small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-ljok4eb3st] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-ljok4eb3st] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-ljok4eb3st] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:1.02rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:1rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-ljok4eb3st] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-ljok4eb3st],
    .type-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-ljok4eb3st],
    .amount-document-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-ljok4eb3st],
    .type-overview[b-ljok4eb3st],
    .budget-grid[b-ljok4eb3st],
    .target-grid[b-ljok4eb3st],
    .care-metrics[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .assessment-preview[b-ljok4eb3st],
    .amount-preview[b-ljok4eb3st],
    .amount-document-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.disbursement-page[b-ljok4eb3st] {
    font-size:17px;
    line-height:1.66;
}

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-ljok4eb3st] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-ljok4eb3st] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-ljok4eb3st] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-ljok4eb3st] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.payment > span[b-ljok4eb3st] { background:#b54d43; }
.status-overview-card.suspended > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.expiring > span[b-ljok4eb3st] { background:#73569b; }

.target-overview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-ljok4eb3st],
.target-overview-card.selected[b-ljok4eb3st] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-ljok4eb3st] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-ljok4eb3st] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-ljok4eb3st] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-ljok4eb3st] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-ljok4eb3st] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-ljok4eb3st] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-ljok4eb3st],
.follow-grid button[b-ljok4eb3st] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-ljok4eb3st] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-ljok4eb3st] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-ljok4eb3st],
.benefit-cell[b-ljok4eb3st],
.period-cell[b-ljok4eb3st],
.amount-cell[b-ljok4eb3st],
.payment-cycle-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-ljok4eb3st] {
    min-width:225px;
}

.registry-cell strong[b-ljok4eb3st],
.benefit-cell strong[b-ljok4eb3st],
.period-cell strong[b-ljok4eb3st],
.amount-cell strong[b-ljok4eb3st],
.payment-cycle-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-ljok4eb3st],
.benefit-cell small[b-ljok4eb3st],
.period-cell small[b-ljok4eb3st],
.amount-cell small[b-ljok4eb3st],
.payment-cycle-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-ljok4eb3st],
.period-cell em[b-ljok4eb3st],
.amount-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-ljok4eb3st],
.cycle-chip[b-ljok4eb3st],
.verify-chip[b-ljok4eb3st],
.status-chip[b-ljok4eb3st],
.source-group-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-ljok4eb3st] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.expired[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.source-group-chip[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-ljok4eb3st] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-ljok4eb3st] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-ljok4eb3st] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-ljok4eb3st] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-ljok4eb3st] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-ljok4eb3st] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:1.02rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:1rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-ljok4eb3st] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-ljok4eb3st] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-ljok4eb3st] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-ljok4eb3st],
    .target-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-ljok4eb3st],
    .target-overview[b-ljok4eb3st],
    .amount-metrics[b-ljok4eb3st],
    .follow-grid[b-ljok4eb3st],
    .condition-switch-grid[b-ljok4eb3st],
    .amount-preview[b-ljok4eb3st],
    .source-data-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .amount-document-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .patient-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.disbursement-page[b-ljok4eb3st] {
    font-size:17px;
    line-height:1.66;
}

.disbursement-hero[b-ljok4eb3st] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-ljok4eb3st] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-ljok4eb3st] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-ljok4eb3st] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-ljok4eb3st] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-ljok4eb3st] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-ljok4eb3st] { background:#687872; }
.status-overview-card.approval > span[b-ljok4eb3st] { background:#987634; }
.status-overview-card.processing > span[b-ljok4eb3st] { background:#2f789f; }
.status-overview-card.paid > span[b-ljok4eb3st] { background:#34734b; }
.status-overview-card.failed > span[b-ljok4eb3st] { background:#b54d43; }

.disbursement-progress[b-ljok4eb3st] {
    margin-top:15px;
}

.disbursement-progress > div[b-ljok4eb3st] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-ljok4eb3st] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-ljok4eb3st],
.amount-cell[b-ljok4eb3st],
.progress-cell[b-ljok4eb3st],
.date-cell[b-ljok4eb3st],
.control-cell[b-ljok4eb3st],
.status-cell[b-ljok4eb3st] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-ljok4eb3st] {
    min-width:245px;
}

.batch-cell strong[b-ljok4eb3st],
.amount-cell strong[b-ljok4eb3st],
.progress-cell strong[b-ljok4eb3st],
.date-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-ljok4eb3st],
.amount-cell small[b-ljok4eb3st],
.progress-cell small[b-ljok4eb3st],
.date-cell small[b-ljok4eb3st],
.status-cell small[b-ljok4eb3st] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-ljok4eb3st],
.amount-cell em[b-ljok4eb3st],
.date-cell em[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-ljok4eb3st] {
    min-width:180px;
}

.recipient-stack[b-ljok4eb3st] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-ljok4eb3st],
.recipient-stack span[b-ljok4eb3st] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-ljok4eb3st] {
    margin-left:0;
}

.recipient-stack img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-ljok4eb3st] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-ljok4eb3st] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-ljok4eb3st] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-ljok4eb3st],
.approval-chip[b-ljok4eb3st],
.reconcile-chip[b-ljok4eb3st],
.cycle-chip[b-ljok4eb3st],
.line-status-chip[b-ljok4eb3st] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.status-chip.approved[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-ljok4eb3st] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-ljok4eb3st] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-ljok4eb3st] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-ljok4eb3st] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-ljok4eb3st] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-ljok4eb3st] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-ljok4eb3st] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-ljok4eb3st] { color:#687872; background:#edf1ef; }

.control-cell[b-ljok4eb3st] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-ljok4eb3st] {
    align-items:center;
}

.selection-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-ljok4eb3st] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-ljok4eb3st] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-ljok4eb3st] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-ljok4eb3st] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-ljok4eb3st] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-ljok4eb3st] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-ljok4eb3st],
.source-selection-table td[b-ljok4eb3st] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-ljok4eb3st] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-ljok4eb3st] {
    background:#f0faf6;
}

.source-person-cell[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-ljok4eb3st] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-ljok4eb3st],
.source-benefit-cell strong[b-ljok4eb3st] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-ljok4eb3st],
.source-benefit-cell small[b-ljok4eb3st],
.source-date[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-ljok4eb3st] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-ljok4eb3st] {
    min-width:190px;
}

.source-amount[b-ljok4eb3st] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-ljok4eb3st] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-ljok4eb3st] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-ljok4eb3st] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-ljok4eb3st] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-ljok4eb3st] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-ljok4eb3st] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-ljok4eb3st] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-ljok4eb3st] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-ljok4eb3st] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-ljok4eb3st] {
    font-size:3.5rem;
}

.batch-overview-content small[b-ljok4eb3st] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-ljok4eb3st] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-ljok4eb3st] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-ljok4eb3st] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-ljok4eb3st] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-ljok4eb3st] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-ljok4eb3st],
.print-line-table td[b-ljok4eb3st] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-ljok4eb3st] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-ljok4eb3st],
.print-line-table td small[b-ljok4eb3st] {
    display:block;
}

.print-line-table td small[b-ljok4eb3st] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-ljok4eb3st] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-ljok4eb3st] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-ljok4eb3st] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-ljok4eb3st] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-ljok4eb3st] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-ljok4eb3st] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-ljok4eb3st] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-ljok4eb3st] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-ljok4eb3st] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-ljok4eb3st] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-ljok4eb3st] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-ljok4eb3st] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-ljok4eb3st] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-ljok4eb3st] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-ljok4eb3st] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-ljok4eb3st] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-ljok4eb3st] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-ljok4eb3st] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-ljok4eb3st] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-ljok4eb3st] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-ljok4eb3st] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.disbursement-page[b-ljok4eb3st]  .mud-input,
.disbursement-page[b-ljok4eb3st]  .mud-select-input {
    font-size:1.02rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-list-item-text {
    font-size:1rem !important;
}

.disbursement-page[b-ljok4eb3st]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-ljok4eb3st] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-ljok4eb3st] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-ljok4eb3st] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-ljok4eb3st] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-ljok4eb3st] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-ljok4eb3st],
    .recipient-detail-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-ljok4eb3st] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-ljok4eb3st] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-ljok4eb3st] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-ljok4eb3st],
    .amount-metrics[b-ljok4eb3st],
    .follow-grid[b-ljok4eb3st],
    .source-selection-summary[b-ljok4eb3st],
    .amount-preview[b-ljok4eb3st],
    .recipient-detail-grid[b-ljok4eb3st],
    .reference-grid[b-ljok4eb3st],
    .amount-document-grid[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-ljok4eb3st] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-ljok4eb3st] {
        overflow-x:auto;
    }

    .source-selection-table[b-ljok4eb3st] {
        min-width:1050px;
    }

    .batch-overview-panel[b-ljok4eb3st],
    .recipient-detail-card[b-ljok4eb3st] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-ljok4eb3st] {
        width:100%;
        height:190px;
    }

    .disbursement-page[b-ljok4eb3st]  .disbursement-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #disbursement-profile-print-area[b-ljok4eb3st],
    #disbursement-profile-print-area *[b-ljok4eb3st] {
        visibility:visible !important;
    }

    #disbursement-profile-print-area[b-ljok4eb3st] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .disbursement-view-modal[b-ljok4eb3st] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-ljok4eb3st],
    .document-status-strip[b-ljok4eb3st],
    .batch-overview-panel[b-ljok4eb3st],
    .document-section[b-ljok4eb3st],
    .document-footer[b-ljok4eb3st] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/05Environment/GreenSpaces.razor.rz.scp.css */
:root[b-sai5nd4i37] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.green-page[b-sai5nd4i37] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.green-page[b-sai5nd4i37]  .green-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.green-hero[b-sai5nd4i37] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-sai5nd4i37] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-sai5nd4i37] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-sai5nd4i37],
.hero-action-panel[b-sai5nd4i37] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-sai5nd4i37] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-sai5nd4i37] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-sai5nd4i37] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-sai5nd4i37] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-sai5nd4i37] {
    margin-top: 3px;
    font-size: .94rem;
}

.green-hero h1[b-sai5nd4i37] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.green-hero p[b-sai5nd4i37] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-sai5nd4i37] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-sai5nd4i37] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-sai5nd4i37] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-sai5nd4i37] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-sai5nd4i37] {
    font-size: .85rem;
}

.hero-status small[b-sai5nd4i37] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.green-page[b-sai5nd4i37]  .hero-add-button,
.green-page[b-sai5nd4i37]  .toolbar-add-button,
.green-page[b-sai5nd4i37]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.green-page[b-sai5nd4i37]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-sai5nd4i37],
.hero-refresh-button[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-sai5nd4i37] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-sai5nd4i37] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-sai5nd4i37] {
    opacity: .55;
    cursor: wait;
}

.green-page[b-sai5nd4i37]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.green-page[b-sai5nd4i37]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-sai5nd4i37] {
    margin-top: 2px !important;
}

.summary-card[b-sai5nd4i37] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-sai5nd4i37] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-sai5nd4i37] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-sai5nd4i37] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-sai5nd4i37] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-sai5nd4i37] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-sai5nd4i37] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-sai5nd4i37] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-sai5nd4i37] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-sai5nd4i37] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-sai5nd4i37] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-sai5nd4i37] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-sai5nd4i37] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-sai5nd4i37],
.status-overview-card.selected[b-sai5nd4i37] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-sai5nd4i37] {
    background: #f5faf7;
}

.status-overview-card > span[b-sai5nd4i37] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-sai5nd4i37] { background:#687872; }
.status-overview-card.reviewing > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.difference > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.approved > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.closed > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.voided > span[b-sai5nd4i37] { background:#687872; }
.status-overview-card.today > span[b-sai5nd4i37] { background:#73569b; }

.status-overview-card div[b-sai5nd4i37] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-sai5nd4i37] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-sai5nd4i37] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-sai5nd4i37] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-sai5nd4i37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-sai5nd4i37] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-sai5nd4i37] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-sai5nd4i37] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-sai5nd4i37] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-sai5nd4i37] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-sai5nd4i37] {
    margin-top: 13px;
}

.progress-track[b-sai5nd4i37] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-sai5nd4i37] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-sai5nd4i37] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-sai5nd4i37] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-sai5nd4i37] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-sai5nd4i37],
.green-list-panel[b-sai5nd4i37] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-sai5nd4i37] {
    padding: 15px;
}

.filter-heading[b-sai5nd4i37],
.list-toolbar[b-sai5nd4i37] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-sai5nd4i37],
.panel-kicker[b-sai5nd4i37] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-sai5nd4i37],
.list-toolbar h2[b-sai5nd4i37] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-sai5nd4i37],
.list-toolbar p[b-sai5nd4i37] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-sai5nd4i37] {
    margin-top: 8px !important;
}

.green-page[b-sai5nd4i37]  .premium-field,
.green-page[b-sai5nd4i37]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.green-page[b-sai5nd4i37]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-sai5nd4i37] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-sai5nd4i37] {
    color: var(--theme-primary);
}

.green-list-panel[b-sai5nd4i37] {
    overflow: hidden;
}

.list-toolbar[b-sai5nd4i37] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.green-page[b-sai5nd4i37]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-sai5nd4i37] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-sai5nd4i37] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-sai5nd4i37] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-sai5nd4i37] {
    margin: 0;
    font-size: .84rem;
}

.green-page[b-sai5nd4i37]  .green-table {
    font-family: 'Kanit',sans-serif;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head {
    background: #f1f7f4;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-sai5nd4i37] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-sai5nd4i37] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-sai5nd4i37] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-sai5nd4i37] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-sai5nd4i37],
.counter-cashier-cell[b-sai5nd4i37],
.money-cell[b-sai5nd4i37],
.difference-cell[b-sai5nd4i37],
.transaction-status-cell[b-sai5nd4i37] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-sai5nd4i37] {
    min-width: 175px;
}

.date-shift-cell strong[b-sai5nd4i37],
.counter-cashier-cell strong[b-sai5nd4i37],
.money-cell strong[b-sai5nd4i37],
.difference-cell strong[b-sai5nd4i37],
.transaction-status-cell strong[b-sai5nd4i37] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-sai5nd4i37],
.counter-cashier-cell small[b-sai5nd4i37],
.money-cell small[b-sai5nd4i37],
.difference-cell small[b-sai5nd4i37] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-sai5nd4i37],
.counter-cashier-cell em[b-sai5nd4i37] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-sai5nd4i37] { color:var(--theme-primary); }
.money-cell.actual strong[b-sai5nd4i37] { color:#2f789f; }

.difference-cell.matched strong[b-sai5nd4i37] { color:#34734b; }
.difference-cell.over strong[b-sai5nd4i37] { color:#987634; }
.difference-cell.short strong[b-sai5nd4i37] { color:#b54d43; }

.status-chip[b-sai5nd4i37],
.match-chip[b-sai5nd4i37] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-sai5nd4i37] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.difference[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-sai5nd4i37] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-sai5nd4i37] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.green-page[b-sai5nd4i37]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.green-page[b-sai5nd4i37]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.green-page[b-sai5nd4i37]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.green-page[b-sai5nd4i37]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.green-page[b-sai5nd4i37]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-sai5nd4i37] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-sai5nd4i37] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-sai5nd4i37],
.image-preview-backdrop[b-sai5nd4i37] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.green-form-modal[b-sai5nd4i37],
.green-view-modal[b-sai5nd4i37],
.delete-modal[b-sai5nd4i37],
.image-preview-modal[b-sai5nd4i37] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-sai5nd4i37],
.view-toolbar[b-sai5nd4i37],
.image-preview-header[b-sai5nd4i37] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-sai5nd4i37] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-sai5nd4i37] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-sai5nd4i37],
.view-toolbar small[b-sai5nd4i37],
.image-preview-header small[b-sai5nd4i37] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-sai5nd4i37],
.view-toolbar h2[b-sai5nd4i37],
.image-preview-header h3[b-sai5nd4i37] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-sai5nd4i37] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-sai5nd4i37],
.view-scroll[b-sai5nd4i37] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-sai5nd4i37] {
    background: #e9efec;
}

.modal-footer[b-sai5nd4i37] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.green-page[b-sai5nd4i37]  .cancel-button,
.green-page[b-sai5nd4i37]  .save-button,
.green-page[b-sai5nd4i37]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-sai5nd4i37] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-sai5nd4i37] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-sai5nd4i37] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-sai5nd4i37] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-sai5nd4i37],
.calculation-heading[b-sai5nd4i37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-sai5nd4i37],
.calculation-heading small[b-sai5nd4i37] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-sai5nd4i37],
.calculation-heading h3[b-sai5nd4i37] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-sai5nd4i37],
.calculation-heading > span[b-sai5nd4i37] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-sai5nd4i37] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-sai5nd4i37] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-sai5nd4i37] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-sai5nd4i37] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-sai5nd4i37] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-sai5nd4i37] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-sai5nd4i37] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-sai5nd4i37] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-sai5nd4i37] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-sai5nd4i37] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-sai5nd4i37] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-sai5nd4i37],
.calculation-grid .short strong[b-sai5nd4i37],
.calculation-grid .short small[b-sai5nd4i37] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-sai5nd4i37] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-sai5nd4i37] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-sai5nd4i37] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-sai5nd4i37] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-sai5nd4i37] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-sai5nd4i37] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-sai5nd4i37] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-sai5nd4i37] {
    font-size:.84rem;
}

.photo-upload-actions[b-sai5nd4i37] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-sai5nd4i37],
.remove-photo-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-sai5nd4i37] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-sai5nd4i37] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-sai5nd4i37] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-sai5nd4i37],
.detail-transaction-table[b-sai5nd4i37] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-sai5nd4i37],
.source-transaction-row[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-sai5nd4i37] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-sai5nd4i37],
.source-transaction-row > span[b-sai5nd4i37] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-sai5nd4i37] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-sai5nd4i37] {
    border-bottom:0;
}

.mini-photo-button[b-sai5nd4i37] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-sai5nd4i37],
.source-transaction-more[b-sai5nd4i37] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-sai5nd4i37] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.green-view-modal[b-sai5nd4i37] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.green-page[b-sai5nd4i37]  .view-edit-button,
.green-page[b-sai5nd4i37]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.green-page[b-sai5nd4i37]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-green-profile[b-sai5nd4i37] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-sai5nd4i37] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-sai5nd4i37] {
    text-align:center;
}

.document-organization small[b-sai5nd4i37] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-sai5nd4i37] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-sai5nd4i37] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-sai5nd4i37] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-sai5nd4i37],
.document-number-box small[b-sai5nd4i37] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-sai5nd4i37] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-sai5nd4i37] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-sai5nd4i37] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-sai5nd4i37] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-sai5nd4i37] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-sai5nd4i37] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-sai5nd4i37],
.transaction-summary-section[b-sai5nd4i37],
.source-transaction-section[b-sai5nd4i37],
.review-section[b-sai5nd4i37] {
    margin-top:16px;
}

.section-title[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-sai5nd4i37] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-sai5nd4i37] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-sai5nd4i37] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-sai5nd4i37] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-sai5nd4i37],
.comparison-row[b-sai5nd4i37],
.comparison-total[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-sai5nd4i37] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-sai5nd4i37],
.comparison-row span[b-sai5nd4i37],
.comparison-total span[b-sai5nd4i37] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-sai5nd4i37] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-sai5nd4i37],
.comparison-total span:not(:first-child)[b-sai5nd4i37] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-sai5nd4i37] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-sai5nd4i37] { color:#34734b; }
.difference-text.over[b-sai5nd4i37] { color:#987634; }
.difference-text.short[b-sai5nd4i37] { color:#b54d43; }

.transaction-summary-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-sai5nd4i37] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-sai5nd4i37] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-sai5nd4i37] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-sai5nd4i37] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-sai5nd4i37] { background:#f4fafc; }

.transaction-summary-grid span[b-sai5nd4i37] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-sai5nd4i37] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-sai5nd4i37],
.detail-transaction-row[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-sai5nd4i37] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-sai5nd4i37],
.detail-transaction-row span[b-sai5nd4i37] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-sai5nd4i37] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-sai5nd4i37] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-sai5nd4i37] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-sai5nd4i37] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-sai5nd4i37] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-sai5nd4i37] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-sai5nd4i37] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-sai5nd4i37] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-sai5nd4i37],
.attachment-panel[b-sai5nd4i37] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-sai5nd4i37] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-sai5nd4i37] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-sai5nd4i37] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-sai5nd4i37] {
    display:grid;
    gap:7px;
}

.history-item[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-sai5nd4i37] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-sai5nd4i37] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-sai5nd4i37] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-sai5nd4i37],
.history-item em[b-sai5nd4i37] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-sai5nd4i37] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-sai5nd4i37] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-sai5nd4i37] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-sai5nd4i37] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-sai5nd4i37] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-sai5nd4i37] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-sai5nd4i37] { background:rgba(52,115,75,.89); }

.attachment-empty[b-sai5nd4i37] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-sai5nd4i37] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-sai5nd4i37] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-sai5nd4i37] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-sai5nd4i37] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-sai5nd4i37] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-sai5nd4i37] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-sai5nd4i37] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-sai5nd4i37] {
    color:#b54d43;
}

.delete-warning[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-sai5nd4i37] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.green-page[b-sai5nd4i37]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .green-hero[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-sai5nd4i37] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-sai5nd4i37] {
        grid-column:1 / -1;
    }

    .document-header[b-sai5nd4i37] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-sai5nd4i37] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .green-page[b-sai5nd4i37] {
        padding-top:10px;
    }

    .green-page[b-sai5nd4i37]  .green-container {
        padding-inline:10px !important;
    }

    .green-hero[b-sai5nd4i37] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-sai5nd4i37],
    .list-toolbar[b-sai5nd4i37],
    .source-summary-heading[b-sai5nd4i37],
    .calculation-heading[b-sai5nd4i37],
    .view-toolbar[b-sai5nd4i37],
    .section-heading[b-sai5nd4i37] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-sai5nd4i37],
    .variance-grid[b-sai5nd4i37],
    .progress-metrics[b-sai5nd4i37],
    .source-summary-grid[b-sai5nd4i37],
    .system-amount-grid[b-sai5nd4i37],
    .calculation-grid[b-sai5nd4i37],
    .photo-upload-grid[b-sai5nd4i37],
    .transaction-summary-grid[b-sai5nd4i37],
    .review-grid[b-sai5nd4i37],
    .review-note-grid[b-sai5nd4i37],
    .attachment-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-sai5nd4i37] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-sai5nd4i37] {
        width:100%;
    }

    .print-green-profile[b-sai5nd4i37] {
        padding:22px 18px;
    }

    .document-footer[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-sai5nd4i37] {
        grid-column:auto;
    }

    .status-overview[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-sai5nd4i37] {
        width:100%;
    }

    .document-header[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-sai5nd4i37] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-sai5nd4i37] {
        visibility:hidden !important;
    }

    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-sai5nd4i37] {
        display:none !important;
    }

    .modal-backdrop[b-sai5nd4i37],
    .green-view-modal[b-sai5nd4i37],
    .view-scroll[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .scope-panel[b-sai5nd4i37],
    .amount-comparison-section[b-sai5nd4i37],
    .transaction-summary-section[b-sai5nd4i37],
    .source-transaction-section[b-sai5nd4i37],
    .review-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }

    .mock-document-label[b-sai5nd4i37] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-sai5nd4i37] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.green-page[b-sai5nd4i37]  .hero-add-button,
.green-page[b-sai5nd4i37]  .toolbar-add-button,
.green-page[b-sai5nd4i37]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-sai5nd4i37] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.confirmed > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.checked-in > span[b-sai5nd4i37] { background:#73569b; }
.status-overview-card.in-service > span[b-sai5nd4i37] { background:#c46a2b; }
.status-overview-card.completed > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.cancelled > span[b-sai5nd4i37] { background:#b54d43; }

.service-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-sai5nd4i37],
.service-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-sai5nd4i37] {
    background:#f4faf7;
}

.service-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-sai5nd4i37] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-sai5nd4i37] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-sai5nd4i37] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-sai5nd4i37] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-sai5nd4i37],
.service-unit-cell[b-sai5nd4i37],
.provider-location-cell[b-sai5nd4i37],
.queue-priority-cell[b-sai5nd4i37],
.reason-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-sai5nd4i37],
.reason-cell[b-sai5nd4i37] {
    min-width:180px;
}

.appointment-time-cell strong[b-sai5nd4i37],
.service-unit-cell strong[b-sai5nd4i37],
.provider-location-cell strong[b-sai5nd4i37],
.queue-priority-cell strong[b-sai5nd4i37],
.reason-cell strong[b-sai5nd4i37] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-sai5nd4i37],
.service-unit-cell small[b-sai5nd4i37],
.provider-location-cell small[b-sai5nd4i37],
.queue-priority-cell small[b-sai5nd4i37],
.reason-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-sai5nd4i37],
.provider-location-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-sai5nd4i37],
.priority-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-sai5nd4i37] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-sai5nd4i37] { color:#987634; background:#fff4df; }

.priority-chip[b-sai5nd4i37] {
    margin-top:5px;
}

.priority-chip.normal[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-sai5nd4i37] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-sai5nd4i37] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-sai5nd4i37] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-sai5nd4i37] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-sai5nd4i37] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-sai5nd4i37],
.identity-chip.not-found[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-sai5nd4i37] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-sai5nd4i37],
.citizen-source-actions a[b-sai5nd4i37] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-sai5nd4i37] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-sai5nd4i37] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-sai5nd4i37] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-sai5nd4i37] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-sai5nd4i37] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-sai5nd4i37] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-sai5nd4i37] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-sai5nd4i37] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-sai5nd4i37] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-sai5nd4i37] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-sai5nd4i37] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-sai5nd4i37] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-sai5nd4i37] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-sai5nd4i37],
.identity-box small[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-sai5nd4i37] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-sai5nd4i37],
.reason-section[b-sai5nd4i37],
.reminder-section[b-sai5nd4i37] {
    margin-top:16px;
}

.reference-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-sai5nd4i37] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-sai5nd4i37],
.timeline-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-sai5nd4i37],
.timeline-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-sai5nd4i37] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-sai5nd4i37] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-sai5nd4i37] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-sai5nd4i37] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-sai5nd4i37] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-sai5nd4i37] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-sai5nd4i37],
    .preview-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-sai5nd4i37] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-sai5nd4i37] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-sai5nd4i37] {
        grid-column:1 / -1;
    }

    .reference-grid[b-sai5nd4i37],
    .timeline-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-sai5nd4i37],
    .focus-grid[b-sai5nd4i37],
    .citizen-source-grid[b-sai5nd4i37],
    .preview-grid[b-sai5nd4i37],
    .consent-grid[b-sai5nd4i37],
    .source-photo-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .note-grid[b-sai5nd4i37],
    .timeline-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-sai5nd4i37] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-sai5nd4i37] {
        margin:0 auto;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .service-section[b-sai5nd4i37],
    .reason-section[b-sai5nd4i37],
    .reminder-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size: 16px;
    line-height: 1.55;
}

.green-page[b-sai5nd4i37]  .mud-typography,
.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-input-label,
.green-page[b-sai5nd4i37]  .mud-select,
.green-page[b-sai5nd4i37]  .mud-list-item-text,
.green-page[b-sai5nd4i37]  .mud-button-label,
.green-page[b-sai5nd4i37]  .mud-table-cell,
.green-page[b-sai5nd4i37]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size: .92rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size: .90rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-sai5nd4i37] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-sai5nd4i37] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-sai5nd4i37] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-sai5nd4i37] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-sai5nd4i37] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-sai5nd4i37] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-sai5nd4i37] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-sai5nd4i37] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-sai5nd4i37],
.green-list-panel[b-sai5nd4i37],
.insight-panel[b-sai5nd4i37] {
    border-radius: 20px;
}

.filter-panel[b-sai5nd4i37] {
    padding: 20px;
}

.list-toolbar[b-sai5nd4i37] {
    padding: 19px 20px;
}

.filter-heading p[b-sai5nd4i37],
.list-toolbar p[b-sai5nd4i37] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-sai5nd4i37] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-sai5nd4i37] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-sai5nd4i37],
.service-unit-cell[b-sai5nd4i37],
.provider-location-cell[b-sai5nd4i37],
.queue-priority-cell[b-sai5nd4i37],
.reason-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    min-width: 155px;
}

.provider-location-cell[b-sai5nd4i37],
.reason-cell[b-sai5nd4i37] {
    min-width: 215px;
}

.service-chip[b-sai5nd4i37],
.priority-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.identity-chip[b-sai5nd4i37] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-sai5nd4i37] {
    min-width: 205px;
    gap: 7px;
}

.green-page[b-sai5nd4i37]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-sai5nd4i37] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-sai5nd4i37],
.view-toolbar[b-sai5nd4i37],
.image-preview-header[b-sai5nd4i37] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-sai5nd4i37],
.view-scroll[b-sai5nd4i37] {
    padding: 20px;
}

.modal-footer[b-sai5nd4i37] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-sai5nd4i37] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-sai5nd4i37] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-sai5nd4i37],
.preview-grid > div[b-sai5nd4i37],
.reference-grid > div[b-sai5nd4i37],
.timeline-grid > div[b-sai5nd4i37] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-sai5nd4i37] {
    padding: 13px;
}

.photo-preview[b-sai5nd4i37] {
    min-height: 200px;
}

.photo-preview img[b-sai5nd4i37] {
    height: 200px;
}

.history-item[b-sai5nd4i37] {
    padding: 12px;
}

.attachment-card[b-sai5nd4i37],
.attachment-card img[b-sai5nd4i37] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .green-page[b-sai5nd4i37] {
        font-size: 15px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-sai5nd4i37] {
        min-height: 122px;
    }

    .status-overview-card[b-sai5nd4i37],
    .service-overview-card[b-sai5nd4i37] {
        min-height: 82px;
    }

    .modal-body[b-sai5nd4i37],
    .view-scroll[b-sai5nd4i37] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #green-profile-print-area[b-sai5nd4i37] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #green-profile-print-area h1[b-sai5nd4i37] {
        font-size: 18pt !important;
    }

    #green-profile-print-area h2[b-sai5nd4i37] {
        font-size: 14pt !important;
    }

    #green-profile-print-area h3[b-sai5nd4i37] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-sai5nd4i37] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.follow-up > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.referred > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.cancelled > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.month > span[b-sai5nd4i37] { background:#73569b; }

.service-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-sai5nd4i37] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-sai5nd4i37] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-sai5nd4i37],
.service-unit-cell[b-sai5nd4i37],
.provider-location-cell[b-sai5nd4i37],
.result-cell[b-sai5nd4i37],
.follow-score-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-sai5nd4i37],
.result-cell[b-sai5nd4i37] {
    min-width:230px;
}

.history-date-cell strong[b-sai5nd4i37],
.service-unit-cell strong[b-sai5nd4i37],
.provider-location-cell strong[b-sai5nd4i37],
.result-cell strong[b-sai5nd4i37],
.follow-score-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-sai5nd4i37],
.service-unit-cell small[b-sai5nd4i37],
.provider-location-cell small[b-sai5nd4i37],
.result-cell small[b-sai5nd4i37],
.follow-score-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-sai5nd4i37],
.provider-location-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.referred[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-sai5nd4i37] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-sai5nd4i37] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-sai5nd4i37] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-sai5nd4i37] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-sai5nd4i37] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-sai5nd4i37],
.source-actions button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-sai5nd4i37] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-sai5nd4i37] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-sai5nd4i37] {
    min-height:180px;
}

.source-photo-card img[b-sai5nd4i37] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-sai5nd4i37] {
    margin-top:18px;
}

.vital-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-sai5nd4i37],
.quality-grid > div[b-sai5nd4i37],
.follow-up-grid > div[b-sai5nd4i37] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-sai5nd4i37],
.quality-grid span[b-sai5nd4i37],
.follow-up-grid span[b-sai5nd4i37] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-sai5nd4i37],
.quality-grid strong[b-sai5nd4i37],
.follow-up-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-sai5nd4i37] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-sai5nd4i37],
.quality-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:.94rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:.92rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-sai5nd4i37] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-sai5nd4i37] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-sai5nd4i37] { background:rgba(104,120,114,.89); }

.view-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-sai5nd4i37],
    .service-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-sai5nd4i37],
    .vital-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-sai5nd4i37] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-sai5nd4i37],
    .quality-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-sai5nd4i37],
    .service-overview[b-sai5nd4i37],
    .care-metrics[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .source-photo-grid[b-sai5nd4i37],
    .vital-grid[b-sai5nd4i37],
    .follow-up-grid[b-sai5nd4i37],
    .quality-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.follow-up > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.referred > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.overdue > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.inactive > span[b-sai5nd4i37] { background:#687872; }

.risk-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-sai5nd4i37],
.risk-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-sai5nd4i37] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-sai5nd4i37],
.care-metrics strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-sai5nd4i37],
.care-metrics small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-sai5nd4i37] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-sai5nd4i37],
.risk-adl-cell[b-sai5nd4i37],
.dependency-living-cell[b-sai5nd4i37],
.caregiver-cell[b-sai5nd4i37],
.follow-up-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-sai5nd4i37] {
    min-width:190px;
}

.register-age-cell strong[b-sai5nd4i37],
.risk-adl-cell strong[b-sai5nd4i37],
.dependency-living-cell strong[b-sai5nd4i37],
.caregiver-cell strong[b-sai5nd4i37],
.follow-up-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-sai5nd4i37],
.risk-adl-cell small[b-sai5nd4i37],
.dependency-living-cell small[b-sai5nd4i37],
.caregiver-cell small[b-sai5nd4i37],
.follow-up-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-sai5nd4i37],
.caregiver-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-sai5nd4i37],
.dependency-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.identity-chip[b-sai5nd4i37],
.overdue-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.risk-chip.high[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.active[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.referred[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.overdue-chip[b-sai5nd4i37] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-sai5nd4i37] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-sai5nd4i37] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-sai5nd4i37] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-sai5nd4i37] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-sai5nd4i37] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-sai5nd4i37],
.source-actions button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-sai5nd4i37] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-sai5nd4i37] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-sai5nd4i37] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-sai5nd4i37],
.reference-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-sai5nd4i37],
.reference-grid > div[b-sai5nd4i37],
.care-plan-grid > div[b-sai5nd4i37] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-sai5nd4i37],
.reference-grid span[b-sai5nd4i37],
.care-plan-grid span[b-sai5nd4i37] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-sai5nd4i37],
.reference-grid strong[b-sai5nd4i37],
.care-plan-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-sai5nd4i37] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:.96rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:.94rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-sai5nd4i37] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-sai5nd4i37] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-sai5nd4i37] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-sai5nd4i37] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-sai5nd4i37] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-sai5nd4i37] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-sai5nd4i37],
    .assessment-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-sai5nd4i37],
    .risk-overview[b-sai5nd4i37],
    .dependency-grid[b-sai5nd4i37],
    .care-metrics[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .assessment-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .care-plan-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:16.5px;
    line-height:1.62;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-sai5nd4i37] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-sai5nd4i37] { background:#73569b; }
.status-overview-card.field > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.completed > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.follow-up > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.referred > span[b-sai5nd4i37] { background:#b55b82; }

.visit-type-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-sai5nd4i37],
.visit-type-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-sai5nd4i37] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-sai5nd4i37] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-sai5nd4i37],
.care-metrics strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-sai5nd4i37],
.care-metrics small[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-sai5nd4i37],
.visit-type-cell[b-sai5nd4i37],
.team-location-cell[b-sai5nd4i37],
.result-cell[b-sai5nd4i37],
.follow-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-sai5nd4i37],
.result-cell[b-sai5nd4i37] {
    min-width:230px;
}

.visit-date-cell strong[b-sai5nd4i37],
.visit-type-cell strong[b-sai5nd4i37],
.team-location-cell strong[b-sai5nd4i37],
.result-cell strong[b-sai5nd4i37],
.follow-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-sai5nd4i37],
.visit-type-cell small[b-sai5nd4i37],
.team-location-cell small[b-sai5nd4i37],
.result-cell small[b-sai5nd4i37],
.follow-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-sai5nd4i37],
.team-location-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.identity-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.referred[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.priority-text[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-sai5nd4i37] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-sai5nd4i37] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-sai5nd4i37] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-sai5nd4i37] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-sai5nd4i37] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-sai5nd4i37] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-sai5nd4i37] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-sai5nd4i37] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-sai5nd4i37],
.reference-grid > div[b-sai5nd4i37] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-sai5nd4i37],
.reference-grid span[b-sai5nd4i37] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-sai5nd4i37],
.reference-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:.98rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-sai5nd4i37],
    .visit-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-sai5nd4i37],
    .visit-type-overview[b-sai5nd4i37],
    .target-grid[b-sai5nd4i37],
    .care-metrics[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .vital-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.65;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-sai5nd4i37] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.review > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.eligible > span[b-sai5nd4i37] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.paid > span[b-sai5nd4i37] { background:#73569b; }

.type-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-sai5nd4i37],
.type-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-sai5nd4i37] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-sai5nd4i37],
.target-grid button[b-sai5nd4i37] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-sai5nd4i37],
.welfare-type-cell[b-sai5nd4i37],
.household-cell[b-sai5nd4i37],
.amount-cell[b-sai5nd4i37],
.officer-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-sai5nd4i37],
.officer-cell[b-sai5nd4i37] {
    min-width:210px;
}

.application-no-cell strong[b-sai5nd4i37],
.welfare-type-cell strong[b-sai5nd4i37],
.household-cell strong[b-sai5nd4i37],
.amount-cell strong[b-sai5nd4i37],
.officer-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-sai5nd4i37],
.welfare-type-cell small[b-sai5nd4i37],
.household-cell small[b-sai5nd4i37],
.amount-cell small[b-sai5nd4i37],
.officer-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-sai5nd4i37],
.household-cell em[b-sai5nd4i37],
.amount-cell em[b-sai5nd4i37],
.officer-cell em[b-sai5nd4i37],
.citizen-photo-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.source-group-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.source-group-chip[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-sai5nd4i37] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-sai5nd4i37],
.amount-preview[b-sai5nd4i37] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-sai5nd4i37] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-sai5nd4i37] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-sai5nd4i37],
.amount-preview > div[b-sai5nd4i37] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-sai5nd4i37],
.amount-preview small[b-sai5nd4i37] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-sai5nd4i37] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-sai5nd4i37],
.amount-preview strong[b-sai5nd4i37] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-sai5nd4i37],
.amount-preview span[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-sai5nd4i37] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-sai5nd4i37],
.amount-document-grid small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-sai5nd4i37] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-sai5nd4i37] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-sai5nd4i37] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-sai5nd4i37] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-sai5nd4i37],
    .type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .type-overview[b-sai5nd4i37],
    .budget-grid[b-sai5nd4i37],
    .target-grid[b-sai5nd4i37],
    .care-metrics[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .assessment-preview[b-sai5nd4i37],
    .amount-preview[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.66;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-sai5nd4i37] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-sai5nd4i37] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.payment > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.suspended > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.expiring > span[b-sai5nd4i37] { background:#73569b; }

.target-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-sai5nd4i37],
.target-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-sai5nd4i37] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-sai5nd4i37],
.follow-grid button[b-sai5nd4i37] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-sai5nd4i37] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-sai5nd4i37],
.benefit-cell[b-sai5nd4i37],
.period-cell[b-sai5nd4i37],
.amount-cell[b-sai5nd4i37],
.payment-cycle-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-sai5nd4i37] {
    min-width:225px;
}

.registry-cell strong[b-sai5nd4i37],
.benefit-cell strong[b-sai5nd4i37],
.period-cell strong[b-sai5nd4i37],
.amount-cell strong[b-sai5nd4i37],
.payment-cycle-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-sai5nd4i37],
.benefit-cell small[b-sai5nd4i37],
.period-cell small[b-sai5nd4i37],
.amount-cell small[b-sai5nd4i37],
.payment-cycle-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-sai5nd4i37],
.period-cell em[b-sai5nd4i37],
.amount-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-sai5nd4i37],
.cycle-chip[b-sai5nd4i37],
.verify-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.source-group-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-sai5nd4i37] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.expired[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.source-group-chip[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-sai5nd4i37] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-sai5nd4i37] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-sai5nd4i37] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-sai5nd4i37] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-sai5nd4i37] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-sai5nd4i37] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-sai5nd4i37] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-sai5nd4i37],
    .target-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .target-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .condition-switch-grid[b-sai5nd4i37],
    .amount-preview[b-sai5nd4i37],
    .source-data-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .patient-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.66;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-sai5nd4i37] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-sai5nd4i37] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-sai5nd4i37] { background:#687872; }
.status-overview-card.approval > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.processing > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.paid > span[b-sai5nd4i37] { background:#34734b; }
.status-overview-card.failed > span[b-sai5nd4i37] { background:#b54d43; }

.disbursement-progress[b-sai5nd4i37] {
    margin-top:15px;
}

.disbursement-progress > div[b-sai5nd4i37] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-sai5nd4i37] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-sai5nd4i37],
.amount-cell[b-sai5nd4i37],
.progress-cell[b-sai5nd4i37],
.date-cell[b-sai5nd4i37],
.control-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-sai5nd4i37] {
    min-width:245px;
}

.batch-cell strong[b-sai5nd4i37],
.amount-cell strong[b-sai5nd4i37],
.progress-cell strong[b-sai5nd4i37],
.date-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-sai5nd4i37],
.amount-cell small[b-sai5nd4i37],
.progress-cell small[b-sai5nd4i37],
.date-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-sai5nd4i37],
.amount-cell em[b-sai5nd4i37],
.date-cell em[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-sai5nd4i37] {
    min-width:180px;
}

.recipient-stack[b-sai5nd4i37] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-sai5nd4i37],
.recipient-stack span[b-sai5nd4i37] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-sai5nd4i37] {
    margin-left:0;
}

.recipient-stack img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-sai5nd4i37] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-sai5nd4i37] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-sai5nd4i37],
.approval-chip[b-sai5nd4i37],
.reconcile-chip[b-sai5nd4i37],
.cycle-chip[b-sai5nd4i37],
.line-status-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.approved[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.control-cell[b-sai5nd4i37] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-sai5nd4i37] {
    align-items:center;
}

.selection-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-sai5nd4i37] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-sai5nd4i37] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-sai5nd4i37] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-sai5nd4i37] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-sai5nd4i37] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-sai5nd4i37] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-sai5nd4i37],
.source-selection-table td[b-sai5nd4i37] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-sai5nd4i37] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-sai5nd4i37] {
    background:#f0faf6;
}

.source-person-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-sai5nd4i37] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-sai5nd4i37],
.source-benefit-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-sai5nd4i37],
.source-benefit-cell small[b-sai5nd4i37],
.source-date[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-sai5nd4i37] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-sai5nd4i37] {
    min-width:190px;
}

.source-amount[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-sai5nd4i37] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-sai5nd4i37] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-sai5nd4i37] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-sai5nd4i37] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-sai5nd4i37] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-sai5nd4i37] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-sai5nd4i37] {
    font-size:3.5rem;
}

.batch-overview-content small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-sai5nd4i37] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-sai5nd4i37] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-sai5nd4i37] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-sai5nd4i37],
.print-line-table td[b-sai5nd4i37] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-sai5nd4i37] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-sai5nd4i37],
.print-line-table td small[b-sai5nd4i37] {
    display:block;
}

.print-line-table td small[b-sai5nd4i37] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-sai5nd4i37] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-sai5nd4i37] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-sai5nd4i37] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-sai5nd4i37] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-sai5nd4i37] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-sai5nd4i37] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-sai5nd4i37] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-sai5nd4i37] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-sai5nd4i37] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-sai5nd4i37] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-sai5nd4i37] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-sai5nd4i37],
    .recipient-detail-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-sai5nd4i37] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-sai5nd4i37] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .source-selection-summary[b-sai5nd4i37],
    .amount-preview[b-sai5nd4i37],
    .recipient-detail-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-sai5nd4i37] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-sai5nd4i37] {
        overflow-x:auto;
    }

    .source-selection-table[b-sai5nd4i37] {
        min-width:1050px;
    }

    .batch-overview-panel[b-sai5nd4i37],
    .recipient-detail-card[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-sai5nd4i37] {
        width:100%;
        height:190px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .batch-overview-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.66;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-sai5nd4i37] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-sai5nd4i37],
.type-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-sai5nd4i37] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.full > span[b-sai5nd4i37] { background:#c56b2a; }
.status-overview-card.overflow > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.maintenance > span[b-sai5nd4i37] { background:#73569b; }

.type-overview[b-sai5nd4i37] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-sai5nd4i37],
.type-overview-card.selected[b-sai5nd4i37] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-sai5nd4i37] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-sai5nd4i37] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-sai5nd4i37] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-sai5nd4i37] {
    margin-top:15px;
}

.fill-progress > div[b-sai5nd4i37] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-sai5nd4i37] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-sai5nd4i37] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-sai5nd4i37] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-sai5nd4i37] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-sai5nd4i37] {
    background:#987634;
}

.map-pin.full[b-sai5nd4i37] {
    background:#c56b2a;
}

.map-pin.overflow[b-sai5nd4i37] {
    background:#b54d43;
}

.map-pin.maintenance[b-sai5nd4i37] {
    background:#73569b;
}

.map-pin.inactive[b-sai5nd4i37] {
    background:#687872;
}

.map-pin span[b-sai5nd4i37] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-sai5nd4i37] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-sai5nd4i37] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-sai5nd4i37] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-sai5nd4i37] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-sai5nd4i37] { background:#987634; }
.map-board-legend i.full[b-sai5nd4i37] { background:#b54d43; }
.map-board-legend i.maintenance[b-sai5nd4i37] { background:#73569b; }

.map-board-caption[b-sai5nd4i37] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-sai5nd4i37],
.map-board-caption small[b-sai5nd4i37] {
    display:block;
}

.map-board-caption strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-sai5nd4i37] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.point-photo-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-sai5nd4i37] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-sai5nd4i37] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.point-photo-cell em[b-sai5nd4i37] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-sai5nd4i37],
.bin-cell[b-sai5nd4i37],
.fill-cell[b-sai5nd4i37],
.collection-cell[b-sai5nd4i37],
.sensor-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-sai5nd4i37] {
    min-width:220px;
}

.location-cell strong[b-sai5nd4i37],
.bin-cell strong[b-sai5nd4i37],
.fill-cell strong[b-sai5nd4i37],
.collection-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-sai5nd4i37],
.bin-cell small[b-sai5nd4i37],
.fill-cell small[b-sai5nd4i37],
.collection-cell small[b-sai5nd4i37],
.sensor-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.location-cell em[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.waste-type-chip[b-sai5nd4i37],
.collection-chip[b-sai5nd4i37],
.sensor-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.waste-type-chip.general[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.status-chip.active[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.full[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.table-progress[b-sai5nd4i37] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-sai5nd4i37] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-sai5nd4i37] { background:var(--theme-primary); }
.table-progress.medium span[b-sai5nd4i37] { background:#2f789f; }
.table-progress.high span[b-sai5nd4i37] { background:#987634; }
.table-progress.critical span[b-sai5nd4i37] { background:#b54d43; }

.repair-alert[b-sai5nd4i37],
.clean-alert[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-sai5nd4i37] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-sai5nd4i37] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-sai5nd4i37] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-sai5nd4i37] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-sai5nd4i37] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-sai5nd4i37] { background:#2f789f; }
.fill-preview-bin.high span[b-sai5nd4i37] { background:#987634; }
.fill-preview-bin.critical span[b-sai5nd4i37] { background:#b54d43; }

.fill-preview-bin strong[b-sai5nd4i37] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-sai5nd4i37] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-sai5nd4i37] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.source-photo-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-sai5nd4i37] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-sai5nd4i37] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-sai5nd4i37] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.large-fill-indicator[b-sai5nd4i37] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-sai5nd4i37] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-sai5nd4i37] { background:#2f789f; }
.large-fill-indicator.high > span[b-sai5nd4i37] { background:#987634; }
.large-fill-indicator.critical > span[b-sai5nd4i37] { background:#b54d43; }

.large-fill-indicator strong[b-sai5nd4i37],
.large-fill-indicator small[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-sai5nd4i37] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-sai5nd4i37] {
    font-size:.84rem;
}

.detail-map-preview[b-sai5nd4i37] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-sai5nd4i37] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-sai5nd4i37] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-sai5nd4i37] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-sai5nd4i37] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-sai5nd4i37] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.workflow-button.collect[b-sai5nd4i37] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-sai5nd4i37] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-sai5nd4i37],
    .type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-sai5nd4i37] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-sai5nd4i37] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-sai5nd4i37] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .type-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .condition-switch-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-sai5nd4i37],
    .fill-preview-card[b-sai5nd4i37],
    .coordinate-preview[b-sai5nd4i37],
    .collection-history-list article[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-sai5nd4i37] {
        min-height:240px;
    }

    .large-fill-indicator[b-sai5nd4i37],
    .fill-preview-bin[b-sai5nd4i37],
    .coordinate-pin[b-sai5nd4i37] {
        margin:0 auto;
    }

    .map-board[b-sai5nd4i37] {
        min-height:500px;
    }

    .map-pin[b-sai5nd4i37] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .point-cover-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.68;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-sai5nd4i37] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.received > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.inspecting > span[b-sai5nd4i37] { background:#2f789f; }
.status-overview-card.in-progress > span[b-sai5nd4i37] { background:#73569b; }
.status-overview-card.resolved > span[b-sai5nd4i37] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-sai5nd4i37]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-sai5nd4i37],
.pollution-type-card.selected[b-sai5nd4i37] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.pollution-type-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-sai5nd4i37] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-sai5nd4i37] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-sai5nd4i37] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-sai5nd4i37] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-sai5nd4i37] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-sai5nd4i37] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-sai5nd4i37] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-sai5nd4i37] {
    margin-top:18px;
}

.sla-progress > div[b-sai5nd4i37] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-sai5nd4i37] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-sai5nd4i37] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-sai5nd4i37] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-sai5nd4i37] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-sai5nd4i37] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-sai5nd4i37] { background:#2f789f; }
.pollution-map-pin.medium[b-sai5nd4i37] { background:#987634; }
.pollution-map-pin.high[b-sai5nd4i37] { background:#c56b2a; }
.pollution-map-pin.critical[b-sai5nd4i37] { background:#b54d43; }

.pollution-map-pin span[b-sai5nd4i37] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-sai5nd4i37] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-sai5nd4i37] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-sai5nd4i37] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-sai5nd4i37] { background:#2f789f; }
.map-board-legend i.medium[b-sai5nd4i37] { background:#987634; }
.map-board-legend i.high[b-sai5nd4i37] { background:#c56b2a; }
.map-board-legend i.critical[b-sai5nd4i37] { background:#b54d43; }

.map-board-caption[b-sai5nd4i37] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-sai5nd4i37],
.map-board-caption small[b-sai5nd4i37] {
    display:block;
}

.map-board-caption strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-sai5nd4i37] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-sai5nd4i37] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.complaint-photo-cell em[b-sai5nd4i37] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.type-severity-cell[b-sai5nd4i37],
.reporter-cell[b-sai5nd4i37],
.location-cell[b-sai5nd4i37],
.inspection-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-sai5nd4i37],
.location-cell[b-sai5nd4i37] {
    min-width:195px;
}

.reporter-cell strong[b-sai5nd4i37],
.location-cell strong[b-sai5nd4i37],
.inspection-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-sai5nd4i37],
.location-cell small[b-sai5nd4i37],
.inspection-cell small[b-sai5nd4i37],
.status-cell small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.reporter-cell em[b-sai5nd4i37],
.location-cell em[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.pollution-type-chip[b-sai5nd4i37],
.severity-chip[b-sai5nd4i37],
.inspection-chip[b-sai5nd4i37],
.status-chip[b-sai5nd4i37],
.overdue-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.pollution-type-chip.air[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.severity-chip.high[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-sai5nd4i37] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-sai5nd4i37] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-sai5nd4i37] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* FORM */

.anonymous-switch-card[b-sai5nd4i37] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-sai5nd4i37],
.anonymous-switch-card small[b-sai5nd4i37] {
    display:block;
}

.anonymous-switch-card strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-sai5nd4i37] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.coordinate-preview[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-sai5nd4i37],
.map-board-grid[b-sai5nd4i37] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-sai5nd4i37] { background:#c56b2a; }
.coordinate-pin.critical[b-sai5nd4i37] { background:#b54d43; }
.coordinate-pin.medium[b-sai5nd4i37] { background:#987634; }

.coordinate-pin .mud-icon-root[b-sai5nd4i37] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-sai5nd4i37] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.source-point-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-sai5nd4i37] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-condition-row[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:750;
}

.source-condition-row span.warning[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-sai5nd4i37] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-sai5nd4i37] { color:#987634; background:#fff4df; }

.measurement-preview small[b-sai5nd4i37],
.measurement-preview strong[b-sai5nd4i37],
.measurement-preview em[b-sai5nd4i37] {
    display:block;
}

.measurement-preview small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-preview strong[b-sai5nd4i37] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-sai5nd4i37] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

.source-photo-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-sai5nd4i37] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-sai5nd4i37] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-sai5nd4i37] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.severity-emblem[b-sai5nd4i37] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-sai5nd4i37] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-sai5nd4i37] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-sai5nd4i37] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-sai5nd4i37] {
    font-size:2.25rem;
}

.severity-emblem strong[b-sai5nd4i37] {
    font-size:1.10rem;
}

.severity-emblem small[b-sai5nd4i37] {
    font-size:.84rem;
}

.measurement-document-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-sai5nd4i37] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-sai5nd4i37],
.measurement-document-grid strong[b-sai5nd4i37] {
    display:block;
}

.measurement-document-grid span[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-document-grid strong[b-sai5nd4i37] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-sai5nd4i37] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-sai5nd4i37] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-sai5nd4i37] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-sai5nd4i37] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-sai5nd4i37] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-sai5nd4i37] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-sai5nd4i37] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-sai5nd4i37] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-sai5nd4i37] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-sai5nd4i37] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-sai5nd4i37] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-sai5nd4i37] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-sai5nd4i37] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-sai5nd4i37],
    .source-photo-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-sai5nd4i37],
    .source-photo-preview button[b-sai5nd4i37] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .pollution-type-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .measurement-preview[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-sai5nd4i37],
    .coordinate-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-sai5nd4i37] {
        height:250px;
    }

    .coordinate-pin[b-sai5nd4i37] {
        margin:0 auto;
    }

    .pollution-map-board[b-sai5nd4i37] {
        min-height:500px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .complaint-cover-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.68;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-sai5nd4i37] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-sai5nd4i37] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.polluted > span[b-sai5nd4i37] { background:#c56b2a; }
.status-overview-card.critical > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.restoring > span[b-sai5nd4i37] { background:#73569b; }

/* SOURCE TYPE CARDS */

.asset-type-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.asset-type-card[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.asset-type-card[b-sai5nd4i37]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.asset-type-card:hover[b-sai5nd4i37],
.asset-type-card.selected[b-sai5nd4i37] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.asset-type-card > span[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.asset-type-card > div[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.asset-type-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.asset-type-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.asset-type-card.canal[b-sai5nd4i37] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.asset-type-card.pond[b-sai5nd4i37] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.asset-type-card.reservoir[b-sai5nd4i37] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.asset-type-card.river[b-sai5nd4i37] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.asset-type-card.groundwater[b-sai5nd4i37] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.asset-type-card.drainage[b-sai5nd4i37] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.asset-type-card.tap-water[b-sai5nd4i37] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.green-metric-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.green-metric-grid article[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.green-metric-grid article > span[b-sai5nd4i37] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.green-metric-grid article.ph > span[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.green-metric-grid article.do > span[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.green-metric-grid article.bod > span[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.green-metric-grid article.turbidity > span[b-sai5nd4i37] { color:#987634; background:#fff4df; }

.green-metric-grid small[b-sai5nd4i37],
.green-metric-grid strong[b-sai5nd4i37],
.green-metric-grid em[b-sai5nd4i37] {
    display:block;
}

.green-metric-grid small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.86rem;
}

.green-metric-grid strong[b-sai5nd4i37] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.green-metric-grid em[b-sai5nd4i37] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

/* MAP */

.green-map-board[b-sai5nd4i37] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.green-map-pin[b-sai5nd4i37] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.green-map-pin.good[b-sai5nd4i37] { background:var(--theme-primary); }
.green-map-pin.watch[b-sai5nd4i37] { background:#987634; }
.green-map-pin.polluted[b-sai5nd4i37] { background:#c56b2a; }
.green-map-pin.critical[b-sai5nd4i37] { background:#b54d43; }
.green-map-pin.restoring[b-sai5nd4i37] { background:#73569b; }
.green-map-pin.closed[b-sai5nd4i37] { background:#687872; }

.green-map-pin span[b-sai5nd4i37] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-sai5nd4i37] { background:var(--theme-primary); }
.map-board-legend i.watch[b-sai5nd4i37] { background:#987634; }
.map-board-legend i.polluted[b-sai5nd4i37] { background:#c56b2a; }
.map-board-legend i.critical[b-sai5nd4i37] { background:#b54d43; }
.map-board-legend i.restoring[b-sai5nd4i37] { background:#73569b; }

/* TABLE */

.asset-photo-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.asset-photo-mini[b-sai5nd4i37] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.asset-photo-mini img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.asset-photo-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.asset-photo-cell small[b-sai5nd4i37],
.asset-photo-cell em[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.asset-photo-cell em[b-sai5nd4i37] {
    color:#2f789f;
    font-style:normal;
}

.type-species-cell[b-sai5nd4i37],
.latest-inspection-cell[b-sai5nd4i37],
.inspection-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.asset-type-chip[b-sai5nd4i37],
.quality-status-chip[b-sai5nd4i37],
.usage-chip[b-sai5nd4i37],
.lab-chip[b-sai5nd4i37],
.no-inspection-chip[b-sai5nd4i37],
.overdue-chip[b-sai5nd4i37],
.follow-up-chip[b-sai5nd4i37],
.complaint-count-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.asset-type-chip.canal[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.asset-type-chip.pond[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.asset-type-chip.reservoir[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.asset-type-chip.river[b-sai5nd4i37] { color:#278ca8; background:#e5f5f9; }
.asset-type-chip.groundwater[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.asset-type-chip.drainage[b-sai5nd4i37] { color:#687872; background:#edf1ef; }
.asset-type-chip.tap-water[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.usage-chip[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.no-inspection-chip[b-sai5nd4i37] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

.latest-inspection-cell strong[b-sai5nd4i37],
.inspection-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-inspection-cell small[b-sai5nd4i37],
.inspection-cell small[b-sai5nd4i37],
.type-species-cell small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.size-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-sai5nd4i37] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.84rem;
}

.size-cell strong[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.88rem;
}

.row-action.sample[b-sai5nd4i37] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-sai5nd4i37] { background:var(--theme-primary); }
.coordinate-pin.watch[b-sai5nd4i37] { background:#987634; }
.coordinate-pin.polluted[b-sai5nd4i37] { background:#c56b2a; }
.coordinate-pin.critical[b-sai5nd4i37] { background:#b54d43; }
.coordinate-pin.restoring[b-sai5nd4i37] { background:#73569b; }
.coordinate-pin.closed[b-sai5nd4i37] { background:#687872; }

.coordinate-pin .mud-icon-root[b-sai5nd4i37] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-sai5nd4i37] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-sai5nd4i37] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.linked-photo-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-sai5nd4i37] {
    color:#73569b;
    font-size:.84rem;
    font-weight:800;
}

.linked-photo-preview h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-sai5nd4i37] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.linked-photo-preview button[b-sai5nd4i37] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.inspection-form-modal[b-sai5nd4i37] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.inspection-score-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.inspection-score-grid article[b-sai5nd4i37] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.inspection-score-grid small[b-sai5nd4i37],
.inspection-score-grid strong[b-sai5nd4i37],
.inspection-score-grid span[b-sai5nd4i37] {
    display:block;
}

.inspection-score-grid small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.inspection-score-grid strong[b-sai5nd4i37] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.inspection-score-grid span[b-sai5nd4i37] {
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.inspection-score-grid article.ph[b-sai5nd4i37] { border-top:4px solid #73569b; }
.inspection-score-grid article.do[b-sai5nd4i37] { border-top:4px solid #2f789f; }
.inspection-score-grid article.bod[b-sai5nd4i37] { border-top:4px solid #c56b2a; }
.inspection-score-grid article.cod[b-sai5nd4i37] { border-top:4px solid #b54d43; }
.inspection-score-grid article.turbidity[b-sai5nd4i37] { border-top:4px solid #987634; }
.inspection-score-grid article.coliform[b-sai5nd4i37] { border-top:4px solid var(--theme-primary); }

.inspection-photo-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.green-cover-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.green-cover-photo[b-sai5nd4i37] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.green-cover-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.green-cover-content small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.green-cover-content h2[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.green-cover-content p[b-sai5nd4i37] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.green-cover-meta[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.green-cover-meta span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.health-emblem[b-sai5nd4i37] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.health-emblem.watch[b-sai5nd4i37] { color:#987634; border-color:#f2e6c9; }
.health-emblem.polluted[b-sai5nd4i37] { color:#c56b2a; border-color:#f8ddc7; }
.health-emblem.critical[b-sai5nd4i37] { color:#b54d43; border-color:#f4d7d3; }
.health-emblem.restoring[b-sai5nd4i37] { color:#73569b; border-color:#e8def4; }
.health-emblem.closed[b-sai5nd4i37] { color:#687872; border-color:#dde5e1; }

.health-emblem .mud-icon-root[b-sai5nd4i37] {
    font-size:2.25rem;
}

.health-emblem strong[b-sai5nd4i37] {
    font-size:1.05rem;
    text-align:center;
}

.health-emblem small[b-sai5nd4i37] {
    font-size:.84rem;
}

.measurement-document-grid[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-sai5nd4i37] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-sai5nd4i37],
.measurement-document-grid strong[b-sai5nd4i37] {
    display:block;
}

.measurement-document-grid span[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-document-grid strong[b-sai5nd4i37] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.inspection-history-panel[b-sai5nd4i37],
.linked-complaint-panel[b-sai5nd4i37] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.inspection-card-list[b-sai5nd4i37],
.linked-complaint-list[b-sai5nd4i37] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.inspection-card[b-sai5nd4i37] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.inspection-card.good[b-sai5nd4i37] { border-left-color:var(--theme-primary); }
.inspection-card.watch[b-sai5nd4i37] { border-left-color:#987634; }
.inspection-card.polluted[b-sai5nd4i37] { border-left-color:#c56b2a; }
.inspection-card.critical[b-sai5nd4i37] { border-left-color:#b54d43; }
.inspection-card.restoring[b-sai5nd4i37] { border-left-color:#73569b; }

.inspection-card-head[b-sai5nd4i37] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.inspection-card-head strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.inspection-card-head small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.inspection-card-metrics[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.inspection-card-metrics span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.84rem;
}

.inspection-card-metrics strong[b-sai5nd4i37] {
    color:#2f789f;
}

.inspection-card p[b-sai5nd4i37] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.inspection-photo-actions[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.inspection-photo-actions button[b-sai5nd4i37] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

.linked-complaint-list article[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-sai5nd4i37] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.84rem;
}

.linked-complaint-list p[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.86rem;
}

.linked-complaint-list a[b-sai5nd4i37] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.84rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-sai5nd4i37] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-sai5nd4i37] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .asset-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .green-metric-grid[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .inspection-score-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .green-cover-panel[b-sai5nd4i37] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .asset-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .green-cover-panel[b-sai5nd4i37] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .health-emblem[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-sai5nd4i37] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .asset-type-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .green-metric-grid[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .inspection-score-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .amount-document-grid[b-sai5nd4i37],
    .inspection-photo-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-cover-panel[b-sai5nd4i37],
    .coordinate-preview[b-sai5nd4i37],
    .linked-complaint-list article[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-cover-photo[b-sai5nd4i37] {
        height:250px;
    }

    .coordinate-pin[b-sai5nd4i37] {
        margin:0 auto;
    }

    .green-map-board[b-sai5nd4i37] {
        min-height:500px;
    }

    .linked-complaint-list button[b-sai5nd4i37] {
        height:210px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .green-cover-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.green-page[b-sai5nd4i37] {
    font-size:17px;
    line-height:1.68;
}

.green-hero[b-sai5nd4i37] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-sai5nd4i37] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-sai5nd4i37] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-sai5nd4i37] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-sai5nd4i37] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-sai5nd4i37] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-sai5nd4i37] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-sai5nd4i37] { background:#987634; }
.status-overview-card.diseased > span[b-sai5nd4i37] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-sai5nd4i37] { background:#b54d43; }
.status-overview-card.treatment > span[b-sai5nd4i37] { background:#73569b; }

/* ASSET TYPE CARDS */

.asset-type-overview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.asset-type-card[b-sai5nd4i37] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.asset-type-card[b-sai5nd4i37]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.asset-type-card:hover[b-sai5nd4i37],
.asset-type-card.selected[b-sai5nd4i37] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.asset-type-card > span[b-sai5nd4i37] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.asset-type-card > div[b-sai5nd4i37] {
    position:relative;
    z-index:2;
}

.asset-type-card small[b-sai5nd4i37] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.asset-type-card strong[b-sai5nd4i37] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.asset-type-card.street-tree[b-sai5nd4i37] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.asset-type-card.public-park[b-sai5nd4i37] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.asset-type-card.median[b-sai5nd4i37] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.asset-type-card.community-forest[b-sai5nd4i37] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.asset-type-card.waterfront[b-sai5nd4i37] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.asset-type-card.school-green[b-sai5nd4i37] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.asset-type-card.public-garden[b-sai5nd4i37] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.green-metric-grid article.carbon > span[b-sai5nd4i37] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.green-metric-grid article.photo > span[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.green-metric-grid article.maintenance > span[b-sai5nd4i37] {
    color:#987634;
    background:#fff4df;
}

.green-metric-grid article.treatment > span[b-sai5nd4i37] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.green-map-board[b-sai5nd4i37] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.green-map-pin[b-sai5nd4i37] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.green-map-pin.healthy[b-sai5nd4i37] { background:var(--theme-primary); }
.green-map-pin.watch[b-sai5nd4i37] { background:#987634; }
.green-map-pin.diseased[b-sai5nd4i37] { background:#c56b2a; }
.green-map-pin.hazardous[b-sai5nd4i37] { background:#b54d43; }
.green-map-pin.treatment[b-sai5nd4i37] { background:#73569b; }
.green-map-pin.removed[b-sai5nd4i37] { background:#687872; }

.green-map-pin span[b-sai5nd4i37] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-sai5nd4i37] { background:var(--theme-primary); }
.map-board-legend i.watch[b-sai5nd4i37] { background:#987634; }
.map-board-legend i.diseased[b-sai5nd4i37] { background:#c56b2a; }
.map-board-legend i.hazardous[b-sai5nd4i37] { background:#b54d43; }
.map-board-legend i.treatment[b-sai5nd4i37] { background:#73569b; }

/* TABLE */

.asset-photo-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.asset-photo-mini[b-sai5nd4i37] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.asset-photo-mini img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.asset-photo-cell strong[b-sai5nd4i37] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.asset-photo-cell small[b-sai5nd4i37],
.asset-photo-cell em[b-sai5nd4i37] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.asset-photo-cell em[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-species-cell[b-sai5nd4i37],
.latest-inspection-cell[b-sai5nd4i37],
.maintenance-cell[b-sai5nd4i37],
.status-cell[b-sai5nd4i37] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.asset-type-chip[b-sai5nd4i37],
.health-status-chip[b-sai5nd4i37],
.risk-chip[b-sai5nd4i37],
.health-score-chip[b-sai5nd4i37],
.no-inspection-chip[b-sai5nd4i37],
.overdue-chip[b-sai5nd4i37],
.urgent-chip[b-sai5nd4i37],
.water-link-chip[b-sai5nd4i37] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.asset-type-chip.street-tree[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.asset-type-chip.public-park[b-sai5nd4i37] { color:#34734b; background:#e7f5ec; }
.asset-type-chip.median[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.asset-type-chip.community-forest[b-sai5nd4i37] { color:#236b4f; background:#e4f1e9; }
.asset-type-chip.waterfront[b-sai5nd4i37] { color:#2f789f; background:#e8f3f8; }
.asset-type-chip.school-green[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.asset-type-chip.public-garden[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-sai5nd4i37] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-sai5nd4i37] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.risk-chip.high[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-sai5nd4i37] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-sai5nd4i37] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-sai5nd4i37] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-sai5nd4i37] { color:#b54d43; background:#fff0ee; }

.no-inspection-chip[b-sai5nd4i37] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-sai5nd4i37],
.urgent-chip[b-sai5nd4i37] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-sai5nd4i37] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-species-cell strong[b-sai5nd4i37],
.latest-inspection-cell strong[b-sai5nd4i37],
.maintenance-cell strong[b-sai5nd4i37] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-species-cell small[b-sai5nd4i37],
.latest-inspection-cell small[b-sai5nd4i37],
.maintenance-cell small[b-sai5nd4i37] {
    color:#71837a;
    font-size:.84rem;
}

.size-cell[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-sai5nd4i37] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.84rem;
}

.size-cell strong[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.88rem;
}

.size-cell em[b-sai5nd4i37] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.84rem;
    font-style:normal;
}

.row-action.inspect[b-sai5nd4i37] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-sai5nd4i37] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-sai5nd4i37] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-sai5nd4i37] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

/* INSPECTION */

.inspection-form-modal[b-sai5nd4i37] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.inspection-score-grid article.good[b-sai5nd4i37] {
    border-top:4px solid var(--theme-primary);
}

.inspection-score-grid article.watch[b-sai5nd4i37] {
    border-top:4px solid #987634;
}

.inspection-score-grid article.diseased[b-sai5nd4i37],
.inspection-score-grid article.high[b-sai5nd4i37] {
    border-top:4px solid #c56b2a;
}

.inspection-score-grid article.hazardous[b-sai5nd4i37],
.inspection-score-grid article.critical[b-sai5nd4i37] {
    border-top:4px solid #b54d43;
}

.inspection-score-grid article.medium[b-sai5nd4i37] {
    border-top:4px solid #987634;
}

.inspection-score-grid article.low[b-sai5nd4i37] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.green-cover-panel[b-sai5nd4i37] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.green-cover-photo[b-sai5nd4i37] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.green-cover-photo img[b-sai5nd4i37] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.green-cover-content small[b-sai5nd4i37] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.green-cover-content h2[b-sai5nd4i37] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.green-cover-content p[b-sai5nd4i37] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.green-cover-meta[b-sai5nd4i37] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.green-cover-meta span[b-sai5nd4i37] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.health-emblem[b-sai5nd4i37] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.health-emblem.watch[b-sai5nd4i37] { color:#987634; border-color:#f2e6c9; }
.health-emblem.diseased[b-sai5nd4i37] { color:#c56b2a; border-color:#f8ddc7; }
.health-emblem.hazardous[b-sai5nd4i37] { color:#b54d43; border-color:#f4d7d3; }
.health-emblem.treatment[b-sai5nd4i37] { color:#73569b; border-color:#e8def4; }
.health-emblem.removed[b-sai5nd4i37] { color:#687872; border-color:#dde5e1; }

.health-emblem .mud-icon-root[b-sai5nd4i37] {
    font-size:2.25rem;
}

.health-emblem strong[b-sai5nd4i37] {
    font-size:1.05rem;
    text-align:center;
}

.health-emblem small[b-sai5nd4i37] {
    font-size:.84rem;
}

.inspection-history-panel[b-sai5nd4i37] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.inspection-card[b-sai5nd4i37] {
    border-left:5px solid var(--theme-primary);
}

.inspection-card.medium[b-sai5nd4i37],
.inspection-card.watch[b-sai5nd4i37] {
    border-left-color:#987634;
}

.inspection-card.high[b-sai5nd4i37],
.inspection-card.diseased[b-sai5nd4i37] {
    border-left-color:#c56b2a;
}

.inspection-card.critical[b-sai5nd4i37],
.inspection-card.hazardous[b-sai5nd4i37] {
    border-left-color:#b54d43;
}

.view-inspect-button[b-sai5nd4i37] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-sai5nd4i37] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-sai5nd4i37] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-sai5nd4i37] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-sai5nd4i37] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-sai5nd4i37] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-sai5nd4i37] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.green-page[b-sai5nd4i37]  .green-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.green-page[b-sai5nd4i37]  .mud-input,
.green-page[b-sai5nd4i37]  .mud-select-input {
    font-size:1.02rem !important;
}

.green-page[b-sai5nd4i37]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.green-page[b-sai5nd4i37]  .mud-list-item-text {
    font-size:1rem !important;
}

.green-page[b-sai5nd4i37]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .asset-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .green-metric-grid[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .inspection-score-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .green-cover-panel[b-sai5nd4i37] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .asset-type-overview[b-sai5nd4i37] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .green-cover-panel[b-sai5nd4i37] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .health-emblem[b-sai5nd4i37] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-sai5nd4i37],
    .source-photo-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-sai5nd4i37],
    .asset-type-overview[b-sai5nd4i37],
    .amount-metrics[b-sai5nd4i37],
    .follow-grid[b-sai5nd4i37],
    .green-metric-grid[b-sai5nd4i37],
    .measurement-document-grid[b-sai5nd4i37],
    .inspection-score-grid[b-sai5nd4i37],
    .reference-grid[b-sai5nd4i37],
    .inspection-photo-grid[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-cover-panel[b-sai5nd4i37],
    .coordinate-preview[b-sai5nd4i37] {
        grid-template-columns:minmax(0,1fr);
    }

    .green-cover-photo[b-sai5nd4i37] {
        height:250px;
    }

    .coordinate-pin[b-sai5nd4i37] {
        margin:0 auto;
    }

    .green-map-board[b-sai5nd4i37] {
        min-height:500px;
    }

    .green-page[b-sai5nd4i37]  .green-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #green-profile-print-area[b-sai5nd4i37],
    #green-profile-print-area *[b-sai5nd4i37] {
        visibility:visible !important;
    }

    #green-profile-print-area[b-sai5nd4i37] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .green-view-modal[b-sai5nd4i37] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-sai5nd4i37],
    .document-status-strip[b-sai5nd4i37],
    .green-cover-panel[b-sai5nd4i37],
    .document-section[b-sai5nd4i37],
    .document-footer[b-sai5nd4i37] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/05Environment/PollutionComplaints.razor.rz.scp.css */
:root[b-6sg0ods1nh] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.pollution-page[b-6sg0ods1nh] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.pollution-page[b-6sg0ods1nh]  .pollution-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.pollution-hero[b-6sg0ods1nh] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-6sg0ods1nh] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-6sg0ods1nh] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-6sg0ods1nh],
.hero-action-panel[b-6sg0ods1nh] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-6sg0ods1nh] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-6sg0ods1nh] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-6sg0ods1nh] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-6sg0ods1nh] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-6sg0ods1nh] {
    margin-top: 3px;
    font-size: .94rem;
}

.pollution-hero h1[b-6sg0ods1nh] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.pollution-hero p[b-6sg0ods1nh] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-6sg0ods1nh] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-6sg0ods1nh] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-6sg0ods1nh] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-6sg0ods1nh] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-6sg0ods1nh] {
    font-size: .85rem;
}

.hero-status small[b-6sg0ods1nh] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.pollution-page[b-6sg0ods1nh]  .hero-add-button,
.pollution-page[b-6sg0ods1nh]  .toolbar-add-button,
.pollution-page[b-6sg0ods1nh]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.pollution-page[b-6sg0ods1nh]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-6sg0ods1nh],
.hero-refresh-button[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-6sg0ods1nh] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-6sg0ods1nh] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-6sg0ods1nh] {
    opacity: .55;
    cursor: wait;
}

.pollution-page[b-6sg0ods1nh]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.pollution-page[b-6sg0ods1nh]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-6sg0ods1nh] {
    margin-top: 2px !important;
}

.summary-card[b-6sg0ods1nh] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-6sg0ods1nh] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-6sg0ods1nh] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-6sg0ods1nh] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-6sg0ods1nh] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-6sg0ods1nh] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-6sg0ods1nh] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-6sg0ods1nh] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-6sg0ods1nh] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-6sg0ods1nh] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-6sg0ods1nh] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-6sg0ods1nh] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-6sg0ods1nh] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-6sg0ods1nh],
.status-overview-card.selected[b-6sg0ods1nh] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-6sg0ods1nh] {
    background: #f5faf7;
}

.status-overview-card > span[b-6sg0ods1nh] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-6sg0ods1nh] { background:#687872; }
.status-overview-card.reviewing > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.difference > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.approved > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.closed > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.voided > span[b-6sg0ods1nh] { background:#687872; }
.status-overview-card.today > span[b-6sg0ods1nh] { background:#73569b; }

.status-overview-card div[b-6sg0ods1nh] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-6sg0ods1nh] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-6sg0ods1nh] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-6sg0ods1nh] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-6sg0ods1nh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-6sg0ods1nh] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-6sg0ods1nh] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-6sg0ods1nh] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-6sg0ods1nh] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-6sg0ods1nh] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-6sg0ods1nh] {
    margin-top: 13px;
}

.progress-track[b-6sg0ods1nh] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-6sg0ods1nh] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-6sg0ods1nh] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-6sg0ods1nh] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-6sg0ods1nh] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-6sg0ods1nh],
.pollution-list-panel[b-6sg0ods1nh] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-6sg0ods1nh] {
    padding: 15px;
}

.filter-heading[b-6sg0ods1nh],
.list-toolbar[b-6sg0ods1nh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-6sg0ods1nh],
.panel-kicker[b-6sg0ods1nh] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-6sg0ods1nh],
.list-toolbar h2[b-6sg0ods1nh] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-6sg0ods1nh],
.list-toolbar p[b-6sg0ods1nh] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-6sg0ods1nh] {
    margin-top: 8px !important;
}

.pollution-page[b-6sg0ods1nh]  .premium-field,
.pollution-page[b-6sg0ods1nh]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.pollution-page[b-6sg0ods1nh]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-6sg0ods1nh] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-6sg0ods1nh] {
    color: var(--theme-primary);
}

.pollution-list-panel[b-6sg0ods1nh] {
    overflow: hidden;
}

.list-toolbar[b-6sg0ods1nh] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.pollution-page[b-6sg0ods1nh]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-6sg0ods1nh] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-6sg0ods1nh] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-6sg0ods1nh] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-6sg0ods1nh] {
    margin: 0;
    font-size: .84rem;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table {
    font-family: 'Kanit',sans-serif;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head {
    background: #f1f7f4;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-6sg0ods1nh] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-6sg0ods1nh] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-6sg0ods1nh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-6sg0ods1nh] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-6sg0ods1nh],
.counter-cashier-cell[b-6sg0ods1nh],
.money-cell[b-6sg0ods1nh],
.difference-cell[b-6sg0ods1nh],
.transaction-status-cell[b-6sg0ods1nh] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-6sg0ods1nh] {
    min-width: 175px;
}

.date-shift-cell strong[b-6sg0ods1nh],
.counter-cashier-cell strong[b-6sg0ods1nh],
.money-cell strong[b-6sg0ods1nh],
.difference-cell strong[b-6sg0ods1nh],
.transaction-status-cell strong[b-6sg0ods1nh] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-6sg0ods1nh],
.counter-cashier-cell small[b-6sg0ods1nh],
.money-cell small[b-6sg0ods1nh],
.difference-cell small[b-6sg0ods1nh] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-6sg0ods1nh],
.counter-cashier-cell em[b-6sg0ods1nh] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-6sg0ods1nh] { color:var(--theme-primary); }
.money-cell.actual strong[b-6sg0ods1nh] { color:#2f789f; }

.difference-cell.matched strong[b-6sg0ods1nh] { color:#34734b; }
.difference-cell.over strong[b-6sg0ods1nh] { color:#987634; }
.difference-cell.short strong[b-6sg0ods1nh] { color:#b54d43; }

.status-chip[b-6sg0ods1nh],
.match-chip[b-6sg0ods1nh] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-6sg0ods1nh] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.difference[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-6sg0ods1nh] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-6sg0ods1nh] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.pollution-page[b-6sg0ods1nh]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.pollution-page[b-6sg0ods1nh]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.pollution-page[b-6sg0ods1nh]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.pollution-page[b-6sg0ods1nh]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.pollution-page[b-6sg0ods1nh]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-6sg0ods1nh] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-6sg0ods1nh] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-6sg0ods1nh],
.image-preview-backdrop[b-6sg0ods1nh] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.pollution-form-modal[b-6sg0ods1nh],
.pollution-view-modal[b-6sg0ods1nh],
.delete-modal[b-6sg0ods1nh],
.image-preview-modal[b-6sg0ods1nh] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-6sg0ods1nh],
.view-toolbar[b-6sg0ods1nh],
.image-preview-header[b-6sg0ods1nh] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-6sg0ods1nh] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-6sg0ods1nh] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-6sg0ods1nh],
.view-toolbar small[b-6sg0ods1nh],
.image-preview-header small[b-6sg0ods1nh] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-6sg0ods1nh],
.view-toolbar h2[b-6sg0ods1nh],
.image-preview-header h3[b-6sg0ods1nh] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-6sg0ods1nh] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-6sg0ods1nh],
.view-scroll[b-6sg0ods1nh] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-6sg0ods1nh] {
    background: #e9efec;
}

.modal-footer[b-6sg0ods1nh] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.pollution-page[b-6sg0ods1nh]  .cancel-button,
.pollution-page[b-6sg0ods1nh]  .save-button,
.pollution-page[b-6sg0ods1nh]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-6sg0ods1nh] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-6sg0ods1nh] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-6sg0ods1nh] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-6sg0ods1nh] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-6sg0ods1nh],
.calculation-heading[b-6sg0ods1nh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-6sg0ods1nh],
.calculation-heading small[b-6sg0ods1nh] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-6sg0ods1nh],
.calculation-heading h3[b-6sg0ods1nh] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-6sg0ods1nh],
.calculation-heading > span[b-6sg0ods1nh] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-6sg0ods1nh] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-6sg0ods1nh] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-6sg0ods1nh] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-6sg0ods1nh] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-6sg0ods1nh] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-6sg0ods1nh] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-6sg0ods1nh] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-6sg0ods1nh] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-6sg0ods1nh] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-6sg0ods1nh] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-6sg0ods1nh] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-6sg0ods1nh],
.calculation-grid .short strong[b-6sg0ods1nh],
.calculation-grid .short small[b-6sg0ods1nh] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-6sg0ods1nh] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-6sg0ods1nh] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-6sg0ods1nh] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-6sg0ods1nh] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-6sg0ods1nh] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-6sg0ods1nh] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-6sg0ods1nh] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-6sg0ods1nh] {
    font-size:.84rem;
}

.photo-upload-actions[b-6sg0ods1nh] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-6sg0ods1nh],
.remove-photo-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-6sg0ods1nh] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-6sg0ods1nh] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-6sg0ods1nh] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-6sg0ods1nh],
.detail-transaction-table[b-6sg0ods1nh] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-6sg0ods1nh],
.source-transaction-row[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-6sg0ods1nh] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-6sg0ods1nh],
.source-transaction-row > span[b-6sg0ods1nh] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-6sg0ods1nh] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-6sg0ods1nh] {
    border-bottom:0;
}

.mini-photo-button[b-6sg0ods1nh] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-6sg0ods1nh],
.source-transaction-more[b-6sg0ods1nh] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-6sg0ods1nh] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.pollution-view-modal[b-6sg0ods1nh] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.pollution-page[b-6sg0ods1nh]  .view-edit-button,
.pollution-page[b-6sg0ods1nh]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.pollution-page[b-6sg0ods1nh]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-pollution-profile[b-6sg0ods1nh] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-6sg0ods1nh] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-6sg0ods1nh] {
    text-align:center;
}

.document-organization small[b-6sg0ods1nh] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-6sg0ods1nh] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-6sg0ods1nh] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-6sg0ods1nh] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-6sg0ods1nh],
.document-number-box small[b-6sg0ods1nh] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-6sg0ods1nh] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-6sg0ods1nh] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-6sg0ods1nh] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-6sg0ods1nh] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-6sg0ods1nh],
.transaction-summary-section[b-6sg0ods1nh],
.source-transaction-section[b-6sg0ods1nh],
.review-section[b-6sg0ods1nh] {
    margin-top:16px;
}

.section-title[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-6sg0ods1nh] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-6sg0ods1nh] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-6sg0ods1nh] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-6sg0ods1nh] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-6sg0ods1nh],
.comparison-row[b-6sg0ods1nh],
.comparison-total[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-6sg0ods1nh] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-6sg0ods1nh],
.comparison-row span[b-6sg0ods1nh],
.comparison-total span[b-6sg0ods1nh] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-6sg0ods1nh] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-6sg0ods1nh],
.comparison-total span:not(:first-child)[b-6sg0ods1nh] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-6sg0ods1nh] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-6sg0ods1nh] { color:#34734b; }
.difference-text.over[b-6sg0ods1nh] { color:#987634; }
.difference-text.short[b-6sg0ods1nh] { color:#b54d43; }

.transaction-summary-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-6sg0ods1nh] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-6sg0ods1nh] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-6sg0ods1nh] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-6sg0ods1nh] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-6sg0ods1nh] { background:#f4fafc; }

.transaction-summary-grid span[b-6sg0ods1nh] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-6sg0ods1nh] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-6sg0ods1nh],
.detail-transaction-row[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-6sg0ods1nh] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-6sg0ods1nh],
.detail-transaction-row span[b-6sg0ods1nh] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-6sg0ods1nh] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-6sg0ods1nh] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-6sg0ods1nh] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-6sg0ods1nh] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-6sg0ods1nh] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-6sg0ods1nh] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-6sg0ods1nh],
.attachment-panel[b-6sg0ods1nh] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-6sg0ods1nh] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-6sg0ods1nh] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-6sg0ods1nh] {
    display:grid;
    gap:7px;
}

.history-item[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-6sg0ods1nh] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-6sg0ods1nh] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-6sg0ods1nh] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-6sg0ods1nh],
.history-item em[b-6sg0ods1nh] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-6sg0ods1nh] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-6sg0ods1nh] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-6sg0ods1nh] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-6sg0ods1nh] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-6sg0ods1nh] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-6sg0ods1nh] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-6sg0ods1nh] { background:rgba(52,115,75,.89); }

.attachment-empty[b-6sg0ods1nh] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-6sg0ods1nh] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-6sg0ods1nh] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-6sg0ods1nh] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-6sg0ods1nh] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-6sg0ods1nh] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-6sg0ods1nh] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-6sg0ods1nh] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-6sg0ods1nh] {
    color:#b54d43;
}

.delete-warning[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-6sg0ods1nh] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.pollution-page[b-6sg0ods1nh]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .pollution-hero[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-6sg0ods1nh] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-6sg0ods1nh] {
        grid-column:1 / -1;
    }

    .document-header[b-6sg0ods1nh] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-6sg0ods1nh] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .pollution-page[b-6sg0ods1nh] {
        padding-top:10px;
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-container {
        padding-inline:10px !important;
    }

    .pollution-hero[b-6sg0ods1nh] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-6sg0ods1nh],
    .list-toolbar[b-6sg0ods1nh],
    .source-summary-heading[b-6sg0ods1nh],
    .calculation-heading[b-6sg0ods1nh],
    .view-toolbar[b-6sg0ods1nh],
    .section-heading[b-6sg0ods1nh] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-6sg0ods1nh],
    .variance-grid[b-6sg0ods1nh],
    .progress-metrics[b-6sg0ods1nh],
    .source-summary-grid[b-6sg0ods1nh],
    .system-amount-grid[b-6sg0ods1nh],
    .calculation-grid[b-6sg0ods1nh],
    .photo-upload-grid[b-6sg0ods1nh],
    .transaction-summary-grid[b-6sg0ods1nh],
    .review-grid[b-6sg0ods1nh],
    .review-note-grid[b-6sg0ods1nh],
    .attachment-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-6sg0ods1nh] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-6sg0ods1nh] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-6sg0ods1nh] {
        width:100%;
    }

    .print-pollution-profile[b-6sg0ods1nh] {
        padding:22px 18px;
    }

    .document-footer[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-6sg0ods1nh] {
        grid-column:auto;
    }

    .status-overview[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-6sg0ods1nh] {
        width:100%;
    }

    .document-header[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-6sg0ods1nh] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-6sg0ods1nh] {
        visibility:hidden !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-6sg0ods1nh] {
        display:none !important;
    }

    .modal-backdrop[b-6sg0ods1nh],
    .pollution-view-modal[b-6sg0ods1nh],
    .view-scroll[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .scope-panel[b-6sg0ods1nh],
    .amount-comparison-section[b-6sg0ods1nh],
    .transaction-summary-section[b-6sg0ods1nh],
    .source-transaction-section[b-6sg0ods1nh],
    .review-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }

    .mock-document-label[b-6sg0ods1nh] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-6sg0ods1nh] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.pollution-page[b-6sg0ods1nh]  .hero-add-button,
.pollution-page[b-6sg0ods1nh]  .toolbar-add-button,
.pollution-page[b-6sg0ods1nh]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-6sg0ods1nh] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.confirmed > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.checked-in > span[b-6sg0ods1nh] { background:#73569b; }
.status-overview-card.in-service > span[b-6sg0ods1nh] { background:#c46a2b; }
.status-overview-card.completed > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.cancelled > span[b-6sg0ods1nh] { background:#b54d43; }

.service-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-6sg0ods1nh],
.service-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-6sg0ods1nh] {
    background:#f4faf7;
}

.service-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-6sg0ods1nh] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-6sg0ods1nh] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-6sg0ods1nh] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-6sg0ods1nh],
.service-unit-cell[b-6sg0ods1nh],
.provider-location-cell[b-6sg0ods1nh],
.queue-priority-cell[b-6sg0ods1nh],
.reason-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-6sg0ods1nh],
.reason-cell[b-6sg0ods1nh] {
    min-width:180px;
}

.appointment-time-cell strong[b-6sg0ods1nh],
.service-unit-cell strong[b-6sg0ods1nh],
.provider-location-cell strong[b-6sg0ods1nh],
.queue-priority-cell strong[b-6sg0ods1nh],
.reason-cell strong[b-6sg0ods1nh] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-6sg0ods1nh],
.service-unit-cell small[b-6sg0ods1nh],
.provider-location-cell small[b-6sg0ods1nh],
.queue-priority-cell small[b-6sg0ods1nh],
.reason-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-6sg0ods1nh],
.provider-location-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-6sg0ods1nh],
.priority-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-6sg0ods1nh] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-6sg0ods1nh] { color:#987634; background:#fff4df; }

.priority-chip[b-6sg0ods1nh] {
    margin-top:5px;
}

.priority-chip.normal[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-6sg0ods1nh] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-6sg0ods1nh] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-6sg0ods1nh] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-6sg0ods1nh],
.identity-chip.not-found[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-6sg0ods1nh] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-6sg0ods1nh],
.citizen-source-actions a[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-6sg0ods1nh] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-6sg0ods1nh] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-6sg0ods1nh] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-6sg0ods1nh] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-6sg0ods1nh] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-6sg0ods1nh] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-6sg0ods1nh] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-6sg0ods1nh] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-6sg0ods1nh] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-6sg0ods1nh] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-6sg0ods1nh] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-6sg0ods1nh],
.identity-box small[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-6sg0ods1nh] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-6sg0ods1nh],
.reason-section[b-6sg0ods1nh],
.reminder-section[b-6sg0ods1nh] {
    margin-top:16px;
}

.reference-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-6sg0ods1nh] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-6sg0ods1nh],
.timeline-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-6sg0ods1nh],
.timeline-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-6sg0ods1nh] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-6sg0ods1nh] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-6sg0ods1nh] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-6sg0ods1nh] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-6sg0ods1nh] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-6sg0ods1nh] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-6sg0ods1nh],
    .preview-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-6sg0ods1nh] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-6sg0ods1nh] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-6sg0ods1nh] {
        grid-column:1 / -1;
    }

    .reference-grid[b-6sg0ods1nh],
    .timeline-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-6sg0ods1nh],
    .focus-grid[b-6sg0ods1nh],
    .citizen-source-grid[b-6sg0ods1nh],
    .preview-grid[b-6sg0ods1nh],
    .consent-grid[b-6sg0ods1nh],
    .source-photo-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .note-grid[b-6sg0ods1nh],
    .timeline-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-6sg0ods1nh] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-6sg0ods1nh] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-6sg0ods1nh] {
        margin:0 auto;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .service-section[b-6sg0ods1nh],
    .reason-section[b-6sg0ods1nh],
    .reminder-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size: 16px;
    line-height: 1.55;
}

.pollution-page[b-6sg0ods1nh]  .mud-typography,
.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-input-label,
.pollution-page[b-6sg0ods1nh]  .mud-select,
.pollution-page[b-6sg0ods1nh]  .mud-list-item-text,
.pollution-page[b-6sg0ods1nh]  .mud-button-label,
.pollution-page[b-6sg0ods1nh]  .mud-table-cell,
.pollution-page[b-6sg0ods1nh]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size: .92rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size: .90rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-6sg0ods1nh] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-6sg0ods1nh] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-6sg0ods1nh] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-6sg0ods1nh] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-6sg0ods1nh] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-6sg0ods1nh] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-6sg0ods1nh] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-6sg0ods1nh] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-6sg0ods1nh],
.pollution-list-panel[b-6sg0ods1nh],
.insight-panel[b-6sg0ods1nh] {
    border-radius: 20px;
}

.filter-panel[b-6sg0ods1nh] {
    padding: 20px;
}

.list-toolbar[b-6sg0ods1nh] {
    padding: 19px 20px;
}

.filter-heading p[b-6sg0ods1nh],
.list-toolbar p[b-6sg0ods1nh] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-6sg0ods1nh] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-6sg0ods1nh] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-6sg0ods1nh],
.service-unit-cell[b-6sg0ods1nh],
.provider-location-cell[b-6sg0ods1nh],
.queue-priority-cell[b-6sg0ods1nh],
.reason-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    min-width: 155px;
}

.provider-location-cell[b-6sg0ods1nh],
.reason-cell[b-6sg0ods1nh] {
    min-width: 215px;
}

.service-chip[b-6sg0ods1nh],
.priority-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.identity-chip[b-6sg0ods1nh] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-6sg0ods1nh] {
    min-width: 205px;
    gap: 7px;
}

.pollution-page[b-6sg0ods1nh]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-6sg0ods1nh] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-6sg0ods1nh],
.view-toolbar[b-6sg0ods1nh],
.image-preview-header[b-6sg0ods1nh] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-6sg0ods1nh],
.view-scroll[b-6sg0ods1nh] {
    padding: 20px;
}

.modal-footer[b-6sg0ods1nh] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-6sg0ods1nh] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-6sg0ods1nh] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-6sg0ods1nh],
.preview-grid > div[b-6sg0ods1nh],
.reference-grid > div[b-6sg0ods1nh],
.timeline-grid > div[b-6sg0ods1nh] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-6sg0ods1nh] {
    padding: 13px;
}

.photo-preview[b-6sg0ods1nh] {
    min-height: 200px;
}

.photo-preview img[b-6sg0ods1nh] {
    height: 200px;
}

.history-item[b-6sg0ods1nh] {
    padding: 12px;
}

.attachment-card[b-6sg0ods1nh],
.attachment-card img[b-6sg0ods1nh] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .pollution-page[b-6sg0ods1nh] {
        font-size: 15px;
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-6sg0ods1nh] {
        min-height: 122px;
    }

    .status-overview-card[b-6sg0ods1nh],
    .service-overview-card[b-6sg0ods1nh] {
        min-height: 82px;
    }

    .modal-body[b-6sg0ods1nh],
    .view-scroll[b-6sg0ods1nh] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #pollution-profile-print-area[b-6sg0ods1nh] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #pollution-profile-print-area h1[b-6sg0ods1nh] {
        font-size: 18pt !important;
    }

    #pollution-profile-print-area h2[b-6sg0ods1nh] {
        font-size: 14pt !important;
    }

    #pollution-profile-print-area h3[b-6sg0ods1nh] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-6sg0ods1nh] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.follow-up > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.referred > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.cancelled > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.month > span[b-6sg0ods1nh] { background:#73569b; }

.service-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-6sg0ods1nh] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-6sg0ods1nh] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-6sg0ods1nh] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-6sg0ods1nh],
.service-unit-cell[b-6sg0ods1nh],
.provider-location-cell[b-6sg0ods1nh],
.result-cell[b-6sg0ods1nh],
.follow-score-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-6sg0ods1nh],
.result-cell[b-6sg0ods1nh] {
    min-width:230px;
}

.history-date-cell strong[b-6sg0ods1nh],
.service-unit-cell strong[b-6sg0ods1nh],
.provider-location-cell strong[b-6sg0ods1nh],
.result-cell strong[b-6sg0ods1nh],
.follow-score-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-6sg0ods1nh],
.service-unit-cell small[b-6sg0ods1nh],
.provider-location-cell small[b-6sg0ods1nh],
.result-cell small[b-6sg0ods1nh],
.follow-score-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-6sg0ods1nh],
.provider-location-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.referred[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-6sg0ods1nh] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-6sg0ods1nh] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-6sg0ods1nh] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-6sg0ods1nh] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-6sg0ods1nh],
.source-actions button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-6sg0ods1nh] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-6sg0ods1nh] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-6sg0ods1nh] {
    min-height:180px;
}

.source-photo-card img[b-6sg0ods1nh] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-6sg0ods1nh] {
    margin-top:18px;
}

.vital-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-6sg0ods1nh],
.quality-grid > div[b-6sg0ods1nh],
.follow-up-grid > div[b-6sg0ods1nh] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-6sg0ods1nh],
.quality-grid span[b-6sg0ods1nh],
.follow-up-grid span[b-6sg0ods1nh] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-6sg0ods1nh],
.quality-grid strong[b-6sg0ods1nh],
.follow-up-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-6sg0ods1nh] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-6sg0ods1nh],
.quality-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:.94rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:.92rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-6sg0ods1nh] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-6sg0ods1nh] { background:rgba(104,120,114,.89); }

.view-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-6sg0ods1nh],
    .service-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-6sg0ods1nh],
    .vital-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-6sg0ods1nh] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-6sg0ods1nh],
    .quality-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-6sg0ods1nh],
    .service-overview[b-6sg0ods1nh],
    .care-metrics[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .source-photo-grid[b-6sg0ods1nh],
    .vital-grid[b-6sg0ods1nh],
    .follow-up-grid[b-6sg0ods1nh],
    .quality-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-6sg0ods1nh] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.follow-up > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.referred > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.overdue > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.inactive > span[b-6sg0ods1nh] { background:#687872; }

.risk-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-6sg0ods1nh],
.risk-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-6sg0ods1nh] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-6sg0ods1nh],
.care-metrics strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-6sg0ods1nh],
.care-metrics small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-6sg0ods1nh] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-6sg0ods1nh],
.risk-adl-cell[b-6sg0ods1nh],
.dependency-living-cell[b-6sg0ods1nh],
.caregiver-cell[b-6sg0ods1nh],
.follow-up-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-6sg0ods1nh] {
    min-width:190px;
}

.register-age-cell strong[b-6sg0ods1nh],
.risk-adl-cell strong[b-6sg0ods1nh],
.dependency-living-cell strong[b-6sg0ods1nh],
.caregiver-cell strong[b-6sg0ods1nh],
.follow-up-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-6sg0ods1nh],
.risk-adl-cell small[b-6sg0ods1nh],
.dependency-living-cell small[b-6sg0ods1nh],
.caregiver-cell small[b-6sg0ods1nh],
.follow-up-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-6sg0ods1nh],
.caregiver-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-6sg0ods1nh],
.dependency-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.identity-chip[b-6sg0ods1nh],
.overdue-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.risk-chip.high[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.active[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.referred[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.overdue-chip[b-6sg0ods1nh] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-6sg0ods1nh] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-6sg0ods1nh] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-6sg0ods1nh] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-6sg0ods1nh] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-6sg0ods1nh],
.source-actions button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-6sg0ods1nh] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-6sg0ods1nh] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-6sg0ods1nh] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-6sg0ods1nh],
.reference-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-6sg0ods1nh],
.reference-grid > div[b-6sg0ods1nh],
.care-plan-grid > div[b-6sg0ods1nh] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-6sg0ods1nh],
.reference-grid span[b-6sg0ods1nh],
.care-plan-grid span[b-6sg0ods1nh] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-6sg0ods1nh],
.reference-grid strong[b-6sg0ods1nh],
.care-plan-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-6sg0ods1nh] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:.96rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:.94rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-6sg0ods1nh] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-6sg0ods1nh] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-6sg0ods1nh] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-6sg0ods1nh] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-6sg0ods1nh],
    .assessment-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-6sg0ods1nh],
    .risk-overview[b-6sg0ods1nh],
    .dependency-grid[b-6sg0ods1nh],
    .care-metrics[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .assessment-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .care-plan-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:16.5px;
    line-height:1.62;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-6sg0ods1nh] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-6sg0ods1nh] { background:#73569b; }
.status-overview-card.field > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.completed > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.follow-up > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.referred > span[b-6sg0ods1nh] { background:#b55b82; }

.visit-type-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-6sg0ods1nh],
.visit-type-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-6sg0ods1nh] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-6sg0ods1nh] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-6sg0ods1nh] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-6sg0ods1nh] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-6sg0ods1nh],
.care-metrics strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-6sg0ods1nh],
.care-metrics small[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-6sg0ods1nh],
.visit-type-cell[b-6sg0ods1nh],
.team-location-cell[b-6sg0ods1nh],
.result-cell[b-6sg0ods1nh],
.follow-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-6sg0ods1nh],
.result-cell[b-6sg0ods1nh] {
    min-width:230px;
}

.visit-date-cell strong[b-6sg0ods1nh],
.visit-type-cell strong[b-6sg0ods1nh],
.team-location-cell strong[b-6sg0ods1nh],
.result-cell strong[b-6sg0ods1nh],
.follow-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-6sg0ods1nh],
.visit-type-cell small[b-6sg0ods1nh],
.team-location-cell small[b-6sg0ods1nh],
.result-cell small[b-6sg0ods1nh],
.follow-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-6sg0ods1nh],
.team-location-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.identity-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.referred[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.priority-text[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-6sg0ods1nh] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-6sg0ods1nh] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-6sg0ods1nh] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-6sg0ods1nh] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-6sg0ods1nh] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-6sg0ods1nh] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-6sg0ods1nh],
.reference-grid > div[b-6sg0ods1nh] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-6sg0ods1nh],
.reference-grid span[b-6sg0ods1nh] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-6sg0ods1nh],
.reference-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:.98rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-6sg0ods1nh],
    .visit-type-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-6sg0ods1nh],
    .visit-type-overview[b-6sg0ods1nh],
    .target-grid[b-6sg0ods1nh],
    .care-metrics[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .vital-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:17px;
    line-height:1.65;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-6sg0ods1nh] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.review > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.eligible > span[b-6sg0ods1nh] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.paid > span[b-6sg0ods1nh] { background:#73569b; }

.type-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-6sg0ods1nh],
.type-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-6sg0ods1nh] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-6sg0ods1nh] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-6sg0ods1nh] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-6sg0ods1nh],
.target-grid button[b-6sg0ods1nh] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-6sg0ods1nh],
.welfare-type-cell[b-6sg0ods1nh],
.household-cell[b-6sg0ods1nh],
.amount-cell[b-6sg0ods1nh],
.officer-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-6sg0ods1nh],
.officer-cell[b-6sg0ods1nh] {
    min-width:210px;
}

.application-no-cell strong[b-6sg0ods1nh],
.welfare-type-cell strong[b-6sg0ods1nh],
.household-cell strong[b-6sg0ods1nh],
.amount-cell strong[b-6sg0ods1nh],
.officer-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-6sg0ods1nh],
.welfare-type-cell small[b-6sg0ods1nh],
.household-cell small[b-6sg0ods1nh],
.amount-cell small[b-6sg0ods1nh],
.officer-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-6sg0ods1nh],
.household-cell em[b-6sg0ods1nh],
.amount-cell em[b-6sg0ods1nh],
.officer-cell em[b-6sg0ods1nh],
.citizen-photo-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.source-group-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.source-group-chip[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-6sg0ods1nh] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-6sg0ods1nh],
.amount-preview[b-6sg0ods1nh] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-6sg0ods1nh] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-6sg0ods1nh] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-6sg0ods1nh],
.amount-preview > div[b-6sg0ods1nh] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-6sg0ods1nh],
.amount-preview small[b-6sg0ods1nh] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-6sg0ods1nh] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-6sg0ods1nh],
.amount-preview strong[b-6sg0ods1nh] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-6sg0ods1nh],
.amount-preview span[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-6sg0ods1nh] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-6sg0ods1nh],
.amount-document-grid small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-6sg0ods1nh] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-6sg0ods1nh] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-6sg0ods1nh] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1.02rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-6sg0ods1nh] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-6sg0ods1nh],
    .type-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-6sg0ods1nh],
    .type-overview[b-6sg0ods1nh],
    .budget-grid[b-6sg0ods1nh],
    .target-grid[b-6sg0ods1nh],
    .care-metrics[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .assessment-preview[b-6sg0ods1nh],
    .amount-preview[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:17px;
    line-height:1.66;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-6sg0ods1nh] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-6sg0ods1nh] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-6sg0ods1nh] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.payment > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.suspended > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.expiring > span[b-6sg0ods1nh] { background:#73569b; }

.target-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-6sg0ods1nh],
.target-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-6sg0ods1nh] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-6sg0ods1nh] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-6sg0ods1nh] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-6sg0ods1nh],
.follow-grid button[b-6sg0ods1nh] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-6sg0ods1nh] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-6sg0ods1nh],
.benefit-cell[b-6sg0ods1nh],
.period-cell[b-6sg0ods1nh],
.amount-cell[b-6sg0ods1nh],
.payment-cycle-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-6sg0ods1nh] {
    min-width:225px;
}

.registry-cell strong[b-6sg0ods1nh],
.benefit-cell strong[b-6sg0ods1nh],
.period-cell strong[b-6sg0ods1nh],
.amount-cell strong[b-6sg0ods1nh],
.payment-cycle-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-6sg0ods1nh],
.benefit-cell small[b-6sg0ods1nh],
.period-cell small[b-6sg0ods1nh],
.amount-cell small[b-6sg0ods1nh],
.payment-cycle-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-6sg0ods1nh],
.period-cell em[b-6sg0ods1nh],
.amount-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-6sg0ods1nh],
.cycle-chip[b-6sg0ods1nh],
.verify-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.source-group-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-6sg0ods1nh] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.expired[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.source-group-chip[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-6sg0ods1nh] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-6sg0ods1nh] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-6sg0ods1nh] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-6sg0ods1nh] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1.02rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-6sg0ods1nh] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-6sg0ods1nh] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-6sg0ods1nh],
    .target-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-6sg0ods1nh],
    .target-overview[b-6sg0ods1nh],
    .amount-metrics[b-6sg0ods1nh],
    .follow-grid[b-6sg0ods1nh],
    .condition-switch-grid[b-6sg0ods1nh],
    .amount-preview[b-6sg0ods1nh],
    .source-data-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .patient-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:17px;
    line-height:1.66;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-6sg0ods1nh] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-6sg0ods1nh] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-6sg0ods1nh] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-6sg0ods1nh] { background:#687872; }
.status-overview-card.approval > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.processing > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.paid > span[b-6sg0ods1nh] { background:#34734b; }
.status-overview-card.failed > span[b-6sg0ods1nh] { background:#b54d43; }

.disbursement-progress[b-6sg0ods1nh] {
    margin-top:15px;
}

.disbursement-progress > div[b-6sg0ods1nh] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-6sg0ods1nh] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-6sg0ods1nh],
.amount-cell[b-6sg0ods1nh],
.progress-cell[b-6sg0ods1nh],
.date-cell[b-6sg0ods1nh],
.control-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-6sg0ods1nh] {
    min-width:245px;
}

.batch-cell strong[b-6sg0ods1nh],
.amount-cell strong[b-6sg0ods1nh],
.progress-cell strong[b-6sg0ods1nh],
.date-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-6sg0ods1nh],
.amount-cell small[b-6sg0ods1nh],
.progress-cell small[b-6sg0ods1nh],
.date-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-6sg0ods1nh],
.amount-cell em[b-6sg0ods1nh],
.date-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-6sg0ods1nh] {
    min-width:180px;
}

.recipient-stack[b-6sg0ods1nh] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-6sg0ods1nh],
.recipient-stack span[b-6sg0ods1nh] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-6sg0ods1nh] {
    margin-left:0;
}

.recipient-stack img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-6sg0ods1nh] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-6sg0ods1nh] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-6sg0ods1nh],
.approval-chip[b-6sg0ods1nh],
.reconcile-chip[b-6sg0ods1nh],
.cycle-chip[b-6sg0ods1nh],
.line-status-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.approved[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.control-cell[b-6sg0ods1nh] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-6sg0ods1nh] {
    align-items:center;
}

.selection-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-6sg0ods1nh] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-6sg0ods1nh] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-6sg0ods1nh] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-6sg0ods1nh] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-6sg0ods1nh] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-6sg0ods1nh] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-6sg0ods1nh],
.source-selection-table td[b-6sg0ods1nh] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-6sg0ods1nh] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-6sg0ods1nh] {
    background:#f0faf6;
}

.source-person-cell[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-6sg0ods1nh] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-6sg0ods1nh],
.source-benefit-cell strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-6sg0ods1nh],
.source-benefit-cell small[b-6sg0ods1nh],
.source-date[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-6sg0ods1nh] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-6sg0ods1nh] {
    min-width:190px;
}

.source-amount[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-6sg0ods1nh] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-6sg0ods1nh] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-6sg0ods1nh] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-6sg0ods1nh] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-6sg0ods1nh] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-6sg0ods1nh] {
    font-size:3.5rem;
}

.batch-overview-content small[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-6sg0ods1nh] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-6sg0ods1nh] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-6sg0ods1nh] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-6sg0ods1nh],
.print-line-table td[b-6sg0ods1nh] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-6sg0ods1nh] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-6sg0ods1nh],
.print-line-table td small[b-6sg0ods1nh] {
    display:block;
}

.print-line-table td small[b-6sg0ods1nh] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-6sg0ods1nh] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-6sg0ods1nh] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-6sg0ods1nh] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-6sg0ods1nh] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-6sg0ods1nh] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-6sg0ods1nh] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-6sg0ods1nh] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-6sg0ods1nh] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-6sg0ods1nh] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-6sg0ods1nh] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-6sg0ods1nh] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-6sg0ods1nh] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1.02rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-6sg0ods1nh],
    .recipient-detail-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-6sg0ods1nh] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-6sg0ods1nh] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-6sg0ods1nh],
    .amount-metrics[b-6sg0ods1nh],
    .follow-grid[b-6sg0ods1nh],
    .source-selection-summary[b-6sg0ods1nh],
    .amount-preview[b-6sg0ods1nh],
    .recipient-detail-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-6sg0ods1nh] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-6sg0ods1nh] {
        overflow-x:auto;
    }

    .source-selection-table[b-6sg0ods1nh] {
        min-width:1050px;
    }

    .batch-overview-panel[b-6sg0ods1nh],
    .recipient-detail-card[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-6sg0ods1nh] {
        width:100%;
        height:190px;
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .batch-overview-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:17px;
    line-height:1.66;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-6sg0ods1nh] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-6sg0ods1nh] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-6sg0ods1nh],
.type-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-6sg0ods1nh] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.full > span[b-6sg0ods1nh] { background:#c56b2a; }
.status-overview-card.overflow > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.maintenance > span[b-6sg0ods1nh] { background:#73569b; }

.type-overview[b-6sg0ods1nh] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-6sg0ods1nh],
.type-overview-card.selected[b-6sg0ods1nh] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-6sg0ods1nh] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-6sg0ods1nh] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-6sg0ods1nh] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-6sg0ods1nh] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-6sg0ods1nh] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-6sg0ods1nh] {
    margin-top:15px;
}

.fill-progress > div[b-6sg0ods1nh] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-6sg0ods1nh] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-6sg0ods1nh] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-6sg0ods1nh] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-6sg0ods1nh] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-6sg0ods1nh] {
    background:#987634;
}

.map-pin.full[b-6sg0ods1nh] {
    background:#c56b2a;
}

.map-pin.overflow[b-6sg0ods1nh] {
    background:#b54d43;
}

.map-pin.maintenance[b-6sg0ods1nh] {
    background:#73569b;
}

.map-pin.inactive[b-6sg0ods1nh] {
    background:#687872;
}

.map-pin span[b-6sg0ods1nh] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-6sg0ods1nh] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-6sg0ods1nh] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-6sg0ods1nh] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-6sg0ods1nh] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-6sg0ods1nh] { background:#987634; }
.map-board-legend i.full[b-6sg0ods1nh] { background:#b54d43; }
.map-board-legend i.maintenance[b-6sg0ods1nh] { background:#73569b; }

.map-board-caption[b-6sg0ods1nh] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-6sg0ods1nh],
.map-board-caption small[b-6sg0ods1nh] {
    display:block;
}

.map-board-caption strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-6sg0ods1nh] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.point-photo-cell[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-6sg0ods1nh] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.point-photo-cell em[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-6sg0ods1nh],
.bin-cell[b-6sg0ods1nh],
.fill-cell[b-6sg0ods1nh],
.collection-cell[b-6sg0ods1nh],
.sensor-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-6sg0ods1nh] {
    min-width:220px;
}

.location-cell strong[b-6sg0ods1nh],
.bin-cell strong[b-6sg0ods1nh],
.fill-cell strong[b-6sg0ods1nh],
.collection-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-6sg0ods1nh],
.bin-cell small[b-6sg0ods1nh],
.fill-cell small[b-6sg0ods1nh],
.collection-cell small[b-6sg0ods1nh],
.sensor-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.location-cell em[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.waste-type-chip[b-6sg0ods1nh],
.collection-chip[b-6sg0ods1nh],
.sensor-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.waste-type-chip.general[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.status-chip.active[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.full[b-6sg0ods1nh] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.table-progress[b-6sg0ods1nh] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-6sg0ods1nh] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-6sg0ods1nh] { background:var(--theme-primary); }
.table-progress.medium span[b-6sg0ods1nh] { background:#2f789f; }
.table-progress.high span[b-6sg0ods1nh] { background:#987634; }
.table-progress.critical span[b-6sg0ods1nh] { background:#b54d43; }

.repair-alert[b-6sg0ods1nh],
.clean-alert[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-6sg0ods1nh] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-6sg0ods1nh] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-6sg0ods1nh] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-6sg0ods1nh] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-6sg0ods1nh] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-6sg0ods1nh] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-6sg0ods1nh] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-6sg0ods1nh] { background:#2f789f; }
.fill-preview-bin.high span[b-6sg0ods1nh] { background:#987634; }
.fill-preview-bin.critical span[b-6sg0ods1nh] { background:#b54d43; }

.fill-preview-bin strong[b-6sg0ods1nh] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-6sg0ods1nh] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.source-photo-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-6sg0ods1nh] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-6sg0ods1nh] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-6sg0ods1nh] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.large-fill-indicator[b-6sg0ods1nh] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-6sg0ods1nh] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-6sg0ods1nh] { background:#2f789f; }
.large-fill-indicator.high > span[b-6sg0ods1nh] { background:#987634; }
.large-fill-indicator.critical > span[b-6sg0ods1nh] { background:#b54d43; }

.large-fill-indicator strong[b-6sg0ods1nh],
.large-fill-indicator small[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-6sg0ods1nh] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-6sg0ods1nh] {
    font-size:.84rem;
}

.detail-map-preview[b-6sg0ods1nh] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-6sg0ods1nh] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-6sg0ods1nh] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-6sg0ods1nh] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-6sg0ods1nh] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-6sg0ods1nh] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.workflow-button.collect[b-6sg0ods1nh] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-6sg0ods1nh] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1.02rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-6sg0ods1nh],
    .type-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-6sg0ods1nh] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-6sg0ods1nh] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-6sg0ods1nh] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-6sg0ods1nh] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-6sg0ods1nh],
    .type-overview[b-6sg0ods1nh],
    .amount-metrics[b-6sg0ods1nh],
    .follow-grid[b-6sg0ods1nh],
    .condition-switch-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-6sg0ods1nh],
    .fill-preview-card[b-6sg0ods1nh],
    .coordinate-preview[b-6sg0ods1nh],
    .collection-history-list article[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-6sg0ods1nh] {
        min-height:240px;
    }

    .large-fill-indicator[b-6sg0ods1nh],
    .fill-preview-bin[b-6sg0ods1nh],
    .coordinate-pin[b-6sg0ods1nh] {
        margin:0 auto;
    }

    .map-board[b-6sg0ods1nh] {
        min-height:500px;
    }

    .map-pin[b-6sg0ods1nh] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .point-cover-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pollution-page[b-6sg0ods1nh] {
    font-size:17px;
    line-height:1.68;
}

.pollution-hero[b-6sg0ods1nh] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-6sg0ods1nh] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-6sg0ods1nh] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-6sg0ods1nh] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-6sg0ods1nh] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-6sg0ods1nh] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-6sg0ods1nh] { background:#b54d43; }
.status-overview-card.received > span[b-6sg0ods1nh] { background:#987634; }
.status-overview-card.inspecting > span[b-6sg0ods1nh] { background:#2f789f; }
.status-overview-card.in-progress > span[b-6sg0ods1nh] { background:#73569b; }
.status-overview-card.resolved > span[b-6sg0ods1nh] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-6sg0ods1nh] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-6sg0ods1nh]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-6sg0ods1nh],
.pollution-type-card.selected[b-6sg0ods1nh] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-6sg0ods1nh] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.pollution-type-card strong[b-6sg0ods1nh] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-6sg0ods1nh] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-6sg0ods1nh] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-6sg0ods1nh] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-6sg0ods1nh] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-6sg0ods1nh] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-6sg0ods1nh] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-6sg0ods1nh] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-6sg0ods1nh] {
    margin-top:18px;
}

.sla-progress > div[b-6sg0ods1nh] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-6sg0ods1nh] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-6sg0ods1nh] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-6sg0ods1nh] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-6sg0ods1nh] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-6sg0ods1nh] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-6sg0ods1nh] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-6sg0ods1nh] { background:#2f789f; }
.pollution-map-pin.medium[b-6sg0ods1nh] { background:#987634; }
.pollution-map-pin.high[b-6sg0ods1nh] { background:#c56b2a; }
.pollution-map-pin.critical[b-6sg0ods1nh] { background:#b54d43; }

.pollution-map-pin span[b-6sg0ods1nh] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-6sg0ods1nh] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-6sg0ods1nh] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-6sg0ods1nh] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-6sg0ods1nh] { background:#2f789f; }
.map-board-legend i.medium[b-6sg0ods1nh] { background:#987634; }
.map-board-legend i.high[b-6sg0ods1nh] { background:#c56b2a; }
.map-board-legend i.critical[b-6sg0ods1nh] { background:#b54d43; }

.map-board-caption[b-6sg0ods1nh] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-6sg0ods1nh],
.map-board-caption small[b-6sg0ods1nh] {
    display:block;
}

.map-board-caption strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-6sg0ods1nh] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-6sg0ods1nh] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.complaint-photo-cell em[b-6sg0ods1nh] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.type-severity-cell[b-6sg0ods1nh],
.reporter-cell[b-6sg0ods1nh],
.location-cell[b-6sg0ods1nh],
.inspection-cell[b-6sg0ods1nh],
.status-cell[b-6sg0ods1nh] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-6sg0ods1nh],
.location-cell[b-6sg0ods1nh] {
    min-width:195px;
}

.reporter-cell strong[b-6sg0ods1nh],
.location-cell strong[b-6sg0ods1nh],
.inspection-cell strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-6sg0ods1nh],
.location-cell small[b-6sg0ods1nh],
.inspection-cell small[b-6sg0ods1nh],
.status-cell small[b-6sg0ods1nh] {
    color:#71837a;
    font-size:.84rem;
}

.reporter-cell em[b-6sg0ods1nh],
.location-cell em[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.pollution-type-chip[b-6sg0ods1nh],
.severity-chip[b-6sg0ods1nh],
.inspection-chip[b-6sg0ods1nh],
.status-chip[b-6sg0ods1nh],
.overdue-chip[b-6sg0ods1nh] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.pollution-type-chip.air[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-6sg0ods1nh] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-6sg0ods1nh] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.severity-chip.high[b-6sg0ods1nh] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-6sg0ods1nh] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-6sg0ods1nh] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-6sg0ods1nh] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-6sg0ods1nh] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-6sg0ods1nh] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-6sg0ods1nh] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-6sg0ods1nh] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-6sg0ods1nh] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-6sg0ods1nh] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* FORM */

.anonymous-switch-card[b-6sg0ods1nh] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-6sg0ods1nh],
.anonymous-switch-card small[b-6sg0ods1nh] {
    display:block;
}

.anonymous-switch-card strong[b-6sg0ods1nh] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-6sg0ods1nh] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.coordinate-preview[b-6sg0ods1nh] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-6sg0ods1nh],
.map-board-grid[b-6sg0ods1nh] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-6sg0ods1nh] { background:#c56b2a; }
.coordinate-pin.critical[b-6sg0ods1nh] { background:#b54d43; }
.coordinate-pin.medium[b-6sg0ods1nh] { background:#987634; }

.coordinate-pin .mud-icon-root[b-6sg0ods1nh] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-6sg0ods1nh] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-6sg0ods1nh] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-6sg0ods1nh] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.source-point-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-6sg0ods1nh] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-condition-row[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:750;
}

.source-condition-row span.warning[b-6sg0ods1nh] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-6sg0ods1nh] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-6sg0ods1nh] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-6sg0ods1nh] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-6sg0ods1nh] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-6sg0ods1nh] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-6sg0ods1nh] { color:#987634; background:#fff4df; }

.measurement-preview small[b-6sg0ods1nh],
.measurement-preview strong[b-6sg0ods1nh],
.measurement-preview em[b-6sg0ods1nh] {
    display:block;
}

.measurement-preview small[b-6sg0ods1nh] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-preview strong[b-6sg0ods1nh] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-6sg0ods1nh] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

.source-photo-preview[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-6sg0ods1nh] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-6sg0ods1nh] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-6sg0ods1nh] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-6sg0ods1nh] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-6sg0ods1nh] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-6sg0ods1nh] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-6sg0ods1nh] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-6sg0ods1nh] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-6sg0ods1nh] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-6sg0ods1nh] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.severity-emblem[b-6sg0ods1nh] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-6sg0ods1nh] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-6sg0ods1nh] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-6sg0ods1nh] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-6sg0ods1nh] {
    font-size:2.25rem;
}

.severity-emblem strong[b-6sg0ods1nh] {
    font-size:1.10rem;
}

.severity-emblem small[b-6sg0ods1nh] {
    font-size:.84rem;
}

.measurement-document-grid[b-6sg0ods1nh] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-6sg0ods1nh] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-6sg0ods1nh],
.measurement-document-grid strong[b-6sg0ods1nh] {
    display:block;
}

.measurement-document-grid span[b-6sg0ods1nh] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-document-grid strong[b-6sg0ods1nh] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-6sg0ods1nh] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-6sg0ods1nh] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-6sg0ods1nh] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-6sg0ods1nh] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-6sg0ods1nh] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-6sg0ods1nh] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-6sg0ods1nh] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-6sg0ods1nh] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-6sg0ods1nh] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-6sg0ods1nh] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-6sg0ods1nh] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-6sg0ods1nh] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-6sg0ods1nh] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-6sg0ods1nh] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-6sg0ods1nh] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-6sg0ods1nh] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pollution-page[b-6sg0ods1nh]  .mud-input,
.pollution-page[b-6sg0ods1nh]  .mud-select-input {
    font-size:1.02rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-list-item-text {
    font-size:1rem !important;
}

.pollution-page[b-6sg0ods1nh]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-6sg0ods1nh],
    .measurement-document-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-6sg0ods1nh] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-6sg0ods1nh] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-6sg0ods1nh] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-6sg0ods1nh] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-6sg0ods1nh],
    .source-photo-preview[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-6sg0ods1nh],
    .source-photo-preview button[b-6sg0ods1nh] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-6sg0ods1nh],
    .pollution-type-overview[b-6sg0ods1nh],
    .amount-metrics[b-6sg0ods1nh],
    .follow-grid[b-6sg0ods1nh],
    .measurement-preview[b-6sg0ods1nh],
    .measurement-document-grid[b-6sg0ods1nh],
    .reference-grid[b-6sg0ods1nh],
    .amount-document-grid[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-6sg0ods1nh],
    .coordinate-preview[b-6sg0ods1nh] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-6sg0ods1nh] {
        height:250px;
    }

    .coordinate-pin[b-6sg0ods1nh] {
        margin:0 auto;
    }

    .pollution-map-board[b-6sg0ods1nh] {
        min-height:500px;
    }

    .pollution-page[b-6sg0ods1nh]  .pollution-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #pollution-profile-print-area[b-6sg0ods1nh],
    #pollution-profile-print-area *[b-6sg0ods1nh] {
        visibility:visible !important;
    }

    #pollution-profile-print-area[b-6sg0ods1nh] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pollution-view-modal[b-6sg0ods1nh] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-6sg0ods1nh],
    .document-status-strip[b-6sg0ods1nh],
    .complaint-cover-panel[b-6sg0ods1nh],
    .document-section[b-6sg0ods1nh],
    .document-footer[b-6sg0ods1nh] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/05Environment/WasteCollectionSchedule.razor.rz.scp.css */
:root[b-mbyqv3mrj9] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.collection-page[b-mbyqv3mrj9] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.collection-page[b-mbyqv3mrj9]  .collection-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.collection-hero[b-mbyqv3mrj9] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-mbyqv3mrj9] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-mbyqv3mrj9] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-mbyqv3mrj9],
.hero-action-panel[b-mbyqv3mrj9] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-mbyqv3mrj9] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-mbyqv3mrj9] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-mbyqv3mrj9] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-mbyqv3mrj9] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-mbyqv3mrj9] {
    margin-top: 3px;
    font-size: .94rem;
}

.collection-hero h1[b-mbyqv3mrj9] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.collection-hero p[b-mbyqv3mrj9] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-mbyqv3mrj9] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-mbyqv3mrj9] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-mbyqv3mrj9] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-mbyqv3mrj9] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-mbyqv3mrj9] {
    font-size: .85rem;
}

.hero-status small[b-mbyqv3mrj9] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.collection-page[b-mbyqv3mrj9]  .hero-add-button,
.collection-page[b-mbyqv3mrj9]  .toolbar-add-button,
.collection-page[b-mbyqv3mrj9]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.collection-page[b-mbyqv3mrj9]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-mbyqv3mrj9],
.hero-refresh-button[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-mbyqv3mrj9] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-mbyqv3mrj9] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-mbyqv3mrj9] {
    opacity: .55;
    cursor: wait;
}

.collection-page[b-mbyqv3mrj9]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.collection-page[b-mbyqv3mrj9]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-mbyqv3mrj9] {
    margin-top: 2px !important;
}

.summary-card[b-mbyqv3mrj9] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-mbyqv3mrj9] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-mbyqv3mrj9] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-mbyqv3mrj9] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-mbyqv3mrj9] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-mbyqv3mrj9] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-mbyqv3mrj9] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-mbyqv3mrj9] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-mbyqv3mrj9] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-mbyqv3mrj9] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-mbyqv3mrj9] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-mbyqv3mrj9] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-mbyqv3mrj9] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-mbyqv3mrj9],
.status-overview-card.selected[b-mbyqv3mrj9] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-mbyqv3mrj9] {
    background: #f5faf7;
}

.status-overview-card > span[b-mbyqv3mrj9] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-mbyqv3mrj9] { background:#687872; }
.status-overview-card.reviewing > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.difference > span[b-mbyqv3mrj9] { background:#b54d43; }
.status-overview-card.approved > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.closed > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.voided > span[b-mbyqv3mrj9] { background:#687872; }
.status-overview-card.today > span[b-mbyqv3mrj9] { background:#73569b; }

.status-overview-card div[b-mbyqv3mrj9] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-mbyqv3mrj9] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-mbyqv3mrj9] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-mbyqv3mrj9] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-mbyqv3mrj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-mbyqv3mrj9] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-mbyqv3mrj9] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-mbyqv3mrj9] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-mbyqv3mrj9] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-mbyqv3mrj9] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-mbyqv3mrj9] {
    margin-top: 13px;
}

.progress-track[b-mbyqv3mrj9] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-mbyqv3mrj9] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-mbyqv3mrj9] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-mbyqv3mrj9] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-mbyqv3mrj9] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-mbyqv3mrj9],
.collection-list-panel[b-mbyqv3mrj9] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-mbyqv3mrj9] {
    padding: 15px;
}

.filter-heading[b-mbyqv3mrj9],
.list-toolbar[b-mbyqv3mrj9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-mbyqv3mrj9],
.panel-kicker[b-mbyqv3mrj9] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-mbyqv3mrj9],
.list-toolbar h2[b-mbyqv3mrj9] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-mbyqv3mrj9],
.list-toolbar p[b-mbyqv3mrj9] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-mbyqv3mrj9] {
    margin-top: 8px !important;
}

.collection-page[b-mbyqv3mrj9]  .premium-field,
.collection-page[b-mbyqv3mrj9]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.collection-page[b-mbyqv3mrj9]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-mbyqv3mrj9] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-mbyqv3mrj9] {
    color: var(--theme-primary);
}

.collection-list-panel[b-mbyqv3mrj9] {
    overflow: hidden;
}

.list-toolbar[b-mbyqv3mrj9] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-page[b-mbyqv3mrj9]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-mbyqv3mrj9] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-mbyqv3mrj9] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-mbyqv3mrj9] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-mbyqv3mrj9] {
    margin: 0;
    font-size: .84rem;
}

.collection-page[b-mbyqv3mrj9]  .collection-table {
    font-family: 'Kanit',sans-serif;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head {
    background: #f1f7f4;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-mbyqv3mrj9] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-mbyqv3mrj9] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-mbyqv3mrj9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-mbyqv3mrj9] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-mbyqv3mrj9],
.counter-cashier-cell[b-mbyqv3mrj9],
.money-cell[b-mbyqv3mrj9],
.difference-cell[b-mbyqv3mrj9],
.transaction-status-cell[b-mbyqv3mrj9] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-mbyqv3mrj9] {
    min-width: 175px;
}

.date-shift-cell strong[b-mbyqv3mrj9],
.counter-cashier-cell strong[b-mbyqv3mrj9],
.money-cell strong[b-mbyqv3mrj9],
.difference-cell strong[b-mbyqv3mrj9],
.transaction-status-cell strong[b-mbyqv3mrj9] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-mbyqv3mrj9],
.counter-cashier-cell small[b-mbyqv3mrj9],
.money-cell small[b-mbyqv3mrj9],
.difference-cell small[b-mbyqv3mrj9] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-mbyqv3mrj9],
.counter-cashier-cell em[b-mbyqv3mrj9] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-mbyqv3mrj9] { color:var(--theme-primary); }
.money-cell.actual strong[b-mbyqv3mrj9] { color:#2f789f; }

.difference-cell.matched strong[b-mbyqv3mrj9] { color:#34734b; }
.difference-cell.over strong[b-mbyqv3mrj9] { color:#987634; }
.difference-cell.short strong[b-mbyqv3mrj9] { color:#b54d43; }

.status-chip[b-mbyqv3mrj9],
.match-chip[b-mbyqv3mrj9] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-mbyqv3mrj9] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.difference[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-mbyqv3mrj9] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-mbyqv3mrj9] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.collection-page[b-mbyqv3mrj9]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.collection-page[b-mbyqv3mrj9]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.collection-page[b-mbyqv3mrj9]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.collection-page[b-mbyqv3mrj9]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.collection-page[b-mbyqv3mrj9]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-mbyqv3mrj9] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-mbyqv3mrj9] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-mbyqv3mrj9],
.image-preview-backdrop[b-mbyqv3mrj9] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.collection-form-modal[b-mbyqv3mrj9],
.collection-view-modal[b-mbyqv3mrj9],
.delete-modal[b-mbyqv3mrj9],
.image-preview-modal[b-mbyqv3mrj9] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-mbyqv3mrj9],
.view-toolbar[b-mbyqv3mrj9],
.image-preview-header[b-mbyqv3mrj9] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-mbyqv3mrj9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-mbyqv3mrj9] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-mbyqv3mrj9],
.view-toolbar small[b-mbyqv3mrj9],
.image-preview-header small[b-mbyqv3mrj9] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-mbyqv3mrj9],
.view-toolbar h2[b-mbyqv3mrj9],
.image-preview-header h3[b-mbyqv3mrj9] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-mbyqv3mrj9] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-mbyqv3mrj9],
.view-scroll[b-mbyqv3mrj9] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-mbyqv3mrj9] {
    background: #e9efec;
}

.modal-footer[b-mbyqv3mrj9] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-page[b-mbyqv3mrj9]  .cancel-button,
.collection-page[b-mbyqv3mrj9]  .save-button,
.collection-page[b-mbyqv3mrj9]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-mbyqv3mrj9] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-mbyqv3mrj9] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-mbyqv3mrj9] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-mbyqv3mrj9] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-mbyqv3mrj9],
.calculation-heading[b-mbyqv3mrj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-mbyqv3mrj9],
.calculation-heading small[b-mbyqv3mrj9] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-mbyqv3mrj9],
.calculation-heading h3[b-mbyqv3mrj9] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-mbyqv3mrj9],
.calculation-heading > span[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-mbyqv3mrj9] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-mbyqv3mrj9] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-mbyqv3mrj9] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-mbyqv3mrj9] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-mbyqv3mrj9] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-mbyqv3mrj9] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-mbyqv3mrj9] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-mbyqv3mrj9] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-mbyqv3mrj9],
.calculation-grid .short strong[b-mbyqv3mrj9],
.calculation-grid .short small[b-mbyqv3mrj9] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-mbyqv3mrj9] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-mbyqv3mrj9] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-mbyqv3mrj9] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-mbyqv3mrj9] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-mbyqv3mrj9] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-mbyqv3mrj9] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-mbyqv3mrj9] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-mbyqv3mrj9] {
    font-size:.84rem;
}

.photo-upload-actions[b-mbyqv3mrj9] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-mbyqv3mrj9],
.remove-photo-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-mbyqv3mrj9] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-mbyqv3mrj9] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-mbyqv3mrj9] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-mbyqv3mrj9],
.detail-transaction-table[b-mbyqv3mrj9] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-mbyqv3mrj9],
.source-transaction-row[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-mbyqv3mrj9] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-mbyqv3mrj9],
.source-transaction-row > span[b-mbyqv3mrj9] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-mbyqv3mrj9] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-mbyqv3mrj9] {
    border-bottom:0;
}

.mini-photo-button[b-mbyqv3mrj9] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-mbyqv3mrj9],
.source-transaction-more[b-mbyqv3mrj9] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-mbyqv3mrj9] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.collection-view-modal[b-mbyqv3mrj9] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.collection-page[b-mbyqv3mrj9]  .view-edit-button,
.collection-page[b-mbyqv3mrj9]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.collection-page[b-mbyqv3mrj9]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-collection-profile[b-mbyqv3mrj9] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-mbyqv3mrj9] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-mbyqv3mrj9] {
    text-align:center;
}

.document-organization small[b-mbyqv3mrj9] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-mbyqv3mrj9] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-mbyqv3mrj9],
.document-number-box small[b-mbyqv3mrj9] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-mbyqv3mrj9] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-mbyqv3mrj9] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-mbyqv3mrj9] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-mbyqv3mrj9] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-mbyqv3mrj9],
.transaction-summary-section[b-mbyqv3mrj9],
.source-transaction-section[b-mbyqv3mrj9],
.review-section[b-mbyqv3mrj9] {
    margin-top:16px;
}

.section-title[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-mbyqv3mrj9] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-mbyqv3mrj9] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-mbyqv3mrj9] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-mbyqv3mrj9] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-mbyqv3mrj9],
.comparison-row[b-mbyqv3mrj9],
.comparison-total[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-mbyqv3mrj9] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-mbyqv3mrj9],
.comparison-row span[b-mbyqv3mrj9],
.comparison-total span[b-mbyqv3mrj9] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-mbyqv3mrj9] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-mbyqv3mrj9],
.comparison-total span:not(:first-child)[b-mbyqv3mrj9] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-mbyqv3mrj9] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-mbyqv3mrj9] { color:#34734b; }
.difference-text.over[b-mbyqv3mrj9] { color:#987634; }
.difference-text.short[b-mbyqv3mrj9] { color:#b54d43; }

.transaction-summary-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-mbyqv3mrj9] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-mbyqv3mrj9] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-mbyqv3mrj9] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-mbyqv3mrj9] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-mbyqv3mrj9] { background:#f4fafc; }

.transaction-summary-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-mbyqv3mrj9] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-mbyqv3mrj9],
.detail-transaction-row[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-mbyqv3mrj9] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-mbyqv3mrj9],
.detail-transaction-row span[b-mbyqv3mrj9] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-mbyqv3mrj9] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-mbyqv3mrj9] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-mbyqv3mrj9] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-mbyqv3mrj9] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-mbyqv3mrj9] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-mbyqv3mrj9] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-mbyqv3mrj9],
.attachment-panel[b-mbyqv3mrj9] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-mbyqv3mrj9] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-mbyqv3mrj9] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-mbyqv3mrj9] {
    display:grid;
    gap:7px;
}

.history-item[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-mbyqv3mrj9] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-mbyqv3mrj9] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-mbyqv3mrj9] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-mbyqv3mrj9],
.history-item em[b-mbyqv3mrj9] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-mbyqv3mrj9] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-mbyqv3mrj9] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-mbyqv3mrj9] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-mbyqv3mrj9] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.89); }

.attachment-empty[b-mbyqv3mrj9] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-mbyqv3mrj9] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-mbyqv3mrj9] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-mbyqv3mrj9] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-mbyqv3mrj9] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-mbyqv3mrj9] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-mbyqv3mrj9] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-mbyqv3mrj9] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-mbyqv3mrj9] {
    color:#b54d43;
}

.delete-warning[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-mbyqv3mrj9] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.collection-page[b-mbyqv3mrj9]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .collection-hero[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-mbyqv3mrj9] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-mbyqv3mrj9] {
        grid-column:1 / -1;
    }

    .document-header[b-mbyqv3mrj9] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-mbyqv3mrj9] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .collection-page[b-mbyqv3mrj9] {
        padding-top:10px;
    }

    .collection-page[b-mbyqv3mrj9]  .collection-container {
        padding-inline:10px !important;
    }

    .collection-hero[b-mbyqv3mrj9] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-mbyqv3mrj9],
    .list-toolbar[b-mbyqv3mrj9],
    .source-summary-heading[b-mbyqv3mrj9],
    .calculation-heading[b-mbyqv3mrj9],
    .view-toolbar[b-mbyqv3mrj9],
    .section-heading[b-mbyqv3mrj9] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-mbyqv3mrj9],
    .variance-grid[b-mbyqv3mrj9],
    .progress-metrics[b-mbyqv3mrj9],
    .source-summary-grid[b-mbyqv3mrj9],
    .system-amount-grid[b-mbyqv3mrj9],
    .calculation-grid[b-mbyqv3mrj9],
    .photo-upload-grid[b-mbyqv3mrj9],
    .transaction-summary-grid[b-mbyqv3mrj9],
    .review-grid[b-mbyqv3mrj9],
    .review-note-grid[b-mbyqv3mrj9],
    .attachment-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-mbyqv3mrj9] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-mbyqv3mrj9] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-mbyqv3mrj9] {
        width:100%;
    }

    .print-collection-profile[b-mbyqv3mrj9] {
        padding:22px 18px;
    }

    .document-footer[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-mbyqv3mrj9] {
        grid-column:auto;
    }

    .status-overview[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-mbyqv3mrj9] {
        width:100%;
    }

    .document-header[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-mbyqv3mrj9] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-mbyqv3mrj9] {
        visibility:hidden !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-mbyqv3mrj9] {
        display:none !important;
    }

    .modal-backdrop[b-mbyqv3mrj9],
    .collection-view-modal[b-mbyqv3mrj9],
    .view-scroll[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .scope-panel[b-mbyqv3mrj9],
    .amount-comparison-section[b-mbyqv3mrj9],
    .transaction-summary-section[b-mbyqv3mrj9],
    .source-transaction-section[b-mbyqv3mrj9],
    .review-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }

    .mock-document-label[b-mbyqv3mrj9] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-mbyqv3mrj9] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.collection-page[b-mbyqv3mrj9]  .hero-add-button,
.collection-page[b-mbyqv3mrj9]  .toolbar-add-button,
.collection-page[b-mbyqv3mrj9]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-mbyqv3mrj9] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.confirmed > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.checked-in > span[b-mbyqv3mrj9] { background:#73569b; }
.status-overview-card.in-service > span[b-mbyqv3mrj9] { background:#c46a2b; }
.status-overview-card.completed > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.cancelled > span[b-mbyqv3mrj9] { background:#b54d43; }

.service-overview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-mbyqv3mrj9],
.service-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-mbyqv3mrj9] {
    background:#f4faf7;
}

.service-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-mbyqv3mrj9] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-mbyqv3mrj9] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-mbyqv3mrj9] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-mbyqv3mrj9],
.service-unit-cell[b-mbyqv3mrj9],
.provider-location-cell[b-mbyqv3mrj9],
.queue-priority-cell[b-mbyqv3mrj9],
.reason-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-mbyqv3mrj9],
.reason-cell[b-mbyqv3mrj9] {
    min-width:180px;
}

.appointment-time-cell strong[b-mbyqv3mrj9],
.service-unit-cell strong[b-mbyqv3mrj9],
.provider-location-cell strong[b-mbyqv3mrj9],
.queue-priority-cell strong[b-mbyqv3mrj9],
.reason-cell strong[b-mbyqv3mrj9] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-mbyqv3mrj9],
.service-unit-cell small[b-mbyqv3mrj9],
.provider-location-cell small[b-mbyqv3mrj9],
.queue-priority-cell small[b-mbyqv3mrj9],
.reason-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-mbyqv3mrj9],
.provider-location-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-mbyqv3mrj9],
.priority-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-mbyqv3mrj9] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }

.priority-chip[b-mbyqv3mrj9] {
    margin-top:5px;
}

.priority-chip.normal[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-mbyqv3mrj9] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-mbyqv3mrj9] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-mbyqv3mrj9] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-mbyqv3mrj9],
.identity-chip.not-found[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-mbyqv3mrj9] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-mbyqv3mrj9],
.citizen-source-actions a[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-mbyqv3mrj9] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-mbyqv3mrj9] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-mbyqv3mrj9] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-mbyqv3mrj9] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-mbyqv3mrj9] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-mbyqv3mrj9] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-mbyqv3mrj9] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-mbyqv3mrj9] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-mbyqv3mrj9] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-mbyqv3mrj9] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-mbyqv3mrj9] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-mbyqv3mrj9],
.identity-box small[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-mbyqv3mrj9] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-mbyqv3mrj9],
.reason-section[b-mbyqv3mrj9],
.reminder-section[b-mbyqv3mrj9] {
    margin-top:16px;
}

.reference-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-mbyqv3mrj9] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-mbyqv3mrj9],
.timeline-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-mbyqv3mrj9],
.timeline-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-mbyqv3mrj9] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-mbyqv3mrj9],
    .preview-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-mbyqv3mrj9] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-mbyqv3mrj9] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-mbyqv3mrj9] {
        grid-column:1 / -1;
    }

    .reference-grid[b-mbyqv3mrj9],
    .timeline-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-mbyqv3mrj9],
    .focus-grid[b-mbyqv3mrj9],
    .citizen-source-grid[b-mbyqv3mrj9],
    .preview-grid[b-mbyqv3mrj9],
    .consent-grid[b-mbyqv3mrj9],
    .source-photo-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .note-grid[b-mbyqv3mrj9],
    .timeline-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-mbyqv3mrj9] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-mbyqv3mrj9] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-mbyqv3mrj9] {
        margin:0 auto;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .service-section[b-mbyqv3mrj9],
    .reason-section[b-mbyqv3mrj9],
    .reminder-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size: 16px;
    line-height: 1.55;
}

.collection-page[b-mbyqv3mrj9]  .mud-typography,
.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-input-label,
.collection-page[b-mbyqv3mrj9]  .mud-select,
.collection-page[b-mbyqv3mrj9]  .mud-list-item-text,
.collection-page[b-mbyqv3mrj9]  .mud-button-label,
.collection-page[b-mbyqv3mrj9]  .mud-table-cell,
.collection-page[b-mbyqv3mrj9]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size: .92rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size: .90rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-mbyqv3mrj9] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-mbyqv3mrj9] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-mbyqv3mrj9] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-mbyqv3mrj9] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-mbyqv3mrj9] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-mbyqv3mrj9] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-mbyqv3mrj9] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-mbyqv3mrj9] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-mbyqv3mrj9],
.collection-list-panel[b-mbyqv3mrj9],
.insight-panel[b-mbyqv3mrj9] {
    border-radius: 20px;
}

.filter-panel[b-mbyqv3mrj9] {
    padding: 20px;
}

.list-toolbar[b-mbyqv3mrj9] {
    padding: 19px 20px;
}

.filter-heading p[b-mbyqv3mrj9],
.list-toolbar p[b-mbyqv3mrj9] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-mbyqv3mrj9] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-mbyqv3mrj9] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-mbyqv3mrj9],
.service-unit-cell[b-mbyqv3mrj9],
.provider-location-cell[b-mbyqv3mrj9],
.queue-priority-cell[b-mbyqv3mrj9],
.reason-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    min-width: 155px;
}

.provider-location-cell[b-mbyqv3mrj9],
.reason-cell[b-mbyqv3mrj9] {
    min-width: 215px;
}

.service-chip[b-mbyqv3mrj9],
.priority-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9],
.identity-chip[b-mbyqv3mrj9] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-mbyqv3mrj9] {
    min-width: 205px;
    gap: 7px;
}

.collection-page[b-mbyqv3mrj9]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-mbyqv3mrj9] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-mbyqv3mrj9],
.view-toolbar[b-mbyqv3mrj9],
.image-preview-header[b-mbyqv3mrj9] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-mbyqv3mrj9],
.view-scroll[b-mbyqv3mrj9] {
    padding: 20px;
}

.modal-footer[b-mbyqv3mrj9] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-mbyqv3mrj9] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-mbyqv3mrj9] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-mbyqv3mrj9],
.preview-grid > div[b-mbyqv3mrj9],
.reference-grid > div[b-mbyqv3mrj9],
.timeline-grid > div[b-mbyqv3mrj9] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-mbyqv3mrj9] {
    padding: 13px;
}

.photo-preview[b-mbyqv3mrj9] {
    min-height: 200px;
}

.photo-preview img[b-mbyqv3mrj9] {
    height: 200px;
}

.history-item[b-mbyqv3mrj9] {
    padding: 12px;
}

.attachment-card[b-mbyqv3mrj9],
.attachment-card img[b-mbyqv3mrj9] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .collection-page[b-mbyqv3mrj9] {
        font-size: 15px;
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-mbyqv3mrj9] {
        min-height: 122px;
    }

    .status-overview-card[b-mbyqv3mrj9],
    .service-overview-card[b-mbyqv3mrj9] {
        min-height: 82px;
    }

    .modal-body[b-mbyqv3mrj9],
    .view-scroll[b-mbyqv3mrj9] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #collection-profile-print-area[b-mbyqv3mrj9] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #collection-profile-print-area h1[b-mbyqv3mrj9] {
        font-size: 18pt !important;
    }

    #collection-profile-print-area h2[b-mbyqv3mrj9] {
        font-size: 14pt !important;
    }

    #collection-profile-print-area h3[b-mbyqv3mrj9] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-mbyqv3mrj9] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.follow-up > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.referred > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.cancelled > span[b-mbyqv3mrj9] { background:#b54d43; }
.status-overview-card.month > span[b-mbyqv3mrj9] { background:#73569b; }

.service-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-mbyqv3mrj9] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mbyqv3mrj9] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-mbyqv3mrj9] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-mbyqv3mrj9],
.service-unit-cell[b-mbyqv3mrj9],
.provider-location-cell[b-mbyqv3mrj9],
.result-cell[b-mbyqv3mrj9],
.follow-score-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-mbyqv3mrj9],
.result-cell[b-mbyqv3mrj9] {
    min-width:230px;
}

.history-date-cell strong[b-mbyqv3mrj9],
.service-unit-cell strong[b-mbyqv3mrj9],
.provider-location-cell strong[b-mbyqv3mrj9],
.result-cell strong[b-mbyqv3mrj9],
.follow-score-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-mbyqv3mrj9],
.service-unit-cell small[b-mbyqv3mrj9],
.provider-location-cell small[b-mbyqv3mrj9],
.result-cell small[b-mbyqv3mrj9],
.follow-score-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-mbyqv3mrj9],
.provider-location-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mbyqv3mrj9] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-mbyqv3mrj9] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mbyqv3mrj9],
.source-actions button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-mbyqv3mrj9] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-mbyqv3mrj9] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-mbyqv3mrj9] {
    min-height:180px;
}

.source-photo-card img[b-mbyqv3mrj9] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-mbyqv3mrj9] {
    margin-top:18px;
}

.vital-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-mbyqv3mrj9],
.quality-grid > div[b-mbyqv3mrj9],
.follow-up-grid > div[b-mbyqv3mrj9] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mbyqv3mrj9],
.quality-grid span[b-mbyqv3mrj9],
.follow-up-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-mbyqv3mrj9],
.quality-grid strong[b-mbyqv3mrj9],
.follow-up-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-mbyqv3mrj9] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-mbyqv3mrj9],
.quality-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:.94rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:.92rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-mbyqv3mrj9] { background:rgba(104,120,114,.89); }

.view-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-mbyqv3mrj9],
    .service-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mbyqv3mrj9],
    .vital-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-mbyqv3mrj9] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-mbyqv3mrj9],
    .quality-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-mbyqv3mrj9],
    .service-overview[b-mbyqv3mrj9],
    .care-metrics[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .source-photo-grid[b-mbyqv3mrj9],
    .vital-grid[b-mbyqv3mrj9],
    .follow-up-grid[b-mbyqv3mrj9],
    .quality-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-mbyqv3mrj9] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.follow-up > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.referred > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.overdue > span[b-mbyqv3mrj9] { background:#b54d43; }
.status-overview-card.inactive > span[b-mbyqv3mrj9] { background:#687872; }

.risk-overview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-mbyqv3mrj9],
.risk-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-mbyqv3mrj9] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-mbyqv3mrj9],
.care-metrics strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-mbyqv3mrj9],
.care-metrics small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mbyqv3mrj9] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-mbyqv3mrj9],
.risk-adl-cell[b-mbyqv3mrj9],
.dependency-living-cell[b-mbyqv3mrj9],
.caregiver-cell[b-mbyqv3mrj9],
.follow-up-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-mbyqv3mrj9] {
    min-width:190px;
}

.register-age-cell strong[b-mbyqv3mrj9],
.risk-adl-cell strong[b-mbyqv3mrj9],
.dependency-living-cell strong[b-mbyqv3mrj9],
.caregiver-cell strong[b-mbyqv3mrj9],
.follow-up-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-mbyqv3mrj9],
.risk-adl-cell small[b-mbyqv3mrj9],
.dependency-living-cell small[b-mbyqv3mrj9],
.caregiver-cell small[b-mbyqv3mrj9],
.follow-up-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-mbyqv3mrj9],
.caregiver-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-mbyqv3mrj9],
.dependency-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9],
.identity-chip[b-mbyqv3mrj9],
.overdue-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.risk-chip.high[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.active[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.overdue-chip[b-mbyqv3mrj9] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-mbyqv3mrj9] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mbyqv3mrj9] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mbyqv3mrj9] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mbyqv3mrj9],
.source-actions button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-mbyqv3mrj9] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-mbyqv3mrj9] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-mbyqv3mrj9],
.reference-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-mbyqv3mrj9],
.reference-grid > div[b-mbyqv3mrj9],
.care-plan-grid > div[b-mbyqv3mrj9] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-mbyqv3mrj9],
.reference-grid span[b-mbyqv3mrj9],
.care-plan-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-mbyqv3mrj9],
.reference-grid strong[b-mbyqv3mrj9],
.care-plan-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-mbyqv3mrj9] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:.96rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:.94rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-mbyqv3mrj9],
    .assessment-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mbyqv3mrj9],
    .risk-overview[b-mbyqv3mrj9],
    .dependency-grid[b-mbyqv3mrj9],
    .care-metrics[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .assessment-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .care-plan-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:16.5px;
    line-height:1.62;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-mbyqv3mrj9] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-mbyqv3mrj9] { background:#73569b; }
.status-overview-card.field > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.completed > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.follow-up > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.referred > span[b-mbyqv3mrj9] { background:#b55b82; }

.visit-type-overview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-mbyqv3mrj9],
.visit-type-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-mbyqv3mrj9] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-mbyqv3mrj9] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-mbyqv3mrj9] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-mbyqv3mrj9] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-mbyqv3mrj9] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-mbyqv3mrj9],
.care-metrics strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-mbyqv3mrj9],
.care-metrics small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-mbyqv3mrj9],
.visit-type-cell[b-mbyqv3mrj9],
.team-location-cell[b-mbyqv3mrj9],
.result-cell[b-mbyqv3mrj9],
.follow-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-mbyqv3mrj9],
.result-cell[b-mbyqv3mrj9] {
    min-width:230px;
}

.visit-date-cell strong[b-mbyqv3mrj9],
.visit-type-cell strong[b-mbyqv3mrj9],
.team-location-cell strong[b-mbyqv3mrj9],
.result-cell strong[b-mbyqv3mrj9],
.follow-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-mbyqv3mrj9],
.visit-type-cell small[b-mbyqv3mrj9],
.team-location-cell small[b-mbyqv3mrj9],
.result-cell small[b-mbyqv3mrj9],
.follow-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-mbyqv3mrj9],
.team-location-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9],
.identity-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.priority-text[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-mbyqv3mrj9] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mbyqv3mrj9] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mbyqv3mrj9] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-mbyqv3mrj9] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-mbyqv3mrj9] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-mbyqv3mrj9] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-mbyqv3mrj9],
.reference-grid > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mbyqv3mrj9],
.reference-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-mbyqv3mrj9],
.reference-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:.98rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-mbyqv3mrj9],
    .visit-type-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mbyqv3mrj9],
    .visit-type-overview[b-mbyqv3mrj9],
    .target-grid[b-mbyqv3mrj9],
    .care-metrics[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .vital-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:17px;
    line-height:1.65;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-mbyqv3mrj9] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.review > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.eligible > span[b-mbyqv3mrj9] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.paid > span[b-mbyqv3mrj9] { background:#73569b; }

.type-overview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-mbyqv3mrj9],
.type-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-mbyqv3mrj9] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-mbyqv3mrj9] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-mbyqv3mrj9] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-mbyqv3mrj9] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-mbyqv3mrj9],
.target-grid button[b-mbyqv3mrj9] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-mbyqv3mrj9],
.welfare-type-cell[b-mbyqv3mrj9],
.household-cell[b-mbyqv3mrj9],
.amount-cell[b-mbyqv3mrj9],
.officer-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-mbyqv3mrj9],
.officer-cell[b-mbyqv3mrj9] {
    min-width:210px;
}

.application-no-cell strong[b-mbyqv3mrj9],
.welfare-type-cell strong[b-mbyqv3mrj9],
.household-cell strong[b-mbyqv3mrj9],
.amount-cell strong[b-mbyqv3mrj9],
.officer-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-mbyqv3mrj9],
.welfare-type-cell small[b-mbyqv3mrj9],
.household-cell small[b-mbyqv3mrj9],
.amount-cell small[b-mbyqv3mrj9],
.officer-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-mbyqv3mrj9],
.household-cell em[b-mbyqv3mrj9],
.amount-cell em[b-mbyqv3mrj9],
.officer-cell em[b-mbyqv3mrj9],
.citizen-photo-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9],
.source-group-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.source-group-chip[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-mbyqv3mrj9] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-mbyqv3mrj9],
.amount-preview[b-mbyqv3mrj9] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-mbyqv3mrj9],
.amount-preview > div[b-mbyqv3mrj9] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-mbyqv3mrj9],
.amount-preview small[b-mbyqv3mrj9] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-mbyqv3mrj9],
.amount-preview strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-mbyqv3mrj9],
.amount-preview span[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-mbyqv3mrj9] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-mbyqv3mrj9],
.amount-document-grid small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-mbyqv3mrj9] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-mbyqv3mrj9] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-mbyqv3mrj9] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1.02rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-mbyqv3mrj9] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mbyqv3mrj9],
    .type-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mbyqv3mrj9],
    .type-overview[b-mbyqv3mrj9],
    .budget-grid[b-mbyqv3mrj9],
    .target-grid[b-mbyqv3mrj9],
    .care-metrics[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .assessment-preview[b-mbyqv3mrj9],
    .amount-preview[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:17px;
    line-height:1.66;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-mbyqv3mrj9] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-mbyqv3mrj9] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mbyqv3mrj9] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.payment > span[b-mbyqv3mrj9] { background:#b54d43; }
.status-overview-card.suspended > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.expiring > span[b-mbyqv3mrj9] { background:#73569b; }

.target-overview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-mbyqv3mrj9],
.target-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-mbyqv3mrj9] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-mbyqv3mrj9] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-mbyqv3mrj9] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-mbyqv3mrj9] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-mbyqv3mrj9],
.follow-grid button[b-mbyqv3mrj9] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-mbyqv3mrj9] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-mbyqv3mrj9],
.benefit-cell[b-mbyqv3mrj9],
.period-cell[b-mbyqv3mrj9],
.amount-cell[b-mbyqv3mrj9],
.payment-cycle-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-mbyqv3mrj9] {
    min-width:225px;
}

.registry-cell strong[b-mbyqv3mrj9],
.benefit-cell strong[b-mbyqv3mrj9],
.period-cell strong[b-mbyqv3mrj9],
.amount-cell strong[b-mbyqv3mrj9],
.payment-cycle-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-mbyqv3mrj9],
.benefit-cell small[b-mbyqv3mrj9],
.period-cell small[b-mbyqv3mrj9],
.amount-cell small[b-mbyqv3mrj9],
.payment-cycle-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-mbyqv3mrj9],
.period-cell em[b-mbyqv3mrj9],
.amount-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-mbyqv3mrj9],
.cycle-chip[b-mbyqv3mrj9],
.verify-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9],
.source-group-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-mbyqv3mrj9] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.expired[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.source-group-chip[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-mbyqv3mrj9] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-mbyqv3mrj9] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-mbyqv3mrj9] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1.02rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-mbyqv3mrj9] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-mbyqv3mrj9] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mbyqv3mrj9],
    .target-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-mbyqv3mrj9],
    .target-overview[b-mbyqv3mrj9],
    .amount-metrics[b-mbyqv3mrj9],
    .follow-grid[b-mbyqv3mrj9],
    .condition-switch-grid[b-mbyqv3mrj9],
    .amount-preview[b-mbyqv3mrj9],
    .source-data-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .patient-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:17px;
    line-height:1.66;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-mbyqv3mrj9] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-mbyqv3mrj9] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-mbyqv3mrj9] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-mbyqv3mrj9] { background:#687872; }
.status-overview-card.approval > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.processing > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.paid > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.failed > span[b-mbyqv3mrj9] { background:#b54d43; }

.disbursement-progress[b-mbyqv3mrj9] {
    margin-top:15px;
}

.disbursement-progress > div[b-mbyqv3mrj9] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-mbyqv3mrj9],
.amount-cell[b-mbyqv3mrj9],
.progress-cell[b-mbyqv3mrj9],
.date-cell[b-mbyqv3mrj9],
.control-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-mbyqv3mrj9] {
    min-width:245px;
}

.batch-cell strong[b-mbyqv3mrj9],
.amount-cell strong[b-mbyqv3mrj9],
.progress-cell strong[b-mbyqv3mrj9],
.date-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-mbyqv3mrj9],
.amount-cell small[b-mbyqv3mrj9],
.progress-cell small[b-mbyqv3mrj9],
.date-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-mbyqv3mrj9],
.amount-cell em[b-mbyqv3mrj9],
.date-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-mbyqv3mrj9] {
    min-width:180px;
}

.recipient-stack[b-mbyqv3mrj9] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-mbyqv3mrj9],
.recipient-stack span[b-mbyqv3mrj9] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-mbyqv3mrj9] {
    margin-left:0;
}

.recipient-stack img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-mbyqv3mrj9] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-mbyqv3mrj9],
.approval-chip[b-mbyqv3mrj9],
.reconcile-chip[b-mbyqv3mrj9],
.cycle-chip[b-mbyqv3mrj9],
.line-status-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.approved[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.control-cell[b-mbyqv3mrj9] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-mbyqv3mrj9] {
    align-items:center;
}

.selection-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-mbyqv3mrj9] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-mbyqv3mrj9] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-mbyqv3mrj9] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-mbyqv3mrj9] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-mbyqv3mrj9] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-mbyqv3mrj9],
.source-selection-table td[b-mbyqv3mrj9] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-mbyqv3mrj9] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-mbyqv3mrj9] {
    background:#f0faf6;
}

.source-person-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-mbyqv3mrj9] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-mbyqv3mrj9],
.source-benefit-cell strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-mbyqv3mrj9],
.source-benefit-cell small[b-mbyqv3mrj9],
.source-date[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-mbyqv3mrj9] {
    min-width:190px;
}

.source-amount[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-mbyqv3mrj9] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-mbyqv3mrj9] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-mbyqv3mrj9] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-mbyqv3mrj9] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-mbyqv3mrj9] {
    font-size:3.5rem;
}

.batch-overview-content small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-mbyqv3mrj9] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-mbyqv3mrj9] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-mbyqv3mrj9] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-mbyqv3mrj9],
.print-line-table td[b-mbyqv3mrj9] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-mbyqv3mrj9] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-mbyqv3mrj9],
.print-line-table td small[b-mbyqv3mrj9] {
    display:block;
}

.print-line-table td small[b-mbyqv3mrj9] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-mbyqv3mrj9] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-mbyqv3mrj9] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-mbyqv3mrj9] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-mbyqv3mrj9] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-mbyqv3mrj9] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-mbyqv3mrj9] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-mbyqv3mrj9] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-mbyqv3mrj9] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-mbyqv3mrj9] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-mbyqv3mrj9] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-mbyqv3mrj9] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1.02rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-mbyqv3mrj9],
    .recipient-detail-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-mbyqv3mrj9] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-mbyqv3mrj9] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mbyqv3mrj9],
    .amount-metrics[b-mbyqv3mrj9],
    .follow-grid[b-mbyqv3mrj9],
    .source-selection-summary[b-mbyqv3mrj9],
    .amount-preview[b-mbyqv3mrj9],
    .recipient-detail-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-mbyqv3mrj9] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-mbyqv3mrj9] {
        overflow-x:auto;
    }

    .source-selection-table[b-mbyqv3mrj9] {
        min-width:1050px;
    }

    .batch-overview-panel[b-mbyqv3mrj9],
    .recipient-detail-card[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-mbyqv3mrj9] {
        width:100%;
        height:190px;
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .batch-overview-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:17px;
    line-height:1.66;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-mbyqv3mrj9] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-mbyqv3mrj9] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mbyqv3mrj9],
.type-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mbyqv3mrj9] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.full > span[b-mbyqv3mrj9] { background:#c56b2a; }
.status-overview-card.overflow > span[b-mbyqv3mrj9] { background:#b54d43; }
.status-overview-card.maintenance > span[b-mbyqv3mrj9] { background:#73569b; }

.type-overview[b-mbyqv3mrj9] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-mbyqv3mrj9],
.type-overview-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-mbyqv3mrj9] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-mbyqv3mrj9] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-mbyqv3mrj9] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-mbyqv3mrj9] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-mbyqv3mrj9] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-mbyqv3mrj9] {
    margin-top:15px;
}

.fill-progress > div[b-mbyqv3mrj9] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-mbyqv3mrj9] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-mbyqv3mrj9] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-mbyqv3mrj9] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-mbyqv3mrj9] {
    background:#987634;
}

.map-pin.full[b-mbyqv3mrj9] {
    background:#c56b2a;
}

.map-pin.overflow[b-mbyqv3mrj9] {
    background:#b54d43;
}

.map-pin.maintenance[b-mbyqv3mrj9] {
    background:#73569b;
}

.map-pin.inactive[b-mbyqv3mrj9] {
    background:#687872;
}

.map-pin span[b-mbyqv3mrj9] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-mbyqv3mrj9] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-mbyqv3mrj9] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-mbyqv3mrj9] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-mbyqv3mrj9] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-mbyqv3mrj9] { background:#987634; }
.map-board-legend i.full[b-mbyqv3mrj9] { background:#b54d43; }
.map-board-legend i.maintenance[b-mbyqv3mrj9] { background:#73569b; }

.map-board-caption[b-mbyqv3mrj9] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-mbyqv3mrj9],
.map-board-caption small[b-mbyqv3mrj9] {
    display:block;
}

.map-board-caption strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-mbyqv3mrj9] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.point-photo-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-mbyqv3mrj9] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.point-photo-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-mbyqv3mrj9],
.bin-cell[b-mbyqv3mrj9],
.fill-cell[b-mbyqv3mrj9],
.collection-cell[b-mbyqv3mrj9],
.sensor-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-mbyqv3mrj9] {
    min-width:220px;
}

.location-cell strong[b-mbyqv3mrj9],
.bin-cell strong[b-mbyqv3mrj9],
.fill-cell strong[b-mbyqv3mrj9],
.collection-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-mbyqv3mrj9],
.bin-cell small[b-mbyqv3mrj9],
.fill-cell small[b-mbyqv3mrj9],
.collection-cell small[b-mbyqv3mrj9],
.sensor-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.location-cell em[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.waste-type-chip[b-mbyqv3mrj9],
.collection-chip[b-mbyqv3mrj9],
.sensor-chip[b-mbyqv3mrj9],
.status-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.waste-type-chip.general[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.status-chip.active[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.full[b-mbyqv3mrj9] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.table-progress[b-mbyqv3mrj9] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-mbyqv3mrj9] { background:var(--theme-primary); }
.table-progress.medium span[b-mbyqv3mrj9] { background:#2f789f; }
.table-progress.high span[b-mbyqv3mrj9] { background:#987634; }
.table-progress.critical span[b-mbyqv3mrj9] { background:#b54d43; }

.repair-alert[b-mbyqv3mrj9],
.clean-alert[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-mbyqv3mrj9] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-mbyqv3mrj9] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-mbyqv3mrj9] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-mbyqv3mrj9] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-mbyqv3mrj9] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-mbyqv3mrj9] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-mbyqv3mrj9] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-mbyqv3mrj9] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-mbyqv3mrj9] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-mbyqv3mrj9] { background:#2f789f; }
.fill-preview-bin.high span[b-mbyqv3mrj9] { background:#987634; }
.fill-preview-bin.critical span[b-mbyqv3mrj9] { background:#b54d43; }

.fill-preview-bin strong[b-mbyqv3mrj9] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-mbyqv3mrj9] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.source-photo-preview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-mbyqv3mrj9] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-mbyqv3mrj9] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-mbyqv3mrj9] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-mbyqv3mrj9] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.large-fill-indicator[b-mbyqv3mrj9] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-mbyqv3mrj9] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-mbyqv3mrj9] { background:#2f789f; }
.large-fill-indicator.high > span[b-mbyqv3mrj9] { background:#987634; }
.large-fill-indicator.critical > span[b-mbyqv3mrj9] { background:#b54d43; }

.large-fill-indicator strong[b-mbyqv3mrj9],
.large-fill-indicator small[b-mbyqv3mrj9] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-mbyqv3mrj9] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-mbyqv3mrj9] {
    font-size:.84rem;
}

.detail-map-preview[b-mbyqv3mrj9] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-mbyqv3mrj9] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-mbyqv3mrj9] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-mbyqv3mrj9] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-mbyqv3mrj9] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-mbyqv3mrj9] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-mbyqv3mrj9] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-mbyqv3mrj9] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.workflow-button.collect[b-mbyqv3mrj9] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-mbyqv3mrj9] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1.02rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-mbyqv3mrj9],
    .type-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-mbyqv3mrj9] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-mbyqv3mrj9] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-mbyqv3mrj9] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-mbyqv3mrj9] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mbyqv3mrj9],
    .type-overview[b-mbyqv3mrj9],
    .amount-metrics[b-mbyqv3mrj9],
    .follow-grid[b-mbyqv3mrj9],
    .condition-switch-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-mbyqv3mrj9],
    .fill-preview-card[b-mbyqv3mrj9],
    .coordinate-preview[b-mbyqv3mrj9],
    .collection-history-list article[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-mbyqv3mrj9] {
        min-height:240px;
    }

    .large-fill-indicator[b-mbyqv3mrj9],
    .fill-preview-bin[b-mbyqv3mrj9],
    .coordinate-pin[b-mbyqv3mrj9] {
        margin:0 auto;
    }

    .map-board[b-mbyqv3mrj9] {
        min-height:500px;
    }

    .map-pin[b-mbyqv3mrj9] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .point-cover-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}


/* =========================================================
   WASTE COLLECTION SCHEDULE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.collection-page[b-mbyqv3mrj9] {
    font-size:17px;
    line-height:1.66;
}

.collection-hero[b-mbyqv3mrj9] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-mbyqv3mrj9] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.progress[b-mbyqv3mrj9] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.weight[b-mbyqv3mrj9] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.urgent[b-mbyqv3mrj9] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-mbyqv3mrj9] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.scheduled > span[b-mbyqv3mrj9] { background:#987634; }
.status-overview-card.dispatched > span[b-mbyqv3mrj9] { background:#2f789f; }
.status-overview-card.in-progress > span[b-mbyqv3mrj9] { background:#73569b; }
.status-overview-card.completed > span[b-mbyqv3mrj9] { background:#34734b; }
.status-overview-card.missed > span[b-mbyqv3mrj9] { background:#b54d43; }

/* WEEK BOARD */

.week-board-panel[b-mbyqv3mrj9] {
    margin-top:16px;
    padding:19px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:22px;
    background:#fff;
    box-shadow:0 14px 38px rgba(5,62,46,.07);
}

.week-board-header[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}

.week-board-header small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.week-board-header h2[b-mbyqv3mrj9] {
    margin:5px 0 0;
    color:#26463c;
    font-size:1.32rem;
}

.week-board-header p[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.today-button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.week-board[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:17px;
}

.week-day-card[b-mbyqv3mrj9] {
    min-height:170px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    transition:.18s ease;
}

.week-day-card:hover[b-mbyqv3mrj9],
.week-day-card.selected[b-mbyqv3mrj9] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.34);
    background:#eef8f4;
    box-shadow:0 14px 28px rgba(5,62,46,.10);
}

.week-day-card.today[b-mbyqv3mrj9] {
    border-color:rgba(47,120,159,.32);
    background:#f1f8fb;
}

.week-day-card > small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.week-day-card > strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#26463c;
    font-size:1.80rem;
    line-height:1;
}

.week-day-card > span[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:750;
}

.day-metrics[b-mbyqv3mrj9] {
    display:flex;
    flex-direction:column;
    gap:3px;
    margin-top:12px;
}

.day-metrics em[b-mbyqv3mrj9] {
    color:#5f746a;
    font-size:.84rem;
    font-style:normal;
}

.day-status-dots[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:10px;
}

.day-status-dots i[b-mbyqv3mrj9] {
    width:11px;
    height:11px;
    border-radius:50%;
    background:#aab8b2;
}

.day-status-dots i.draft[b-mbyqv3mrj9] { background:#687872; }
.day-status-dots i.scheduled[b-mbyqv3mrj9] { background:#987634; }
.day-status-dots i.dispatched[b-mbyqv3mrj9] { background:#2f789f; }
.day-status-dots i.in-progress[b-mbyqv3mrj9] { background:#73569b; }
.day-status-dots i.completed[b-mbyqv3mrj9] { background:#34734b; }
.day-status-dots i.partial[b-mbyqv3mrj9] { background:#c56b2a; }
.day-status-dots i.missed[b-mbyqv3mrj9] { background:#b54d43; }
.day-status-dots i.cancelled[b-mbyqv3mrj9] { background:#687872; }

.collection-progress[b-mbyqv3mrj9] {
    margin-top:15px;
}

.collection-progress > div[b-mbyqv3mrj9] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.collection-progress > div > span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
}

/* TABLE */

.date-shift-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    min-width:235px;
    align-items:center;
    gap:12px;
}

.date-box[b-mbyqv3mrj9] {
    display:flex;
    width:64px;
    min-height:78px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border-radius:15px;
    color:#fff;
    background:linear-gradient(145deg,var(--theme-primary),#075442);
    box-shadow:0 9px 20px rgba(10,114,87,.18);
}

.date-box small[b-mbyqv3mrj9],
.date-box em[b-mbyqv3mrj9] {
    font-size:.84rem;
    font-style:normal;
}

.date-box strong[b-mbyqv3mrj9] {
    margin:2px 0;
    font-size:1.35rem;
    line-height:1;
}

.date-shift-cell > div > strong[b-mbyqv3mrj9],
.route-cell > strong[b-mbyqv3mrj9],
.vehicle-cell strong[b-mbyqv3mrj9],
.progress-cell strong[b-mbyqv3mrj9],
.metric-cell strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.58;
}

.date-shift-cell > div > small[b-mbyqv3mrj9],
.route-cell > small[b-mbyqv3mrj9],
.vehicle-cell small[b-mbyqv3mrj9],
.progress-cell small[b-mbyqv3mrj9],
.metric-cell small[b-mbyqv3mrj9],
.priority-cell small[b-mbyqv3mrj9],
.status-cell small[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.date-shift-cell > div > em[b-mbyqv3mrj9],
.metric-cell em[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.route-cell[b-mbyqv3mrj9] {
    min-width:240px;
}

.point-stack[b-mbyqv3mrj9] {
    display:flex;
    align-items:center;
    margin-top:9px;
}

.point-stack button[b-mbyqv3mrj9],
.point-stack span[b-mbyqv3mrj9] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-7px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.point-stack button:first-child[b-mbyqv3mrj9] {
    margin-left:0;
}

.point-stack button[b-mbyqv3mrj9] {
    cursor:zoom-in;
}

.point-stack img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-stack span[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.vehicle-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-width:190px;
    align-items:center;
    gap:10px;
}

.vehicle-icon[b-mbyqv3mrj9] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.vehicle-cell em[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.progress-cell[b-mbyqv3mrj9],
.metric-cell[b-mbyqv3mrj9],
.priority-cell[b-mbyqv3mrj9],
.status-cell[b-mbyqv3mrj9] {
    display:flex;
    min-width:155px;
    flex-direction:column;
}

.table-progress[b-mbyqv3mrj9] {
    height:10px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#65b695);
}

.missed-line[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-mbyqv3mrj9],
.priority-chip[b-mbyqv3mrj9],
.waste-type-chip[b-mbyqv3mrj9],
.collection-chip[b-mbyqv3mrj9],
.stop-status-chip[b-mbyqv3mrj9] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.status-chip.scheduled[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.status-chip.dispatched[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.status-chip.completed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-mbyqv3mrj9] { color:#c56b2a; background:#fff0df; }
.status-chip.missed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.priority-chip.low[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.priority-chip.normal[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.priority-chip.high[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }

.waste-type-chip.general[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-mbyqv3mrj9] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-mbyqv3mrj9] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

.stop-status-chip.pending[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }
.stop-status-chip.en-route[b-mbyqv3mrj9] { color:#2f789f; background:#e8f3f8; }
.stop-status-chip.in-progress[b-mbyqv3mrj9] { color:#73569b; background:#f0eafb; }
.stop-status-chip.completed[b-mbyqv3mrj9] { color:#34734b; background:#e7f5ec; }
.stop-status-chip.missed[b-mbyqv3mrj9] { color:#b54d43; background:#fff0ee; }
.stop-status-chip.cancelled[b-mbyqv3mrj9] { color:#687872; background:#edf1ef; }

/* POINT SELECTION */

.point-selection-title[b-mbyqv3mrj9] {
    align-items:center;
}

.selection-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-mbyqv3mrj9] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-mbyqv3mrj9] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-mbyqv3mrj9] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-mbyqv3mrj9] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-mbyqv3mrj9] {
    max-height:540px;
    overflow:auto;
}

.source-selection-table[b-mbyqv3mrj9] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-mbyqv3mrj9],
.source-selection-table td[b-mbyqv3mrj9] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-mbyqv3mrj9] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.88rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-mbyqv3mrj9] {
    background:#f0faf6;
}

.source-point-cell[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-width:250px;
    align-items:center;
    gap:10px;
}

.source-point-cell button[b-mbyqv3mrj9] {
    width:58px;
    height:58px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-point-cell img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-cell strong[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-point-cell small[b-mbyqv3mrj9],
.source-point-cell em[b-mbyqv3mrj9],
.source-small[b-mbyqv3mrj9] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

.source-point-cell em[b-mbyqv3mrj9] {
    color:#2f789f;
}

.source-fill[b-mbyqv3mrj9] {
    min-width:120px;
}

.source-fill strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.source-progress[b-mbyqv3mrj9] {
    width:110px;
    height:8px;
    overflow:hidden;
    margin-top:5px;
    border-radius:999px;
    background:var(--theme-border);
}

.source-progress span[b-mbyqv3mrj9] {
    display:block;
    height:100%;
}

.source-progress.low span[b-mbyqv3mrj9] { background:var(--theme-primary); }
.source-progress.medium span[b-mbyqv3mrj9] { background:#2f789f; }
.source-progress.high span[b-mbyqv3mrj9] { background:#987634; }
.source-progress.critical span[b-mbyqv3mrj9] { background:#b54d43; }

.source-fill small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.condition-tags[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.condition-tags span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.condition-tags .clean[b-mbyqv3mrj9] {
    color:#2f789f;
    background:#e8f3f8;
}

.condition-tags .repair[b-mbyqv3mrj9] {
    color:#b54d43;
    background:#fff0ee;
}

.condition-tags .normal[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.source-document-buttons[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.source-document-buttons button[b-mbyqv3mrj9] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* OPERATION PREVIEW */

.operation-preview[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.operation-preview > div[b-mbyqv3mrj9] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.operation-preview small[b-mbyqv3mrj9] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.operation-preview strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.operation-preview span[b-mbyqv3mrj9] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.schedule-cover-panel[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.schedule-cover-photo[b-mbyqv3mrj9] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.schedule-cover-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.schedule-cover-content small[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.schedule-cover-content h2[b-mbyqv3mrj9] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.schedule-cover-content p[b-mbyqv3mrj9] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.schedule-cover-meta[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.schedule-cover-meta span[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.completion-ring[b-mbyqv3mrj9] {
    display:flex;
    width:120px;
    height:120px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:12px solid #d7e8e0;
    border-top-color:var(--theme-primary);
    border-right-color:#2f789f;
    border-radius:50%;
    background:#fff;
}

.completion-ring strong[b-mbyqv3mrj9] {
    color:#26463c;
    font-size:1.35rem;
}

.completion-ring small[b-mbyqv3mrj9] {
    color:#71837a;
    font-size:.84rem;
}

.print-stop-table-wrap[b-mbyqv3mrj9] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-stop-table[b-mbyqv3mrj9] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-stop-table th[b-mbyqv3mrj9],
.print-stop-table td[b-mbyqv3mrj9] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-stop-table th[b-mbyqv3mrj9] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-stop-table td strong[b-mbyqv3mrj9],
.print-stop-table td small[b-mbyqv3mrj9] {
    display:block;
}

.print-stop-table td small[b-mbyqv3mrj9] {
    margin-top:3px;
    color:#71837a;
}

.print-stop-table tfoot td[b-mbyqv3mrj9] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.stop-detail-panel[b-mbyqv3mrj9] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.stop-detail-list[b-mbyqv3mrj9] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.stop-detail-card[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:52px 110px minmax(0,1fr);
    gap:13px;
    align-items:start;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.stop-detail-card.missed[b-mbyqv3mrj9] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.stop-detail-card.completed[b-mbyqv3mrj9] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.stop-sequence[b-mbyqv3mrj9] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:14px;
    color:#fff;
    background:var(--theme-primary);
    font-size:1.05rem;
    font-weight:800;
}

.stop-photo[b-mbyqv3mrj9] {
    width:110px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.stop-photo img[b-mbyqv3mrj9] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.stop-detail-heading[b-mbyqv3mrj9] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.stop-detail-heading strong[b-mbyqv3mrj9] {
    color:var(--theme-ink);
    font-size:1rem;
}

.stop-detail-heading small[b-mbyqv3mrj9] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.stop-detail-grid[b-mbyqv3mrj9] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.stop-detail-grid > div[b-mbyqv3mrj9] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.stop-detail-grid span[b-mbyqv3mrj9] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.stop-detail-grid strong[b-mbyqv3mrj9] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.stop-document-actions[b-mbyqv3mrj9] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.stop-document-actions button[b-mbyqv3mrj9] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW */

.workflow-button[b-mbyqv3mrj9] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.schedule[b-mbyqv3mrj9] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.dispatch[b-mbyqv3mrj9] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-mbyqv3mrj9] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.complete[b-mbyqv3mrj9] {
    color:#fff !important;
    background:#34734b !important;
}

/* LARGE MUD TEXT */

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.collection-page[b-mbyqv3mrj9]  .mud-input,
.collection-page[b-mbyqv3mrj9]  .mud-select-input {
    font-size:1.02rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-list-item-text {
    font-size:1rem !important;
}

.collection-page[b-mbyqv3mrj9]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.vehicle > span[b-mbyqv3mrj9] { background:rgba(10,114,87,.90); }
.attachment-card.crew > span[b-mbyqv3mrj9] { background:rgba(47,120,159,.90); }
.attachment-card.start > span[b-mbyqv3mrj9] { background:rgba(152,118,52,.90); }
.attachment-card.complete > span[b-mbyqv3mrj9] { background:rgba(52,115,75,.90); }
.attachment-card.weighing > span[b-mbyqv3mrj9] { background:rgba(115,86,155,.90); }
.attachment-card.incident > span[b-mbyqv3mrj9] { background:rgba(181,77,67,.90); }

@media (max-width:1450px) {
    .status-overview[b-mbyqv3mrj9] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .week-board[b-mbyqv3mrj9] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .source-selection-summary[b-mbyqv3mrj9],
    .operation-preview[b-mbyqv3mrj9],
    .stop-detail-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .schedule-cover-panel[b-mbyqv3mrj9] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .week-board[b-mbyqv3mrj9] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .schedule-cover-panel[b-mbyqv3mrj9] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .completion-ring[b-mbyqv3mrj9] {
        grid-column:1 / -1;
        margin:0 auto;
    }

    .stop-detail-card[b-mbyqv3mrj9] {
        grid-template-columns:52px 100px minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mbyqv3mrj9],
    .week-board[b-mbyqv3mrj9],
    .amount-metrics[b-mbyqv3mrj9],
    .follow-grid[b-mbyqv3mrj9],
    .source-selection-summary[b-mbyqv3mrj9],
    .operation-preview[b-mbyqv3mrj9],
    .stop-detail-grid[b-mbyqv3mrj9],
    .reference-grid[b-mbyqv3mrj9],
    .amount-document-grid[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .week-board-header[b-mbyqv3mrj9] {
        flex-direction:column;
    }

    .selection-actions[b-mbyqv3mrj9] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-mbyqv3mrj9] {
        overflow-x:auto;
    }

    .source-selection-table[b-mbyqv3mrj9] {
        min-width:1050px;
    }

    .schedule-cover-panel[b-mbyqv3mrj9],
    .stop-detail-card[b-mbyqv3mrj9] {
        grid-template-columns:minmax(0,1fr);
    }

    .schedule-cover-photo[b-mbyqv3mrj9] {
        height:240px;
    }

    .stop-sequence[b-mbyqv3mrj9] {
        width:100%;
        height:44px;
    }

    .stop-photo[b-mbyqv3mrj9] {
        width:100%;
        height:190px;
    }

    .collection-page[b-mbyqv3mrj9]  .collection-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #collection-profile-print-area[b-mbyqv3mrj9],
    #collection-profile-print-area *[b-mbyqv3mrj9] {
        visibility:visible !important;
    }

    #collection-profile-print-area[b-mbyqv3mrj9] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .collection-view-modal[b-mbyqv3mrj9] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mbyqv3mrj9],
    .document-status-strip[b-mbyqv3mrj9],
    .schedule-cover-panel[b-mbyqv3mrj9],
    .document-section[b-mbyqv3mrj9],
    .document-footer[b-mbyqv3mrj9] {
        break-inside:avoid;
    }
}

/* CARD POLISH V2 โ€” WEEKLY COLLECTION PLAN */

/* =========================================================
   WEEKLY COLLECTION PLAN โ€” PREMIUM CARD REFINEMENT
   ========================================================= */

.week-board-panel[b-mbyqv3mrj9] {
    position: relative;
    overflow: hidden;
    margin-top: 20px;
    padding: 26px;
    border: 1px solid rgba(10, 114, 87, .12);
    border-radius: 28px;
    background:
        radial-gradient(
            circle at 92% -18%,
            rgba(47, 120, 159, .13),
            transparent 24rem
        ),
        radial-gradient(
            circle at 5% 115%,
            rgba(10, 114, 87, .10),
            transparent 23rem
        ),
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(248, 252, 250, .97)
        );
    box-shadow:
        0 22px 52px rgba(5, 62, 46, .09),
        inset 0 1px 0 rgba(255, 255, 255, .92);
}

.week-board-panel[b-mbyqv3mrj9]::before {
    position: absolute;
    top: 0;
    left: 30px;
    width: 170px;
    height: 5px;
    border-radius: 0 0 999px 999px;
    background:
        linear-gradient(
            90deg,
            var(--theme-primary),
            #2f789f,
            #c79a3b
        );
    content: "";
}

.week-board-header[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    align-items: center;
    gap: 22px;
}

.week-board-header > div:first-child[b-mbyqv3mrj9] {
    max-width: 780px;
}

.week-board-header small[b-mbyqv3mrj9] {
    color: #987634;
    font-size: .90rem;
    font-weight: 850;
    letter-spacing: .10em;
}

.week-board-header h2[b-mbyqv3mrj9] {
    margin: 7px 0 0;
    color: #173e35;
    font-size: 1.58rem;
    font-weight: 850;
    line-height: 1.35;
}

.week-board-header p[b-mbyqv3mrj9] {
    margin: 8px 0 0;
    color: #697c73;
    font-size: 1rem;
    line-height: 1.65;
}

.today-button[b-mbyqv3mrj9] {
    min-height: 48px;
    padding: 0 18px;
    border: 1px solid rgba(10, 114, 87, .20);
    border-radius: 14px;
    color: var(--theme-primary);
    background:
        linear-gradient(
            145deg,
            #f4fbf8,
            color-mix(in srgb, var(--theme-light) 13%, white)
        );
    font-size: .98rem;
    font-weight: 800;
    box-shadow:
        0 9px 22px rgba(10, 114, 87, .10),
        inset 0 1px 0 rgba(255, 255, 255, .92);
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.today-button:hover[b-mbyqv3mrj9] {
    transform: translateY(-2px);
    border-color: rgba(10, 114, 87, .38);
    box-shadow:
        0 14px 28px rgba(10, 114, 87, .16),
        inset 0 1px 0 rgba(255, 255, 255, .95);
}

.week-board[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    gap: 14px;
    margin-top: 22px;
}

.week-day-card[b-mbyqv3mrj9] {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto 1fr auto;
    min-height: 184px;
    overflow: hidden;
    align-content: start;
    align-items: start;
    column-gap: 9px;
    padding: 20px 18px 17px;
    border: 1px solid rgba(50, 91, 75, .11);
    border-radius: 21px;
    color: #40544b;
    background:
        radial-gradient(
            circle at 104% -12%,
            rgba(10, 114, 87, .10),
            transparent 8.5rem
        ),
        linear-gradient(
            150deg,
            #ffffff,
            #f5faf7
        );
    box-shadow:
        0 12px 28px rgba(5, 62, 46, .065),
        inset 0 1px 0 rgba(255, 255, 255, .92);
    transition:
        transform .20s ease,
        box-shadow .20s ease,
        border-color .20s ease;
}

.week-day-card[b-mbyqv3mrj9]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    border-radius: 21px 21px 0 0;
    background: var(--day-accent, var(--theme-primary));
    content: "";
}

.week-day-card[b-mbyqv3mrj9]::after {
    position: absolute;
    right: -32px;
    bottom: -46px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--day-soft, rgba(10, 114, 87, .09));
    content: "";
    pointer-events: none;
}

.week-day-card:nth-child(1)[b-mbyqv3mrj9] {
    --day-accent: #c56b2a;
    --day-soft: rgba(197, 107, 42, .11);
}

.week-day-card:nth-child(2)[b-mbyqv3mrj9] {
    --day-accent: #b54d43;
    --day-soft: rgba(181, 77, 67, .10);
}

.week-day-card:nth-child(3)[b-mbyqv3mrj9] {
    --day-accent: #73569b;
    --day-soft: rgba(115, 86, 155, .10);
}

.week-day-card:nth-child(4)[b-mbyqv3mrj9] {
    --day-accent: #2f789f;
    --day-soft: rgba(47, 120, 159, .11);
}

.week-day-card:nth-child(5)[b-mbyqv3mrj9] {
    --day-accent: #987634;
    --day-soft: rgba(152, 118, 52, .11);
}

.week-day-card:nth-child(6)[b-mbyqv3mrj9] {
    --day-accent: #b18d32;
    --day-soft: rgba(177, 141, 50, .10);
}

.week-day-card:nth-child(7)[b-mbyqv3mrj9] {
    --day-accent: #4d7565;
    --day-soft: rgba(77, 117, 101, .10);
}

.week-day-card:hover[b-mbyqv3mrj9] {
    transform: translateY(-5px);
    border-color: color-mix(
        in srgb,
        var(--day-accent, var(--theme-primary)) 40%,
        transparent
    );
    box-shadow:
        0 20px 38px rgba(5, 62, 46, .13),
        inset 0 1px 0 rgba(255, 255, 255, .95);
}

.week-day-card.selected[b-mbyqv3mrj9] {
    transform: translateY(-4px);
    border-color: rgba(47, 120, 159, .42);
    background:
        radial-gradient(
            circle at 104% -12%,
            rgba(47, 120, 159, .17),
            transparent 9rem
        ),
        linear-gradient(
            150deg,
            #f7fcff,
            #eaf5fa
        );
    box-shadow:
        0 20px 42px rgba(47, 120, 159, .17),
        inset 0 0 0 1px rgba(47, 120, 159, .08);
}

.week-day-card.today[b-mbyqv3mrj9] {
    border-color: rgba(10, 114, 87, .42);
    background:
        radial-gradient(
            circle at 104% -12%,
            rgba(10, 114, 87, .18),
            transparent 9rem
        ),
        linear-gradient(
            150deg,
            #f5fcf9,
            #e7f5ef
        );
}

.week-day-card.today[b-mbyqv3mrj9]::before {
    background:
        linear-gradient(
            90deg,
            var(--theme-primary),
            #2f789f
        );
}

.week-day-card.today > small[b-mbyqv3mrj9]::after {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    margin-left: 7px;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--theme-primary);
    font-size: .72rem;
    font-weight: 800;
    content: "เธงเธฑเธ™เธ™เธตเน‰";
    vertical-align: middle;
}

.week-day-card > small[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    grid-column: 1 / -1;
    color: #677a71;
    font-size: .92rem;
    font-weight: 750;
    line-height: 1.4;
}

.week-day-card > strong[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    grid-column: 1;
    margin-top: 11px;
    color: #173e35;
    font-size: 2.35rem;
    font-weight: 900;
    line-height: .95;
    letter-spacing: -.04em;
}

.week-day-card > span[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    grid-column: 2;
    align-self: end;
    margin: 0 0 2px;
    color: var(--day-accent, var(--theme-primary));
    font-size: .95rem;
    font-weight: 850;
    line-height: 1.2;
}

.day-metrics[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    grid-column: 1 / -1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-self: end;
    gap: 7px;
    margin-top: 17px;
}

.day-metrics em[b-mbyqv3mrj9] {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 0 10px;
    border: 1px solid rgba(50, 91, 75, .09);
    border-radius: 999px;
    color: #52685e;
    background: rgba(255, 255, 255, .78);
    font-size: .82rem;
    font-weight: 720;
    box-shadow: 0 4px 10px rgba(5, 62, 46, .045);
}

.day-status-dots[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    grid-column: 1 / -1;
    display: flex;
    min-height: 18px;
    align-items: center;
    gap: 7px;
    margin-top: 13px;
}

.day-status-dots i[b-mbyqv3mrj9] {
    width: 12px;
    height: 12px;
    border: 2px solid rgba(255, 255, 255, .95);
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(48, 71, 61, .10);
}

/* =========================================================
   WEEKLY OPERATION + OPERATION FOCUS
   ========================================================= */

.insight-grid[b-mbyqv3mrj9] {
    grid-template-columns:
        minmax(0, 1.48fr)
        minmax(360px, .82fr);
    gap: 18px;
    margin-top: 18px;
}

.insight-panel[b-mbyqv3mrj9] {
    position: relative;
    overflow: hidden;
    min-height: 300px;
    padding: 24px;
    border: 1px solid rgba(10, 114, 87, .11);
    border-radius: 25px;
    background:
        radial-gradient(
            circle at 98% 0%,
            rgba(199, 163, 93, .13),
            transparent 18rem
        ),
        linear-gradient(
            145deg,
            #ffffff,
            color-mix(in srgb, var(--theme-bg) 58%, white)
        );
    box-shadow:
        0 18px 44px rgba(5, 62, 46, .08),
        inset 0 1px 0 rgba(255, 255, 255, .94);
}

.insight-panel[b-mbyqv3mrj9]::before {
    position: absolute;
    top: 0;
    left: 24px;
    width: 118px;
    height: 4px;
    border-radius: 0 0 999px 999px;
    background:
        linear-gradient(
            90deg,
            #987634,
            #d1ab55
        );
    content: "";
}

.insight-panel:last-child[b-mbyqv3mrj9] {
    background:
        radial-gradient(
            circle at 102% -6%,
            rgba(10, 114, 87, .15),
            transparent 17rem
        ),
        linear-gradient(
            145deg,
            #ffffff,
            #f3faf7
        );
}

.insight-panel:last-child[b-mbyqv3mrj9]::before {
    background:
        linear-gradient(
            90deg,
            var(--theme-primary),
            #2f789f
        );
}

.insight-heading[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    align-items: flex-start;
}

.insight-heading small[b-mbyqv3mrj9] {
    font-size: .88rem;
    font-weight: 850;
    letter-spacing: .09em;
}

.insight-heading h2[b-mbyqv3mrj9] {
    margin-top: 6px;
    color: #173e35;
    font-size: 1.34rem;
    font-weight: 850;
    line-height: 1.4;
}

.insight-heading > span[b-mbyqv3mrj9] {
    min-height: 36px;
    padding: 0 13px;
    border: 1px solid rgba(10, 114, 87, .10);
    border-radius: 999px;
    color: var(--theme-primary);
    background:
        linear-gradient(
            145deg,
            #edf8f4,
            #dff2ea
        );
    font-size: .88rem;
    font-weight: 850;
    box-shadow: 0 6px 14px rgba(10, 114, 87, .08);
}

.collection-progress[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    margin-top: 20px;
}

.collection-progress > div[b-mbyqv3mrj9] {
    height: 18px;
    padding: 3px;
    border: 1px solid rgba(10, 114, 87, .10);
    border-radius: 999px;
    background: #eaf2ee;
    box-shadow: inset 0 2px 5px rgba(31, 75, 57, .07);
}

.collection-progress > div > span[b-mbyqv3mrj9] {
    min-width: 12px;
    border-radius: 999px;
    background:
        linear-gradient(
            90deg,
            var(--theme-primary) 0%,
            #178369 40%,
            #2f789f 100%
        );
    box-shadow: 0 4px 10px rgba(10, 114, 87, .20);
}

.amount-metrics[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    gap: 13px;
    margin-top: 18px;
}

.amount-metrics > div[b-mbyqv3mrj9] {
    position: relative;
    overflow: hidden;
    min-height: 118px;
    padding: 18px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 18px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(246, 250, 248, .98)
        );
    box-shadow:
        0 10px 24px rgba(5, 62, 46, .055),
        inset 0 1px 0 rgba(255, 255, 255, .95);
}

.amount-metrics > div[b-mbyqv3mrj9]::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    content: "";
}

.amount-metrics > div:nth-child(1)[b-mbyqv3mrj9]::before {
    background:
        linear-gradient(
            90deg,
            var(--theme-primary),
            #46a385
        );
}

.amount-metrics > div:nth-child(2)[b-mbyqv3mrj9]::before {
    background:
        linear-gradient(
            90deg,
            #2f789f,
            #64a7c7
        );
}

.amount-metrics > div:nth-child(3)[b-mbyqv3mrj9]::before {
    background:
        linear-gradient(
            90deg,
            #73569b,
            #a487c6
        );
}

.amount-metrics small[b-mbyqv3mrj9] {
    color: #687b72;
    font-size: .91rem;
    font-weight: 700;
}

.amount-metrics strong[b-mbyqv3mrj9] {
    margin-top: 11px;
    color: var(--theme-primary);
    font-size: 1.60rem;
    font-weight: 900;
    line-height: 1;
}

.amount-metrics > div:nth-child(2) strong[b-mbyqv3mrj9] {
    color: #2f789f;
}

.amount-metrics > div:nth-child(3) strong[b-mbyqv3mrj9] {
    color: #73569b;
}

.amount-metrics span[b-mbyqv3mrj9] {
    margin-top: 8px;
    color: #76887f;
    font-size: .86rem;
}

/* เน€เธ›เธฅเธตเนˆเธขเธ™เธ”เน‰เธฒเธ™เธ‚เธงเธฒเน€เธ›เน‡เธ™เธเธฒเธฃเนŒเธ”เนเธ™เธงเธ™เธญเธ™ 3 เนเธ–เธง
   เธ—เธณเนƒเธซเน‰เธ‚เน‰เธญเธ„เธงเธฒเธกเธ เธฒเธฉเธฒเน„เธ—เธขเน„เธกเนˆเธ–เธนเธเธšเธตเธšเธˆเธ™เนเธ•เธเธซเธฅเธฒเธขเธšเธฃเธฃเธ—เธฑเธ” */
.insight-panel:last-child .follow-grid[b-mbyqv3mrj9] {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    margin-top: 18px;
}

.insight-panel:last-child .follow-grid button[b-mbyqv3mrj9] {
    position: relative;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    min-height: 72px;
    overflow: hidden;
    gap: 14px;
    padding: 12px 15px;
    border: 1px solid rgba(10, 114, 87, .09);
    border-radius: 17px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .99),
            rgba(246, 250, 248, .98)
        );
    box-shadow:
        0 9px 21px rgba(5, 62, 46, .05),
        inset 0 1px 0 rgba(255, 255, 255, .95);
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.insight-panel:last-child .follow-grid button[b-mbyqv3mrj9]::after {
    position: absolute;
    right: -26px;
    bottom: -33px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: var(--focus-soft);
    content: "";
}

.insight-panel:last-child .follow-grid button:nth-child(1)[b-mbyqv3mrj9] {
    --focus-color: #2f789f;
    --focus-soft: rgba(47, 120, 159, .10);
}

.insight-panel:last-child .follow-grid button:nth-child(2)[b-mbyqv3mrj9] {
    --focus-color: #b54d43;
    --focus-soft: rgba(181, 77, 67, .10);
}

.insight-panel:last-child .follow-grid button:nth-child(3)[b-mbyqv3mrj9] {
    --focus-color: #987634;
    --focus-soft: rgba(152, 118, 52, .11);
}

.insight-panel:last-child .follow-grid button:hover[b-mbyqv3mrj9] {
    transform: translateX(4px);
    border-color: color-mix(
        in srgb,
        var(--focus-color) 34%,
        transparent
    );
    box-shadow:
        0 14px 28px rgba(5, 62, 46, .10),
        inset 0 1px 0 rgba(255, 255, 255, .95);
}

.insight-panel:last-child .follow-grid button > span[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    width: 58px;
    height: 58px;
    border-radius: 16px;
    color: var(--focus-color);
    background: var(--focus-soft);
}

.insight-panel:last-child .follow-grid button > div[b-mbyqv3mrj9] {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.insight-panel:last-child .follow-grid strong[b-mbyqv3mrj9] {
    color: #253f35;
    font-size: 1.03rem;
    font-weight: 800;
    line-height: 1.42;
    white-space: normal;
}

.insight-panel:last-child .follow-grid small[b-mbyqv3mrj9] {
    margin-top: 4px;
    color: var(--focus-color);
    font-size: .90rem;
    font-weight: 760;
}

@media (max-width: 1450px) {
    .week-board[b-mbyqv3mrj9] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .insight-grid[b-mbyqv3mrj9] {
        grid-template-columns:
            minmax(0, 1.35fr)
            minmax(330px, .85fr);
    }
}

@media (max-width: 1120px) {
    .week-board[b-mbyqv3mrj9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .insight-grid[b-mbyqv3mrj9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .insight-panel[b-mbyqv3mrj9] {
        min-height: auto;
    }
}

@media (max-width: 780px) {
    .week-board-panel[b-mbyqv3mrj9],
    .insight-panel[b-mbyqv3mrj9] {
        padding: 18px;
        border-radius: 20px;
    }

    .week-board[b-mbyqv3mrj9] {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .week-day-card[b-mbyqv3mrj9] {
        min-height: 172px;
        padding: 18px 15px 15px;
    }

    .week-day-card > strong[b-mbyqv3mrj9] {
        font-size: 2.05rem;
    }

    .week-board-header[b-mbyqv3mrj9] {
        align-items: stretch;
    }

    .today-button[b-mbyqv3mrj9] {
        justify-content: center;
    }

    .amount-metrics[b-mbyqv3mrj9] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .week-board[b-mbyqv3mrj9] {
        grid-template-columns: minmax(0, 1fr);
    }

    .week-day-card[b-mbyqv3mrj9] {
        min-height: 160px;
    }

    .insight-heading[b-mbyqv3mrj9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .insight-heading > span[b-mbyqv3mrj9] {
        align-self: flex-start;
    }
}
/* /Components/Pages/02Specialized/05Environment/WastePoints.razor.rz.scp.css */
:root[b-3988qpw9ne] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.waste-page[b-3988qpw9ne] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.waste-page[b-3988qpw9ne]  .waste-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.waste-hero[b-3988qpw9ne] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-3988qpw9ne] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-3988qpw9ne] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-3988qpw9ne],
.hero-action-panel[b-3988qpw9ne] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-3988qpw9ne] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-3988qpw9ne] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-3988qpw9ne] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-3988qpw9ne] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-3988qpw9ne] {
    margin-top: 3px;
    font-size: .94rem;
}

.waste-hero h1[b-3988qpw9ne] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.waste-hero p[b-3988qpw9ne] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-3988qpw9ne] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-3988qpw9ne] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-3988qpw9ne] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-3988qpw9ne] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-3988qpw9ne] {
    font-size: .85rem;
}

.hero-status small[b-3988qpw9ne] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.waste-page[b-3988qpw9ne]  .hero-add-button,
.waste-page[b-3988qpw9ne]  .toolbar-add-button,
.waste-page[b-3988qpw9ne]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.waste-page[b-3988qpw9ne]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-3988qpw9ne],
.hero-refresh-button[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-3988qpw9ne] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-3988qpw9ne] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-3988qpw9ne] {
    opacity: .55;
    cursor: wait;
}

.waste-page[b-3988qpw9ne]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.waste-page[b-3988qpw9ne]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-3988qpw9ne] {
    margin-top: 2px !important;
}

.summary-card[b-3988qpw9ne] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-3988qpw9ne] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-3988qpw9ne] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-3988qpw9ne] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-3988qpw9ne] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-3988qpw9ne] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-3988qpw9ne] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-3988qpw9ne] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-3988qpw9ne] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-3988qpw9ne] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-3988qpw9ne] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-3988qpw9ne] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-3988qpw9ne] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-3988qpw9ne],
.status-overview-card.selected[b-3988qpw9ne] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-3988qpw9ne] {
    background: #f5faf7;
}

.status-overview-card > span[b-3988qpw9ne] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-3988qpw9ne] { background:#687872; }
.status-overview-card.reviewing > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.difference > span[b-3988qpw9ne] { background:#b54d43; }
.status-overview-card.approved > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.closed > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.voided > span[b-3988qpw9ne] { background:#687872; }
.status-overview-card.today > span[b-3988qpw9ne] { background:#73569b; }

.status-overview-card div[b-3988qpw9ne] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-3988qpw9ne] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-3988qpw9ne] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-3988qpw9ne] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-3988qpw9ne] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-3988qpw9ne] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-3988qpw9ne] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-3988qpw9ne] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-3988qpw9ne] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-3988qpw9ne] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-3988qpw9ne] {
    margin-top: 13px;
}

.progress-track[b-3988qpw9ne] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-3988qpw9ne] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-3988qpw9ne] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-3988qpw9ne] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-3988qpw9ne] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-3988qpw9ne],
.waste-list-panel[b-3988qpw9ne] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-3988qpw9ne] {
    padding: 15px;
}

.filter-heading[b-3988qpw9ne],
.list-toolbar[b-3988qpw9ne] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-3988qpw9ne],
.panel-kicker[b-3988qpw9ne] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-3988qpw9ne],
.list-toolbar h2[b-3988qpw9ne] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-3988qpw9ne],
.list-toolbar p[b-3988qpw9ne] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-3988qpw9ne] {
    margin-top: 8px !important;
}

.waste-page[b-3988qpw9ne]  .premium-field,
.waste-page[b-3988qpw9ne]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.waste-page[b-3988qpw9ne]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-3988qpw9ne] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-3988qpw9ne] {
    color: var(--theme-primary);
}

.waste-list-panel[b-3988qpw9ne] {
    overflow: hidden;
}

.list-toolbar[b-3988qpw9ne] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.waste-page[b-3988qpw9ne]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-3988qpw9ne] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-3988qpw9ne] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-3988qpw9ne] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-3988qpw9ne] {
    margin: 0;
    font-size: .84rem;
}

.waste-page[b-3988qpw9ne]  .waste-table {
    font-family: 'Kanit',sans-serif;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head {
    background: #f1f7f4;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-3988qpw9ne] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-3988qpw9ne] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-3988qpw9ne] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-3988qpw9ne] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-3988qpw9ne],
.counter-cashier-cell[b-3988qpw9ne],
.money-cell[b-3988qpw9ne],
.difference-cell[b-3988qpw9ne],
.transaction-status-cell[b-3988qpw9ne] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-3988qpw9ne] {
    min-width: 175px;
}

.date-shift-cell strong[b-3988qpw9ne],
.counter-cashier-cell strong[b-3988qpw9ne],
.money-cell strong[b-3988qpw9ne],
.difference-cell strong[b-3988qpw9ne],
.transaction-status-cell strong[b-3988qpw9ne] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-3988qpw9ne],
.counter-cashier-cell small[b-3988qpw9ne],
.money-cell small[b-3988qpw9ne],
.difference-cell small[b-3988qpw9ne] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-3988qpw9ne],
.counter-cashier-cell em[b-3988qpw9ne] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-3988qpw9ne] { color:var(--theme-primary); }
.money-cell.actual strong[b-3988qpw9ne] { color:#2f789f; }

.difference-cell.matched strong[b-3988qpw9ne] { color:#34734b; }
.difference-cell.over strong[b-3988qpw9ne] { color:#987634; }
.difference-cell.short strong[b-3988qpw9ne] { color:#b54d43; }

.status-chip[b-3988qpw9ne],
.match-chip[b-3988qpw9ne] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-3988qpw9ne] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.difference[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-3988qpw9ne] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-3988qpw9ne] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.waste-page[b-3988qpw9ne]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.waste-page[b-3988qpw9ne]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.waste-page[b-3988qpw9ne]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.waste-page[b-3988qpw9ne]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.waste-page[b-3988qpw9ne]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-3988qpw9ne] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-3988qpw9ne] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-3988qpw9ne],
.image-preview-backdrop[b-3988qpw9ne] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.waste-form-modal[b-3988qpw9ne],
.waste-view-modal[b-3988qpw9ne],
.delete-modal[b-3988qpw9ne],
.image-preview-modal[b-3988qpw9ne] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-3988qpw9ne],
.view-toolbar[b-3988qpw9ne],
.image-preview-header[b-3988qpw9ne] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-3988qpw9ne] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-3988qpw9ne] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-3988qpw9ne],
.view-toolbar small[b-3988qpw9ne],
.image-preview-header small[b-3988qpw9ne] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-3988qpw9ne],
.view-toolbar h2[b-3988qpw9ne],
.image-preview-header h3[b-3988qpw9ne] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-3988qpw9ne] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-3988qpw9ne],
.view-scroll[b-3988qpw9ne] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-3988qpw9ne] {
    background: #e9efec;
}

.modal-footer[b-3988qpw9ne] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.waste-page[b-3988qpw9ne]  .cancel-button,
.waste-page[b-3988qpw9ne]  .save-button,
.waste-page[b-3988qpw9ne]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-3988qpw9ne] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-3988qpw9ne] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-3988qpw9ne] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-3988qpw9ne] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-3988qpw9ne],
.calculation-heading[b-3988qpw9ne] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-3988qpw9ne],
.calculation-heading small[b-3988qpw9ne] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-3988qpw9ne],
.calculation-heading h3[b-3988qpw9ne] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-3988qpw9ne],
.calculation-heading > span[b-3988qpw9ne] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-3988qpw9ne] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-3988qpw9ne] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-3988qpw9ne] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-3988qpw9ne] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-3988qpw9ne] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-3988qpw9ne] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-3988qpw9ne] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-3988qpw9ne] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-3988qpw9ne] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-3988qpw9ne] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-3988qpw9ne] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-3988qpw9ne],
.calculation-grid .short strong[b-3988qpw9ne],
.calculation-grid .short small[b-3988qpw9ne] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-3988qpw9ne] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-3988qpw9ne] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-3988qpw9ne] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-3988qpw9ne] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-3988qpw9ne] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-3988qpw9ne] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-3988qpw9ne] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-3988qpw9ne] {
    font-size:.84rem;
}

.photo-upload-actions[b-3988qpw9ne] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-3988qpw9ne],
.remove-photo-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-3988qpw9ne] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-3988qpw9ne] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-3988qpw9ne] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-3988qpw9ne],
.detail-transaction-table[b-3988qpw9ne] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-3988qpw9ne],
.source-transaction-row[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-3988qpw9ne] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-3988qpw9ne],
.source-transaction-row > span[b-3988qpw9ne] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-3988qpw9ne] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-3988qpw9ne] {
    border-bottom:0;
}

.mini-photo-button[b-3988qpw9ne] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-3988qpw9ne],
.source-transaction-more[b-3988qpw9ne] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-3988qpw9ne] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.waste-view-modal[b-3988qpw9ne] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.waste-page[b-3988qpw9ne]  .view-edit-button,
.waste-page[b-3988qpw9ne]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.waste-page[b-3988qpw9ne]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-waste-profile[b-3988qpw9ne] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-3988qpw9ne] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-3988qpw9ne] {
    text-align:center;
}

.document-organization small[b-3988qpw9ne] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-3988qpw9ne] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-3988qpw9ne] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-3988qpw9ne] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-3988qpw9ne],
.document-number-box small[b-3988qpw9ne] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-3988qpw9ne] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-3988qpw9ne] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-3988qpw9ne] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-3988qpw9ne] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-3988qpw9ne] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-3988qpw9ne] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-3988qpw9ne],
.transaction-summary-section[b-3988qpw9ne],
.source-transaction-section[b-3988qpw9ne],
.review-section[b-3988qpw9ne] {
    margin-top:16px;
}

.section-title[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-3988qpw9ne] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-3988qpw9ne] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-3988qpw9ne] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-3988qpw9ne] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-3988qpw9ne],
.comparison-row[b-3988qpw9ne],
.comparison-total[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-3988qpw9ne] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-3988qpw9ne],
.comparison-row span[b-3988qpw9ne],
.comparison-total span[b-3988qpw9ne] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-3988qpw9ne] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-3988qpw9ne],
.comparison-total span:not(:first-child)[b-3988qpw9ne] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-3988qpw9ne] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-3988qpw9ne] { color:#34734b; }
.difference-text.over[b-3988qpw9ne] { color:#987634; }
.difference-text.short[b-3988qpw9ne] { color:#b54d43; }

.transaction-summary-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-3988qpw9ne] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-3988qpw9ne] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-3988qpw9ne] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-3988qpw9ne] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-3988qpw9ne] { background:#f4fafc; }

.transaction-summary-grid span[b-3988qpw9ne] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-3988qpw9ne] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-3988qpw9ne],
.detail-transaction-row[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-3988qpw9ne] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-3988qpw9ne],
.detail-transaction-row span[b-3988qpw9ne] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-3988qpw9ne] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-3988qpw9ne] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-3988qpw9ne] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-3988qpw9ne] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-3988qpw9ne] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-3988qpw9ne] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-3988qpw9ne] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-3988qpw9ne] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-3988qpw9ne],
.attachment-panel[b-3988qpw9ne] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-3988qpw9ne] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-3988qpw9ne] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-3988qpw9ne] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-3988qpw9ne] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-3988qpw9ne] {
    display:grid;
    gap:7px;
}

.history-item[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-3988qpw9ne] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-3988qpw9ne] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-3988qpw9ne] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-3988qpw9ne],
.history-item em[b-3988qpw9ne] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-3988qpw9ne] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-3988qpw9ne] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-3988qpw9ne] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-3988qpw9ne] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-3988qpw9ne] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-3988qpw9ne] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-3988qpw9ne] { background:rgba(52,115,75,.89); }

.attachment-empty[b-3988qpw9ne] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-3988qpw9ne] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-3988qpw9ne] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-3988qpw9ne] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-3988qpw9ne] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-3988qpw9ne] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-3988qpw9ne] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-3988qpw9ne] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-3988qpw9ne] {
    color:#b54d43;
}

.delete-warning[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-3988qpw9ne] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.waste-page[b-3988qpw9ne]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .waste-hero[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-3988qpw9ne] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-3988qpw9ne] {
        grid-column:1 / -1;
    }

    .document-header[b-3988qpw9ne] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-3988qpw9ne] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .waste-page[b-3988qpw9ne] {
        padding-top:10px;
    }

    .waste-page[b-3988qpw9ne]  .waste-container {
        padding-inline:10px !important;
    }

    .waste-hero[b-3988qpw9ne] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-3988qpw9ne],
    .list-toolbar[b-3988qpw9ne],
    .source-summary-heading[b-3988qpw9ne],
    .calculation-heading[b-3988qpw9ne],
    .view-toolbar[b-3988qpw9ne],
    .section-heading[b-3988qpw9ne] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-3988qpw9ne],
    .variance-grid[b-3988qpw9ne],
    .progress-metrics[b-3988qpw9ne],
    .source-summary-grid[b-3988qpw9ne],
    .system-amount-grid[b-3988qpw9ne],
    .calculation-grid[b-3988qpw9ne],
    .photo-upload-grid[b-3988qpw9ne],
    .transaction-summary-grid[b-3988qpw9ne],
    .review-grid[b-3988qpw9ne],
    .review-note-grid[b-3988qpw9ne],
    .attachment-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-3988qpw9ne] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-3988qpw9ne] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-3988qpw9ne] {
        width:100%;
    }

    .print-waste-profile[b-3988qpw9ne] {
        padding:22px 18px;
    }

    .document-footer[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-3988qpw9ne] {
        grid-column:auto;
    }

    .status-overview[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-3988qpw9ne] {
        width:100%;
    }

    .document-header[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-3988qpw9ne] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-3988qpw9ne] {
        visibility:hidden !important;
    }

    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-3988qpw9ne] {
        display:none !important;
    }

    .modal-backdrop[b-3988qpw9ne],
    .waste-view-modal[b-3988qpw9ne],
    .view-scroll[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .scope-panel[b-3988qpw9ne],
    .amount-comparison-section[b-3988qpw9ne],
    .transaction-summary-section[b-3988qpw9ne],
    .source-transaction-section[b-3988qpw9ne],
    .review-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }

    .mock-document-label[b-3988qpw9ne] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-3988qpw9ne] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.waste-page[b-3988qpw9ne]  .hero-add-button,
.waste-page[b-3988qpw9ne]  .toolbar-add-button,
.waste-page[b-3988qpw9ne]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-3988qpw9ne] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.confirmed > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.checked-in > span[b-3988qpw9ne] { background:#73569b; }
.status-overview-card.in-service > span[b-3988qpw9ne] { background:#c46a2b; }
.status-overview-card.completed > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.cancelled > span[b-3988qpw9ne] { background:#b54d43; }

.service-overview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-3988qpw9ne],
.service-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-3988qpw9ne] {
    background:#f4faf7;
}

.service-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-3988qpw9ne] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-3988qpw9ne] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-3988qpw9ne] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-3988qpw9ne] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-3988qpw9ne],
.service-unit-cell[b-3988qpw9ne],
.provider-location-cell[b-3988qpw9ne],
.queue-priority-cell[b-3988qpw9ne],
.reason-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-3988qpw9ne],
.reason-cell[b-3988qpw9ne] {
    min-width:180px;
}

.appointment-time-cell strong[b-3988qpw9ne],
.service-unit-cell strong[b-3988qpw9ne],
.provider-location-cell strong[b-3988qpw9ne],
.queue-priority-cell strong[b-3988qpw9ne],
.reason-cell strong[b-3988qpw9ne] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-3988qpw9ne],
.service-unit-cell small[b-3988qpw9ne],
.provider-location-cell small[b-3988qpw9ne],
.queue-priority-cell small[b-3988qpw9ne],
.reason-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-3988qpw9ne],
.provider-location-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-3988qpw9ne],
.priority-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-3988qpw9ne] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-3988qpw9ne] { color:#987634; background:#fff4df; }

.priority-chip[b-3988qpw9ne] {
    margin-top:5px;
}

.priority-chip.normal[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-3988qpw9ne] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-3988qpw9ne] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-3988qpw9ne] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-3988qpw9ne] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-3988qpw9ne] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-3988qpw9ne],
.identity-chip.not-found[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-3988qpw9ne] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-3988qpw9ne],
.citizen-source-actions a[b-3988qpw9ne] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-3988qpw9ne] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-3988qpw9ne] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-3988qpw9ne] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-3988qpw9ne] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-3988qpw9ne] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-3988qpw9ne] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-3988qpw9ne] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-3988qpw9ne] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-3988qpw9ne] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-3988qpw9ne] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-3988qpw9ne] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-3988qpw9ne] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-3988qpw9ne] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-3988qpw9ne],
.identity-box small[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-3988qpw9ne] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-3988qpw9ne],
.reason-section[b-3988qpw9ne],
.reminder-section[b-3988qpw9ne] {
    margin-top:16px;
}

.reference-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-3988qpw9ne] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-3988qpw9ne],
.timeline-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-3988qpw9ne],
.timeline-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-3988qpw9ne] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-3988qpw9ne] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-3988qpw9ne] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-3988qpw9ne] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-3988qpw9ne] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-3988qpw9ne] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-3988qpw9ne],
    .preview-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-3988qpw9ne] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-3988qpw9ne] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-3988qpw9ne] {
        grid-column:1 / -1;
    }

    .reference-grid[b-3988qpw9ne],
    .timeline-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-3988qpw9ne],
    .focus-grid[b-3988qpw9ne],
    .citizen-source-grid[b-3988qpw9ne],
    .preview-grid[b-3988qpw9ne],
    .consent-grid[b-3988qpw9ne],
    .source-photo-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .note-grid[b-3988qpw9ne],
    .timeline-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-3988qpw9ne] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-3988qpw9ne] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-3988qpw9ne] {
        margin:0 auto;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .service-section[b-3988qpw9ne],
    .reason-section[b-3988qpw9ne],
    .reminder-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size: 16px;
    line-height: 1.55;
}

.waste-page[b-3988qpw9ne]  .mud-typography,
.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-input-label,
.waste-page[b-3988qpw9ne]  .mud-select,
.waste-page[b-3988qpw9ne]  .mud-list-item-text,
.waste-page[b-3988qpw9ne]  .mud-button-label,
.waste-page[b-3988qpw9ne]  .mud-table-cell,
.waste-page[b-3988qpw9ne]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size: .92rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size: .90rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-3988qpw9ne] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-3988qpw9ne] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-3988qpw9ne] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-3988qpw9ne] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-3988qpw9ne] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-3988qpw9ne] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-3988qpw9ne] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-3988qpw9ne] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-3988qpw9ne],
.waste-list-panel[b-3988qpw9ne],
.insight-panel[b-3988qpw9ne] {
    border-radius: 20px;
}

.filter-panel[b-3988qpw9ne] {
    padding: 20px;
}

.list-toolbar[b-3988qpw9ne] {
    padding: 19px 20px;
}

.filter-heading p[b-3988qpw9ne],
.list-toolbar p[b-3988qpw9ne] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-3988qpw9ne] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-3988qpw9ne] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-3988qpw9ne],
.service-unit-cell[b-3988qpw9ne],
.provider-location-cell[b-3988qpw9ne],
.queue-priority-cell[b-3988qpw9ne],
.reason-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    min-width: 155px;
}

.provider-location-cell[b-3988qpw9ne],
.reason-cell[b-3988qpw9ne] {
    min-width: 215px;
}

.service-chip[b-3988qpw9ne],
.priority-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne],
.identity-chip[b-3988qpw9ne] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-3988qpw9ne] {
    min-width: 205px;
    gap: 7px;
}

.waste-page[b-3988qpw9ne]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-3988qpw9ne] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-3988qpw9ne],
.view-toolbar[b-3988qpw9ne],
.image-preview-header[b-3988qpw9ne] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-3988qpw9ne],
.view-scroll[b-3988qpw9ne] {
    padding: 20px;
}

.modal-footer[b-3988qpw9ne] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-3988qpw9ne] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-3988qpw9ne] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-3988qpw9ne],
.preview-grid > div[b-3988qpw9ne],
.reference-grid > div[b-3988qpw9ne],
.timeline-grid > div[b-3988qpw9ne] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-3988qpw9ne] {
    padding: 13px;
}

.photo-preview[b-3988qpw9ne] {
    min-height: 200px;
}

.photo-preview img[b-3988qpw9ne] {
    height: 200px;
}

.history-item[b-3988qpw9ne] {
    padding: 12px;
}

.attachment-card[b-3988qpw9ne],
.attachment-card img[b-3988qpw9ne] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .waste-page[b-3988qpw9ne] {
        font-size: 15px;
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-3988qpw9ne] {
        min-height: 122px;
    }

    .status-overview-card[b-3988qpw9ne],
    .service-overview-card[b-3988qpw9ne] {
        min-height: 82px;
    }

    .modal-body[b-3988qpw9ne],
    .view-scroll[b-3988qpw9ne] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #waste-profile-print-area[b-3988qpw9ne] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #waste-profile-print-area h1[b-3988qpw9ne] {
        font-size: 18pt !important;
    }

    #waste-profile-print-area h2[b-3988qpw9ne] {
        font-size: 14pt !important;
    }

    #waste-profile-print-area h3[b-3988qpw9ne] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-3988qpw9ne] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.follow-up > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.referred > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.cancelled > span[b-3988qpw9ne] { background:#b54d43; }
.status-overview-card.month > span[b-3988qpw9ne] { background:#73569b; }

.service-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-3988qpw9ne] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-3988qpw9ne] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-3988qpw9ne] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-3988qpw9ne],
.service-unit-cell[b-3988qpw9ne],
.provider-location-cell[b-3988qpw9ne],
.result-cell[b-3988qpw9ne],
.follow-score-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-3988qpw9ne],
.result-cell[b-3988qpw9ne] {
    min-width:230px;
}

.history-date-cell strong[b-3988qpw9ne],
.service-unit-cell strong[b-3988qpw9ne],
.provider-location-cell strong[b-3988qpw9ne],
.result-cell strong[b-3988qpw9ne],
.follow-score-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-3988qpw9ne],
.service-unit-cell small[b-3988qpw9ne],
.provider-location-cell small[b-3988qpw9ne],
.result-cell small[b-3988qpw9ne],
.follow-score-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-3988qpw9ne],
.provider-location-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.referred[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-3988qpw9ne] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-3988qpw9ne] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-3988qpw9ne] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-3988qpw9ne] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-3988qpw9ne] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-3988qpw9ne] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-3988qpw9ne],
.source-actions button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-3988qpw9ne] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-3988qpw9ne] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-3988qpw9ne] {
    min-height:180px;
}

.source-photo-card img[b-3988qpw9ne] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-3988qpw9ne] {
    margin-top:18px;
}

.vital-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-3988qpw9ne],
.quality-grid > div[b-3988qpw9ne],
.follow-up-grid > div[b-3988qpw9ne] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-3988qpw9ne],
.quality-grid span[b-3988qpw9ne],
.follow-up-grid span[b-3988qpw9ne] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-3988qpw9ne],
.quality-grid strong[b-3988qpw9ne],
.follow-up-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-3988qpw9ne] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-3988qpw9ne],
.quality-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:.94rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:.92rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-3988qpw9ne] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-3988qpw9ne] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-3988qpw9ne] { background:rgba(104,120,114,.89); }

.view-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-3988qpw9ne],
    .service-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-3988qpw9ne],
    .vital-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-3988qpw9ne] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-3988qpw9ne],
    .quality-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-3988qpw9ne],
    .service-overview[b-3988qpw9ne],
    .care-metrics[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .source-photo-grid[b-3988qpw9ne],
    .vital-grid[b-3988qpw9ne],
    .follow-up-grid[b-3988qpw9ne],
    .quality-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-3988qpw9ne] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.follow-up > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.referred > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.overdue > span[b-3988qpw9ne] { background:#b54d43; }
.status-overview-card.inactive > span[b-3988qpw9ne] { background:#687872; }

.risk-overview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-3988qpw9ne],
.risk-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-3988qpw9ne] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-3988qpw9ne],
.care-metrics strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-3988qpw9ne],
.care-metrics small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-3988qpw9ne] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-3988qpw9ne],
.risk-adl-cell[b-3988qpw9ne],
.dependency-living-cell[b-3988qpw9ne],
.caregiver-cell[b-3988qpw9ne],
.follow-up-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-3988qpw9ne] {
    min-width:190px;
}

.register-age-cell strong[b-3988qpw9ne],
.risk-adl-cell strong[b-3988qpw9ne],
.dependency-living-cell strong[b-3988qpw9ne],
.caregiver-cell strong[b-3988qpw9ne],
.follow-up-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-3988qpw9ne],
.risk-adl-cell small[b-3988qpw9ne],
.dependency-living-cell small[b-3988qpw9ne],
.caregiver-cell small[b-3988qpw9ne],
.follow-up-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-3988qpw9ne],
.caregiver-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-3988qpw9ne],
.dependency-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne],
.identity-chip[b-3988qpw9ne],
.overdue-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.risk-chip.high[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.active[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.referred[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.overdue-chip[b-3988qpw9ne] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-3988qpw9ne] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-3988qpw9ne] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-3988qpw9ne] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-3988qpw9ne] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-3988qpw9ne] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-3988qpw9ne] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-3988qpw9ne],
.source-actions button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-3988qpw9ne] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-3988qpw9ne] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-3988qpw9ne] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-3988qpw9ne],
.reference-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-3988qpw9ne],
.reference-grid > div[b-3988qpw9ne],
.care-plan-grid > div[b-3988qpw9ne] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-3988qpw9ne],
.reference-grid span[b-3988qpw9ne],
.care-plan-grid span[b-3988qpw9ne] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-3988qpw9ne],
.reference-grid strong[b-3988qpw9ne],
.care-plan-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-3988qpw9ne] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:.96rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:.94rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-3988qpw9ne] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-3988qpw9ne] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-3988qpw9ne] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-3988qpw9ne] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-3988qpw9ne] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-3988qpw9ne] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-3988qpw9ne],
    .assessment-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-3988qpw9ne],
    .risk-overview[b-3988qpw9ne],
    .dependency-grid[b-3988qpw9ne],
    .care-metrics[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .assessment-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .care-plan-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size:16.5px;
    line-height:1.62;
}

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-3988qpw9ne] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-3988qpw9ne] { background:#73569b; }
.status-overview-card.field > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.completed > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.follow-up > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.referred > span[b-3988qpw9ne] { background:#b55b82; }

.visit-type-overview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-3988qpw9ne],
.visit-type-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-3988qpw9ne] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-3988qpw9ne] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-3988qpw9ne] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-3988qpw9ne] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-3988qpw9ne] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-3988qpw9ne],
.care-metrics strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-3988qpw9ne],
.care-metrics small[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-3988qpw9ne],
.visit-type-cell[b-3988qpw9ne],
.team-location-cell[b-3988qpw9ne],
.result-cell[b-3988qpw9ne],
.follow-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-3988qpw9ne],
.result-cell[b-3988qpw9ne] {
    min-width:230px;
}

.visit-date-cell strong[b-3988qpw9ne],
.visit-type-cell strong[b-3988qpw9ne],
.team-location-cell strong[b-3988qpw9ne],
.result-cell strong[b-3988qpw9ne],
.follow-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-3988qpw9ne],
.visit-type-cell small[b-3988qpw9ne],
.team-location-cell small[b-3988qpw9ne],
.result-cell small[b-3988qpw9ne],
.follow-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-3988qpw9ne],
.team-location-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne],
.identity-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.referred[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.priority-text[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-3988qpw9ne] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-3988qpw9ne] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-3988qpw9ne] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-3988qpw9ne] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-3988qpw9ne] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-3988qpw9ne] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-3988qpw9ne] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-3988qpw9ne] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-3988qpw9ne] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-3988qpw9ne] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-3988qpw9ne],
.reference-grid > div[b-3988qpw9ne] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-3988qpw9ne],
.reference-grid span[b-3988qpw9ne] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-3988qpw9ne],
.reference-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:1rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:.98rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-3988qpw9ne],
    .visit-type-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-3988qpw9ne],
    .visit-type-overview[b-3988qpw9ne],
    .target-grid[b-3988qpw9ne],
    .care-metrics[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .vital-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size:17px;
    line-height:1.65;
}

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-3988qpw9ne] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.review > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.eligible > span[b-3988qpw9ne] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.paid > span[b-3988qpw9ne] { background:#73569b; }

.type-overview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-3988qpw9ne],
.type-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-3988qpw9ne] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-3988qpw9ne] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-3988qpw9ne] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-3988qpw9ne] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-3988qpw9ne],
.target-grid button[b-3988qpw9ne] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-3988qpw9ne],
.welfare-type-cell[b-3988qpw9ne],
.household-cell[b-3988qpw9ne],
.amount-cell[b-3988qpw9ne],
.officer-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-3988qpw9ne],
.officer-cell[b-3988qpw9ne] {
    min-width:210px;
}

.application-no-cell strong[b-3988qpw9ne],
.welfare-type-cell strong[b-3988qpw9ne],
.household-cell strong[b-3988qpw9ne],
.amount-cell strong[b-3988qpw9ne],
.officer-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-3988qpw9ne],
.welfare-type-cell small[b-3988qpw9ne],
.household-cell small[b-3988qpw9ne],
.amount-cell small[b-3988qpw9ne],
.officer-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-3988qpw9ne],
.household-cell em[b-3988qpw9ne],
.amount-cell em[b-3988qpw9ne],
.officer-cell em[b-3988qpw9ne],
.citizen-photo-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne],
.source-group-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.source-group-chip[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-3988qpw9ne] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-3988qpw9ne],
.amount-preview[b-3988qpw9ne] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-3988qpw9ne] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-3988qpw9ne] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-3988qpw9ne],
.amount-preview > div[b-3988qpw9ne] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-3988qpw9ne],
.amount-preview small[b-3988qpw9ne] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-3988qpw9ne] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-3988qpw9ne],
.amount-preview strong[b-3988qpw9ne] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-3988qpw9ne],
.amount-preview span[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-3988qpw9ne] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-3988qpw9ne],
.amount-document-grid small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-3988qpw9ne] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-3988qpw9ne] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-3988qpw9ne] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:1.02rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:1rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-3988qpw9ne] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-3988qpw9ne],
    .type-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-3988qpw9ne],
    .amount-document-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-3988qpw9ne],
    .type-overview[b-3988qpw9ne],
    .budget-grid[b-3988qpw9ne],
    .target-grid[b-3988qpw9ne],
    .care-metrics[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .assessment-preview[b-3988qpw9ne],
    .amount-preview[b-3988qpw9ne],
    .amount-document-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size:17px;
    line-height:1.66;
}

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-3988qpw9ne] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-3988qpw9ne] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-3988qpw9ne] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.payment > span[b-3988qpw9ne] { background:#b54d43; }
.status-overview-card.suspended > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.expiring > span[b-3988qpw9ne] { background:#73569b; }

.target-overview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-3988qpw9ne],
.target-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-3988qpw9ne] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-3988qpw9ne] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-3988qpw9ne] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-3988qpw9ne] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-3988qpw9ne],
.follow-grid button[b-3988qpw9ne] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-3988qpw9ne] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-3988qpw9ne],
.benefit-cell[b-3988qpw9ne],
.period-cell[b-3988qpw9ne],
.amount-cell[b-3988qpw9ne],
.payment-cycle-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-3988qpw9ne] {
    min-width:225px;
}

.registry-cell strong[b-3988qpw9ne],
.benefit-cell strong[b-3988qpw9ne],
.period-cell strong[b-3988qpw9ne],
.amount-cell strong[b-3988qpw9ne],
.payment-cycle-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-3988qpw9ne],
.benefit-cell small[b-3988qpw9ne],
.period-cell small[b-3988qpw9ne],
.amount-cell small[b-3988qpw9ne],
.payment-cycle-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-3988qpw9ne],
.period-cell em[b-3988qpw9ne],
.amount-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-3988qpw9ne],
.cycle-chip[b-3988qpw9ne],
.verify-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne],
.source-group-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-3988qpw9ne] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.expired[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.source-group-chip[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-3988qpw9ne] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-3988qpw9ne] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-3988qpw9ne] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-3988qpw9ne] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-3988qpw9ne] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:1.02rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:1rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-3988qpw9ne] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-3988qpw9ne] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-3988qpw9ne],
    .target-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-3988qpw9ne],
    .target-overview[b-3988qpw9ne],
    .amount-metrics[b-3988qpw9ne],
    .follow-grid[b-3988qpw9ne],
    .condition-switch-grid[b-3988qpw9ne],
    .amount-preview[b-3988qpw9ne],
    .source-data-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .amount-document-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .patient-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size:17px;
    line-height:1.66;
}

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-3988qpw9ne] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-3988qpw9ne] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-3988qpw9ne] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-3988qpw9ne] { background:#687872; }
.status-overview-card.approval > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.processing > span[b-3988qpw9ne] { background:#2f789f; }
.status-overview-card.paid > span[b-3988qpw9ne] { background:#34734b; }
.status-overview-card.failed > span[b-3988qpw9ne] { background:#b54d43; }

.disbursement-progress[b-3988qpw9ne] {
    margin-top:15px;
}

.disbursement-progress > div[b-3988qpw9ne] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-3988qpw9ne] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-3988qpw9ne],
.amount-cell[b-3988qpw9ne],
.progress-cell[b-3988qpw9ne],
.date-cell[b-3988qpw9ne],
.control-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-3988qpw9ne] {
    min-width:245px;
}

.batch-cell strong[b-3988qpw9ne],
.amount-cell strong[b-3988qpw9ne],
.progress-cell strong[b-3988qpw9ne],
.date-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-3988qpw9ne],
.amount-cell small[b-3988qpw9ne],
.progress-cell small[b-3988qpw9ne],
.date-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-3988qpw9ne],
.amount-cell em[b-3988qpw9ne],
.date-cell em[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-3988qpw9ne] {
    min-width:180px;
}

.recipient-stack[b-3988qpw9ne] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-3988qpw9ne],
.recipient-stack span[b-3988qpw9ne] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-3988qpw9ne] {
    margin-left:0;
}

.recipient-stack img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-3988qpw9ne] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-3988qpw9ne] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-3988qpw9ne],
.approval-chip[b-3988qpw9ne],
.reconcile-chip[b-3988qpw9ne],
.cycle-chip[b-3988qpw9ne],
.line-status-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.approved[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.control-cell[b-3988qpw9ne] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-3988qpw9ne] {
    align-items:center;
}

.selection-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-3988qpw9ne] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-3988qpw9ne] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-3988qpw9ne] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-3988qpw9ne] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-3988qpw9ne] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-3988qpw9ne] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-3988qpw9ne],
.source-selection-table td[b-3988qpw9ne] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-3988qpw9ne] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-3988qpw9ne] {
    background:#f0faf6;
}

.source-person-cell[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-3988qpw9ne] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-3988qpw9ne],
.source-benefit-cell strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-3988qpw9ne],
.source-benefit-cell small[b-3988qpw9ne],
.source-date[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-3988qpw9ne] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-3988qpw9ne] {
    min-width:190px;
}

.source-amount[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-3988qpw9ne] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-3988qpw9ne] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-3988qpw9ne] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-3988qpw9ne] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-3988qpw9ne] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-3988qpw9ne] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-3988qpw9ne] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-3988qpw9ne] {
    font-size:3.5rem;
}

.batch-overview-content small[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-3988qpw9ne] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-3988qpw9ne] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-3988qpw9ne] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-3988qpw9ne] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-3988qpw9ne],
.print-line-table td[b-3988qpw9ne] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-3988qpw9ne] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-3988qpw9ne],
.print-line-table td small[b-3988qpw9ne] {
    display:block;
}

.print-line-table td small[b-3988qpw9ne] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-3988qpw9ne] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-3988qpw9ne] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-3988qpw9ne] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-3988qpw9ne] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-3988qpw9ne] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-3988qpw9ne] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-3988qpw9ne] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-3988qpw9ne] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-3988qpw9ne] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-3988qpw9ne] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-3988qpw9ne] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-3988qpw9ne] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:1.02rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:1rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-3988qpw9ne],
    .recipient-detail-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-3988qpw9ne] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-3988qpw9ne] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-3988qpw9ne],
    .amount-metrics[b-3988qpw9ne],
    .follow-grid[b-3988qpw9ne],
    .source-selection-summary[b-3988qpw9ne],
    .amount-preview[b-3988qpw9ne],
    .recipient-detail-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .amount-document-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-3988qpw9ne] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-3988qpw9ne] {
        overflow-x:auto;
    }

    .source-selection-table[b-3988qpw9ne] {
        min-width:1050px;
    }

    .batch-overview-panel[b-3988qpw9ne],
    .recipient-detail-card[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-3988qpw9ne] {
        width:100%;
        height:190px;
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .batch-overview-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.waste-page[b-3988qpw9ne] {
    font-size:17px;
    line-height:1.66;
}

.waste-hero[b-3988qpw9ne] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-3988qpw9ne] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-3988qpw9ne] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-3988qpw9ne] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-3988qpw9ne] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-3988qpw9ne],
.type-overview[b-3988qpw9ne] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-3988qpw9ne] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-3988qpw9ne] { background:#987634; }
.status-overview-card.full > span[b-3988qpw9ne] { background:#c56b2a; }
.status-overview-card.overflow > span[b-3988qpw9ne] { background:#b54d43; }
.status-overview-card.maintenance > span[b-3988qpw9ne] { background:#73569b; }

.type-overview[b-3988qpw9ne] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-3988qpw9ne],
.type-overview-card.selected[b-3988qpw9ne] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-3988qpw9ne] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-3988qpw9ne] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-3988qpw9ne] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-3988qpw9ne] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-3988qpw9ne] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-3988qpw9ne] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-3988qpw9ne] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-3988qpw9ne] {
    margin-top:15px;
}

.fill-progress > div[b-3988qpw9ne] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-3988qpw9ne] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-3988qpw9ne] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-3988qpw9ne] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-3988qpw9ne] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-3988qpw9ne] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-3988qpw9ne] {
    background:#987634;
}

.map-pin.full[b-3988qpw9ne] {
    background:#c56b2a;
}

.map-pin.overflow[b-3988qpw9ne] {
    background:#b54d43;
}

.map-pin.maintenance[b-3988qpw9ne] {
    background:#73569b;
}

.map-pin.inactive[b-3988qpw9ne] {
    background:#687872;
}

.map-pin span[b-3988qpw9ne] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-3988qpw9ne] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-3988qpw9ne] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-3988qpw9ne] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-3988qpw9ne] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-3988qpw9ne] { background:#987634; }
.map-board-legend i.full[b-3988qpw9ne] { background:#b54d43; }
.map-board-legend i.maintenance[b-3988qpw9ne] { background:#73569b; }

.map-board-caption[b-3988qpw9ne] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-3988qpw9ne],
.map-board-caption small[b-3988qpw9ne] {
    display:block;
}

.map-board-caption strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-3988qpw9ne] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.point-photo-cell[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-3988qpw9ne] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-3988qpw9ne] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-3988qpw9ne] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.point-photo-cell em[b-3988qpw9ne] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-3988qpw9ne],
.bin-cell[b-3988qpw9ne],
.fill-cell[b-3988qpw9ne],
.collection-cell[b-3988qpw9ne],
.sensor-cell[b-3988qpw9ne],
.status-cell[b-3988qpw9ne] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-3988qpw9ne] {
    min-width:220px;
}

.location-cell strong[b-3988qpw9ne],
.bin-cell strong[b-3988qpw9ne],
.fill-cell strong[b-3988qpw9ne],
.collection-cell strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-3988qpw9ne],
.bin-cell small[b-3988qpw9ne],
.fill-cell small[b-3988qpw9ne],
.collection-cell small[b-3988qpw9ne],
.sensor-cell small[b-3988qpw9ne],
.status-cell small[b-3988qpw9ne] {
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.location-cell em[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.waste-type-chip[b-3988qpw9ne],
.collection-chip[b-3988qpw9ne],
.sensor-chip[b-3988qpw9ne],
.status-chip[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.waste-type-chip.general[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-3988qpw9ne] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-3988qpw9ne] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.status-chip.active[b-3988qpw9ne] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-3988qpw9ne] { color:#987634; background:#fff4df; }
.status-chip.full[b-3988qpw9ne] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-3988qpw9ne] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-3988qpw9ne] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-3988qpw9ne] { color:#687872; background:#edf1ef; }

.table-progress[b-3988qpw9ne] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-3988qpw9ne] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-3988qpw9ne] { background:var(--theme-primary); }
.table-progress.medium span[b-3988qpw9ne] { background:#2f789f; }
.table-progress.high span[b-3988qpw9ne] { background:#987634; }
.table-progress.critical span[b-3988qpw9ne] { background:#b54d43; }

.repair-alert[b-3988qpw9ne],
.clean-alert[b-3988qpw9ne] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-3988qpw9ne] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-3988qpw9ne] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-3988qpw9ne] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-3988qpw9ne] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-3988qpw9ne] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-3988qpw9ne] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-3988qpw9ne] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-3988qpw9ne] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-3988qpw9ne] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-3988qpw9ne] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-3988qpw9ne] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-3988qpw9ne] { background:#2f789f; }
.fill-preview-bin.high span[b-3988qpw9ne] { background:#987634; }
.fill-preview-bin.critical span[b-3988qpw9ne] { background:#b54d43; }

.fill-preview-bin strong[b-3988qpw9ne] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-3988qpw9ne] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-3988qpw9ne] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-3988qpw9ne] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-3988qpw9ne] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-3988qpw9ne] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.source-photo-preview[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-3988qpw9ne] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-3988qpw9ne] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-3988qpw9ne] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-3988qpw9ne] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-3988qpw9ne] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-3988qpw9ne] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-3988qpw9ne] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-3988qpw9ne] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-3988qpw9ne] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-3988qpw9ne] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.large-fill-indicator[b-3988qpw9ne] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-3988qpw9ne] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-3988qpw9ne] { background:#2f789f; }
.large-fill-indicator.high > span[b-3988qpw9ne] { background:#987634; }
.large-fill-indicator.critical > span[b-3988qpw9ne] { background:#b54d43; }

.large-fill-indicator strong[b-3988qpw9ne],
.large-fill-indicator small[b-3988qpw9ne] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-3988qpw9ne] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-3988qpw9ne] {
    font-size:.84rem;
}

.detail-map-preview[b-3988qpw9ne] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-3988qpw9ne] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-3988qpw9ne] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-3988qpw9ne] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-3988qpw9ne] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-3988qpw9ne] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-3988qpw9ne] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-3988qpw9ne] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-3988qpw9ne] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-3988qpw9ne] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-3988qpw9ne] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.workflow-button.collect[b-3988qpw9ne] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-3988qpw9ne] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.waste-page[b-3988qpw9ne]  .waste-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.waste-page[b-3988qpw9ne]  .mud-input,
.waste-page[b-3988qpw9ne]  .mud-select-input {
    font-size:1.02rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.waste-page[b-3988qpw9ne]  .mud-list-item-text {
    font-size:1rem !important;
}

.waste-page[b-3988qpw9ne]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-3988qpw9ne] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-3988qpw9ne] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-3988qpw9ne] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-3988qpw9ne] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-3988qpw9ne] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-3988qpw9ne],
    .type-overview[b-3988qpw9ne] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-3988qpw9ne] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-3988qpw9ne] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-3988qpw9ne] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-3988qpw9ne] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-3988qpw9ne],
    .type-overview[b-3988qpw9ne],
    .amount-metrics[b-3988qpw9ne],
    .follow-grid[b-3988qpw9ne],
    .condition-switch-grid[b-3988qpw9ne],
    .reference-grid[b-3988qpw9ne],
    .amount-document-grid[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-3988qpw9ne],
    .fill-preview-card[b-3988qpw9ne],
    .coordinate-preview[b-3988qpw9ne],
    .collection-history-list article[b-3988qpw9ne] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-3988qpw9ne] {
        min-height:240px;
    }

    .large-fill-indicator[b-3988qpw9ne],
    .fill-preview-bin[b-3988qpw9ne],
    .coordinate-pin[b-3988qpw9ne] {
        margin:0 auto;
    }

    .map-board[b-3988qpw9ne] {
        min-height:500px;
    }

    .map-pin[b-3988qpw9ne] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .waste-page[b-3988qpw9ne]  .waste-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #waste-profile-print-area[b-3988qpw9ne],
    #waste-profile-print-area *[b-3988qpw9ne] {
        visibility:visible !important;
    }

    #waste-profile-print-area[b-3988qpw9ne] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .waste-view-modal[b-3988qpw9ne] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-3988qpw9ne],
    .document-status-strip[b-3988qpw9ne],
    .point-cover-panel[b-3988qpw9ne],
    .document-section[b-3988qpw9ne],
    .document-footer[b-3988qpw9ne] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/05Environment/WaterQuality.razor.rz.scp.css */
:root[b-cv86ynb6dk] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.water-page[b-cv86ynb6dk] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.water-page[b-cv86ynb6dk]  .water-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.water-hero[b-cv86ynb6dk] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-cv86ynb6dk] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-cv86ynb6dk] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-cv86ynb6dk],
.hero-action-panel[b-cv86ynb6dk] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-cv86ynb6dk] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-cv86ynb6dk] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-cv86ynb6dk] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-cv86ynb6dk] {
    color: #d8ede6;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-cv86ynb6dk] {
    margin-top: 3px;
    font-size: .94rem;
}

.water-hero h1[b-cv86ynb6dk] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.water-hero p[b-cv86ynb6dk] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-cv86ynb6dk] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .84rem;
    font-weight: 650;
}

.hero-action-panel[b-cv86ynb6dk] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-cv86ynb6dk] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-cv86ynb6dk] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-cv86ynb6dk] {
    font-size: .85rem;
}

.hero-status small[b-cv86ynb6dk] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .84rem;
}

.water-page[b-cv86ynb6dk]  .hero-add-button,
.water-page[b-cv86ynb6dk]  .toolbar-add-button,
.water-page[b-cv86ynb6dk]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.water-page[b-cv86ynb6dk]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-cv86ynb6dk],
.hero-refresh-button[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-cv86ynb6dk] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-cv86ynb6dk] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-cv86ynb6dk] {
    opacity: .55;
    cursor: wait;
}

.water-page[b-cv86ynb6dk]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.water-page[b-cv86ynb6dk]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-cv86ynb6dk] {
    margin-top: 2px !important;
}

.summary-card[b-cv86ynb6dk] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-cv86ynb6dk] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-cv86ynb6dk] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-cv86ynb6dk] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-cv86ynb6dk] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-cv86ynb6dk] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-cv86ynb6dk] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-cv86ynb6dk] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-cv86ynb6dk] {
    color: #788982;
    font-size: .84rem;
    font-weight: 650;
}

.summary-card p[b-cv86ynb6dk] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-cv86ynb6dk] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-cv86ynb6dk] {
    color: #798a83;
    font-size: .84rem;
}

.summary-card em[b-cv86ynb6dk] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-cv86ynb6dk],
.status-overview-card.selected[b-cv86ynb6dk] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-cv86ynb6dk] {
    background: #f5faf7;
}

.status-overview-card > span[b-cv86ynb6dk] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-cv86ynb6dk] { background:#687872; }
.status-overview-card.reviewing > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.difference > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.approved > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.closed > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.voided > span[b-cv86ynb6dk] { background:#687872; }
.status-overview-card.today > span[b-cv86ynb6dk] { background:#73569b; }

.status-overview-card div[b-cv86ynb6dk] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-cv86ynb6dk] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.status-overview-card strong[b-cv86ynb6dk] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-cv86ynb6dk] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-cv86ynb6dk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-cv86ynb6dk] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-cv86ynb6dk] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .84rem;
    font-weight: 700;
}

.variance-grid[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-cv86ynb6dk] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-cv86ynb6dk] {
    display: block;
    color: #3c5047;
    font-size: .84rem;
}

.variance-card small[b-cv86ynb6dk] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .84rem;
}

.closing-progress[b-cv86ynb6dk] {
    margin-top: 13px;
}

.progress-track[b-cv86ynb6dk] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-cv86ynb6dk] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-cv86ynb6dk] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-cv86ynb6dk] {
    display: block;
    color: #87958f;
    font-size: .84rem;
}

.progress-metrics strong[b-cv86ynb6dk] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-cv86ynb6dk],
.water-list-panel[b-cv86ynb6dk] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-cv86ynb6dk] {
    padding: 15px;
}

.filter-heading[b-cv86ynb6dk],
.list-toolbar[b-cv86ynb6dk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-cv86ynb6dk],
.panel-kicker[b-cv86ynb6dk] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-cv86ynb6dk],
.list-toolbar h2[b-cv86ynb6dk] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-cv86ynb6dk],
.list-toolbar p[b-cv86ynb6dk] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .84rem;
    line-height: 1.65;
}

.clear-filter-button[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-cv86ynb6dk] {
    margin-top: 8px !important;
}

.water-page[b-cv86ynb6dk]  .premium-field,
.water-page[b-cv86ynb6dk]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.water-page[b-cv86ynb6dk]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .84rem !important;
    text-transform: none !important;
}

.filter-summary[b-cv86ynb6dk] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .84rem;
}

.filter-summary strong[b-cv86ynb6dk] {
    color: var(--theme-primary);
}

.water-list-panel[b-cv86ynb6dk] {
    overflow: hidden;
}

.list-toolbar[b-cv86ynb6dk] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.water-page[b-cv86ynb6dk]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-cv86ynb6dk] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-cv86ynb6dk] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-cv86ynb6dk] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-cv86ynb6dk] {
    margin: 0;
    font-size: .84rem;
}

.water-page[b-cv86ynb6dk]  .water-table {
    font-family: 'Kanit',sans-serif;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head {
    background: #f1f7f4;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .84rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-cv86ynb6dk] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-cv86ynb6dk] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-cv86ynb6dk] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .84rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-cv86ynb6dk] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .84rem;
}

.date-shift-cell[b-cv86ynb6dk],
.counter-cashier-cell[b-cv86ynb6dk],
.money-cell[b-cv86ynb6dk],
.difference-cell[b-cv86ynb6dk],
.transaction-status-cell[b-cv86ynb6dk] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-cv86ynb6dk] {
    min-width: 175px;
}

.date-shift-cell strong[b-cv86ynb6dk],
.counter-cashier-cell strong[b-cv86ynb6dk],
.money-cell strong[b-cv86ynb6dk],
.difference-cell strong[b-cv86ynb6dk],
.transaction-status-cell strong[b-cv86ynb6dk] {
    color: #3c5047;
    font-size: .84rem;
    line-height: 1.48;
}

.date-shift-cell small[b-cv86ynb6dk],
.counter-cashier-cell small[b-cv86ynb6dk],
.money-cell small[b-cv86ynb6dk],
.difference-cell small[b-cv86ynb6dk] {
    margin-top: 3px;
    color: #84928d;
    font-size: .84rem;
}

.date-shift-cell em[b-cv86ynb6dk],
.counter-cashier-cell em[b-cv86ynb6dk] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-cv86ynb6dk] { color:var(--theme-primary); }
.money-cell.actual strong[b-cv86ynb6dk] { color:#2f789f; }

.difference-cell.matched strong[b-cv86ynb6dk] { color:#34734b; }
.difference-cell.over strong[b-cv86ynb6dk] { color:#987634; }
.difference-cell.short strong[b-cv86ynb6dk] { color:#b54d43; }

.status-chip[b-cv86ynb6dk],
.match-chip[b-cv86ynb6dk] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 700;
}

.status-chip i[b-cv86ynb6dk] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.difference[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-cv86ynb6dk] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-cv86ynb6dk] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.water-page[b-cv86ynb6dk]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.water-page[b-cv86ynb6dk]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.water-page[b-cv86ynb6dk]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.water-page[b-cv86ynb6dk]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.water-page[b-cv86ynb6dk]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-cv86ynb6dk] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-cv86ynb6dk] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .84rem;
}

/* MODALS */

.modal-backdrop[b-cv86ynb6dk],
.image-preview-backdrop[b-cv86ynb6dk] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.water-form-modal[b-cv86ynb6dk],
.water-view-modal[b-cv86ynb6dk],
.delete-modal[b-cv86ynb6dk],
.image-preview-modal[b-cv86ynb6dk] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-cv86ynb6dk],
.view-toolbar[b-cv86ynb6dk],
.image-preview-header[b-cv86ynb6dk] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-cv86ynb6dk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-cv86ynb6dk] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-cv86ynb6dk],
.view-toolbar small[b-cv86ynb6dk],
.image-preview-header small[b-cv86ynb6dk] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-cv86ynb6dk],
.view-toolbar h2[b-cv86ynb6dk],
.image-preview-header h3[b-cv86ynb6dk] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-cv86ynb6dk] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.modal-body[b-cv86ynb6dk],
.view-scroll[b-cv86ynb6dk] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-cv86ynb6dk] {
    background: #e9efec;
}

.modal-footer[b-cv86ynb6dk] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.water-page[b-cv86ynb6dk]  .cancel-button,
.water-page[b-cv86ynb6dk]  .save-button,
.water-page[b-cv86ynb6dk]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.form-section-title[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-cv86ynb6dk] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-cv86ynb6dk] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-cv86ynb6dk] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.open-transactions-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-cv86ynb6dk] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-cv86ynb6dk],
.calculation-heading[b-cv86ynb6dk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-cv86ynb6dk],
.calculation-heading small[b-cv86ynb6dk] {
    color: #987634;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-cv86ynb6dk],
.calculation-heading h3[b-cv86ynb6dk] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-cv86ynb6dk],
.calculation-heading > span[b-cv86ynb6dk] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .84rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-cv86ynb6dk] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-cv86ynb6dk] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.source-summary-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-cv86ynb6dk] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-cv86ynb6dk] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-cv86ynb6dk] {
    display:block;
    color:#84928d;
    font-size:.84rem;
}

.system-amount-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.reconciliation-calculation-preview[b-cv86ynb6dk] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-cv86ynb6dk] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-cv86ynb6dk] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-cv86ynb6dk] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-cv86ynb6dk] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-cv86ynb6dk] {
    display:block;
    color:#8b7b74;
    font-size:.84rem;
}

.calculation-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.84rem;
}

.calculation-grid .short span[b-cv86ynb6dk],
.calculation-grid .short strong[b-cv86ynb6dk],
.calculation-grid .short small[b-cv86ynb6dk] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-cv86ynb6dk] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-cv86ynb6dk] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-cv86ynb6dk] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.photo-upload-heading small[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
}

.photo-preview[b-cv86ynb6dk] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-cv86ynb6dk] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-cv86ynb6dk] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-cv86ynb6dk] {
    color:#40544b;
    font-size:.84rem;
}

.photo-empty small[b-cv86ynb6dk] {
    font-size:.84rem;
}

.photo-upload-actions[b-cv86ynb6dk] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-cv86ynb6dk],
.remove-photo-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-cv86ynb6dk] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-cv86ynb6dk] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-cv86ynb6dk] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-cv86ynb6dk],
.detail-transaction-table[b-cv86ynb6dk] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-cv86ynb6dk],
.source-transaction-row[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-cv86ynb6dk] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-cv86ynb6dk],
.source-transaction-row > span[b-cv86ynb6dk] {
    padding:7px;
    font-size:.84rem;
}

.source-transaction-row[b-cv86ynb6dk] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-cv86ynb6dk] {
    border-bottom:0;
}

.mini-photo-button[b-cv86ynb6dk] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-cv86ynb6dk],
.source-transaction-more[b-cv86ynb6dk] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.84rem;
    text-align:center;
}

.mock-rule-warning[b-cv86ynb6dk] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.84rem !important;
}

/* VIEW & PRINT */

.water-view-modal[b-cv86ynb6dk] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.water-page[b-cv86ynb6dk]  .view-edit-button,
.water-page[b-cv86ynb6dk]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    text-transform:none !important;
}

.water-page[b-cv86ynb6dk]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-water-profile[b-cv86ynb6dk] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-cv86ynb6dk] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-cv86ynb6dk] {
    text-align:center;
}

.document-organization small[b-cv86ynb6dk] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-cv86ynb6dk] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-cv86ynb6dk] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.84rem;
}

.document-number-box[b-cv86ynb6dk] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-cv86ynb6dk],
.document-number-box small[b-cv86ynb6dk] {
    display:block;
    color:#778980;
    font-size:.84rem;
}

.document-number-box strong[b-cv86ynb6dk] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
    word-break:break-word;
}

.document-status-strip[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-cv86ynb6dk] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-cv86ynb6dk] {
    display:block;
    color:#83918b;
    font-size:.84rem;
}

.document-status-strip > div strong[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.84rem;
}

.scope-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
}

.scope-reference-box[b-cv86ynb6dk] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.scope-reference-box strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.84rem;
}

.scope-reference-box small[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-cv86ynb6dk],
.transaction-summary-section[b-cv86ynb6dk],
.source-transaction-section[b-cv86ynb6dk],
.review-section[b-cv86ynb6dk] {
    margin-top:16px;
}

.section-title[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-cv86ynb6dk] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.84rem;
    font-weight:800;
}

.section-title small[b-cv86ynb6dk] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-cv86ynb6dk] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-cv86ynb6dk] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-cv86ynb6dk],
.comparison-row[b-cv86ynb6dk],
.comparison-total[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-cv86ynb6dk] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-cv86ynb6dk],
.comparison-row span[b-cv86ynb6dk],
.comparison-total span[b-cv86ynb6dk] {
    padding:8px 9px;
    font-size:.84rem;
}

.comparison-row[b-cv86ynb6dk] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-cv86ynb6dk],
.comparison-total span:not(:first-child)[b-cv86ynb6dk] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-cv86ynb6dk] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-cv86ynb6dk] { color:#34734b; }
.difference-text.over[b-cv86ynb6dk] { color:#987634; }
.difference-text.short[b-cv86ynb6dk] { color:#b54d43; }

.transaction-summary-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-cv86ynb6dk] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-cv86ynb6dk] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-cv86ynb6dk] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-cv86ynb6dk] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-cv86ynb6dk] { background:#f4fafc; }

.transaction-summary-grid span[b-cv86ynb6dk] {
    display:block;
    color:#84928c;
    font-size:.84rem;
}

.transaction-summary-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-cv86ynb6dk] {
    display:block;
    color:#798a83;
    font-size:.84rem;
}

.detail-transaction-header[b-cv86ynb6dk],
.detail-transaction-row[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-cv86ynb6dk] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-cv86ynb6dk],
.detail-transaction-row span[b-cv86ynb6dk] {
    padding:8px 7px;
    font-size:.84rem;
}

.detail-transaction-row[b-cv86ynb6dk] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-cv86ynb6dk] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.review-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
}

.review-note-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-cv86ynb6dk] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
}

.review-note-grid p[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.document-footer[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
}

.document-footer p[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.84rem;
    line-height:1.6;
}

.qr-placeholder[b-cv86ynb6dk] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-cv86ynb6dk] {
    font-size:.84rem;
    font-weight:700;
}

.mock-document-label[b-cv86ynb6dk] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.84rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-cv86ynb6dk],
.attachment-panel[b-cv86ynb6dk] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-cv86ynb6dk] {
    color:#987634;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-cv86ynb6dk] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:700;
}

.history-list[b-cv86ynb6dk] {
    display:grid;
    gap:7px;
}

.history-item[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-cv86ynb6dk] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-cv86ynb6dk] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-cv86ynb6dk] {
    color:#3c5047;
    font-size:.84rem;
}

.history-item small[b-cv86ynb6dk],
.history-item em[b-cv86ynb6dk] {
    color:#84928d;
    font-size:.84rem;
    font-style:normal;
}

.history-item p[b-cv86ynb6dk] {
    margin:4px 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.55;
}

.attachment-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-cv86ynb6dk] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-cv86ynb6dk] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-cv86ynb6dk] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-cv86ynb6dk] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-cv86ynb6dk] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-cv86ynb6dk] { background:rgba(52,115,75,.89); }

.attachment-empty[b-cv86ynb6dk] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-cv86ynb6dk] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-cv86ynb6dk] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-cv86ynb6dk] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-cv86ynb6dk] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-cv86ynb6dk] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-cv86ynb6dk] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-cv86ynb6dk] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.7;
}

.delete-modal p strong[b-cv86ynb6dk] {
    color:#b54d43;
}

.delete-warning[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.84rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-cv86ynb6dk] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.water-page[b-cv86ynb6dk]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .water-hero[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-cv86ynb6dk] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-cv86ynb6dk] {
        grid-column:1 / -1;
    }

    .document-header[b-cv86ynb6dk] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-cv86ynb6dk] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .water-page[b-cv86ynb6dk] {
        padding-top:10px;
    }

    .water-page[b-cv86ynb6dk]  .water-container {
        padding-inline:10px !important;
    }

    .water-hero[b-cv86ynb6dk] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-cv86ynb6dk],
    .list-toolbar[b-cv86ynb6dk],
    .source-summary-heading[b-cv86ynb6dk],
    .calculation-heading[b-cv86ynb6dk],
    .view-toolbar[b-cv86ynb6dk],
    .section-heading[b-cv86ynb6dk] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-cv86ynb6dk],
    .variance-grid[b-cv86ynb6dk],
    .progress-metrics[b-cv86ynb6dk],
    .source-summary-grid[b-cv86ynb6dk],
    .system-amount-grid[b-cv86ynb6dk],
    .calculation-grid[b-cv86ynb6dk],
    .photo-upload-grid[b-cv86ynb6dk],
    .transaction-summary-grid[b-cv86ynb6dk],
    .review-grid[b-cv86ynb6dk],
    .review-note-grid[b-cv86ynb6dk],
    .attachment-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-cv86ynb6dk] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-cv86ynb6dk] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-cv86ynb6dk] {
        width:100%;
    }

    .print-water-profile[b-cv86ynb6dk] {
        padding:22px 18px;
    }

    .document-footer[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-cv86ynb6dk] {
        grid-column:auto;
    }

    .status-overview[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-cv86ynb6dk] {
        width:100%;
    }

    .document-header[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-cv86ynb6dk] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-cv86ynb6dk] {
        visibility:hidden !important;
    }

    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-cv86ynb6dk] {
        display:none !important;
    }

    .modal-backdrop[b-cv86ynb6dk],
    .water-view-modal[b-cv86ynb6dk],
    .view-scroll[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .scope-panel[b-cv86ynb6dk],
    .amount-comparison-section[b-cv86ynb6dk],
    .transaction-summary-section[b-cv86ynb6dk],
    .source-transaction-section[b-cv86ynb6dk],
    .review-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }

    .mock-document-label[b-cv86ynb6dk] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-cv86ynb6dk] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.water-page[b-cv86ynb6dk]  .hero-add-button,
.water-page[b-cv86ynb6dk]  .toolbar-add-button,
.water-page[b-cv86ynb6dk]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.84rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-cv86ynb6dk] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.confirmed > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.checked-in > span[b-cv86ynb6dk] { background:#73569b; }
.status-overview-card.in-service > span[b-cv86ynb6dk] { background:#c46a2b; }
.status-overview-card.completed > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.cancelled > span[b-cv86ynb6dk] { background:#b54d43; }

.service-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-cv86ynb6dk],
.service-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-cv86ynb6dk] {
    background:#f4faf7;
}

.service-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.service-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-cv86ynb6dk] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-cv86ynb6dk] {
    display:block;
    color:#3c5047;
    font-size:.84rem;
}

.focus-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.84rem;
}

/* TABLE */

.citizen-photo-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-cv86ynb6dk] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.84rem;
}

.citizen-photo-cell small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.84rem;
}

.appointment-time-cell[b-cv86ynb6dk],
.service-unit-cell[b-cv86ynb6dk],
.provider-location-cell[b-cv86ynb6dk],
.queue-priority-cell[b-cv86ynb6dk],
.reason-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-cv86ynb6dk],
.reason-cell[b-cv86ynb6dk] {
    min-width:180px;
}

.appointment-time-cell strong[b-cv86ynb6dk],
.service-unit-cell strong[b-cv86ynb6dk],
.provider-location-cell strong[b-cv86ynb6dk],
.queue-priority-cell strong[b-cv86ynb6dk],
.reason-cell strong[b-cv86ynb6dk] {
    color:#3c5047;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell small[b-cv86ynb6dk],
.service-unit-cell small[b-cv86ynb6dk],
.provider-location-cell small[b-cv86ynb6dk],
.queue-priority-cell small[b-cv86ynb6dk],
.reason-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:3px;
    color:#84928d;
    font-size:.84rem;
    line-height:1.5;
}

.appointment-time-cell em[b-cv86ynb6dk],
.provider-location-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-cv86ynb6dk],
.priority-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-cv86ynb6dk] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-cv86ynb6dk] { color:#987634; background:#fff4df; }

.priority-chip[b-cv86ynb6dk] {
    margin-top:5px;
}

.priority-chip.normal[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-cv86ynb6dk] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-cv86ynb6dk] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-cv86ynb6dk] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.84rem;
}

.identity-chip[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:700;
}

.identity-chip.verified[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-cv86ynb6dk],
.identity-chip.not-found[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-cv86ynb6dk] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.citizen-source-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.citizen-address[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.84rem;
}

.citizen-source-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-cv86ynb6dk],
.citizen-source-actions a[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-cv86ynb6dk] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-cv86ynb6dk] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-cv86ynb6dk] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.preview-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.84rem;
}

.consent-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-cv86ynb6dk] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-cv86ynb6dk] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-cv86ynb6dk] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-cv86ynb6dk] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-cv86ynb6dk] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
}

.source-photo-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-cv86ynb6dk] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-cv86ynb6dk] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.84rem;
    line-height:1.5;
}

.identity-box[b-cv86ynb6dk] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-cv86ynb6dk],
.identity-box small[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.identity-box strong[b-cv86ynb6dk] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.84rem;
}

.service-section[b-cv86ynb6dk],
.reason-section[b-cv86ynb6dk],
.reminder-section[b-cv86ynb6dk] {
    margin-top:16px;
}

.reference-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-cv86ynb6dk] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-cv86ynb6dk],
.timeline-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.reference-grid strong[b-cv86ynb6dk],
.timeline-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.84rem;
    word-break:break-word;
}

.note-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-cv86ynb6dk] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-cv86ynb6dk] {
    display:block;
    color:#87958f;
    font-size:.84rem;
}

.note-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.note-grid p[b-cv86ynb6dk] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.84rem;
    line-height:1.6;
}

.timeline-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-cv86ynb6dk] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.84rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-cv86ynb6dk] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-cv86ynb6dk] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-cv86ynb6dk],
    .preview-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-cv86ynb6dk] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-cv86ynb6dk] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-cv86ynb6dk] {
        grid-column:1 / -1;
    }

    .reference-grid[b-cv86ynb6dk],
    .timeline-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-cv86ynb6dk],
    .focus-grid[b-cv86ynb6dk],
    .citizen-source-grid[b-cv86ynb6dk],
    .preview-grid[b-cv86ynb6dk],
    .consent-grid[b-cv86ynb6dk],
    .source-photo-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .note-grid[b-cv86ynb6dk],
    .timeline-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-cv86ynb6dk] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-cv86ynb6dk] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-cv86ynb6dk] {
        margin:0 auto;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .service-section[b-cv86ynb6dk],
    .reason-section[b-cv86ynb6dk],
    .reminder-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size: 16px;
    line-height: 1.55;
}

.water-page[b-cv86ynb6dk]  .mud-typography,
.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-input-label,
.water-page[b-cv86ynb6dk]  .mud-select,
.water-page[b-cv86ynb6dk]  .mud-list-item-text,
.water-page[b-cv86ynb6dk]  .mud-button-label,
.water-page[b-cv86ynb6dk]  .mud-table-cell,
.water-page[b-cv86ynb6dk]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size: .92rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size: .90rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .84rem !important;
    line-height: 1.55 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .84rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-cv86ynb6dk] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-cv86ynb6dk] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-cv86ynb6dk] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-cv86ynb6dk] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-cv86ynb6dk] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-cv86ynb6dk] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-cv86ynb6dk] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-cv86ynb6dk] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-cv86ynb6dk],
.water-list-panel[b-cv86ynb6dk],
.insight-panel[b-cv86ynb6dk] {
    border-radius: 20px;
}

.filter-panel[b-cv86ynb6dk] {
    padding: 20px;
}

.list-toolbar[b-cv86ynb6dk] {
    padding: 19px 20px;
}

.filter-heading p[b-cv86ynb6dk],
.list-toolbar p[b-cv86ynb6dk] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-cv86ynb6dk] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-cv86ynb6dk] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-cv86ynb6dk],
.service-unit-cell[b-cv86ynb6dk],
.provider-location-cell[b-cv86ynb6dk],
.queue-priority-cell[b-cv86ynb6dk],
.reason-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    min-width: 155px;
}

.provider-location-cell[b-cv86ynb6dk],
.reason-cell[b-cv86ynb6dk] {
    min-width: 215px;
}

.service-chip[b-cv86ynb6dk],
.priority-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.identity-chip[b-cv86ynb6dk] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-cv86ynb6dk] {
    min-width: 205px;
    gap: 7px;
}

.water-page[b-cv86ynb6dk]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-cv86ynb6dk] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-cv86ynb6dk],
.view-toolbar[b-cv86ynb6dk],
.image-preview-header[b-cv86ynb6dk] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-cv86ynb6dk],
.view-scroll[b-cv86ynb6dk] {
    padding: 20px;
}

.modal-footer[b-cv86ynb6dk] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-cv86ynb6dk] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-cv86ynb6dk] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-cv86ynb6dk],
.preview-grid > div[b-cv86ynb6dk],
.reference-grid > div[b-cv86ynb6dk],
.timeline-grid > div[b-cv86ynb6dk] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-cv86ynb6dk] {
    padding: 13px;
}

.photo-preview[b-cv86ynb6dk] {
    min-height: 200px;
}

.photo-preview img[b-cv86ynb6dk] {
    height: 200px;
}

.history-item[b-cv86ynb6dk] {
    padding: 12px;
}

.attachment-card[b-cv86ynb6dk],
.attachment-card img[b-cv86ynb6dk] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .water-page[b-cv86ynb6dk] {
        font-size: 15px;
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .84rem !important;
    }

    .summary-card[b-cv86ynb6dk] {
        min-height: 122px;
    }

    .status-overview-card[b-cv86ynb6dk],
    .service-overview-card[b-cv86ynb6dk] {
        min-height: 82px;
    }

    .modal-body[b-cv86ynb6dk],
    .view-scroll[b-cv86ynb6dk] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #water-profile-print-area[b-cv86ynb6dk] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #water-profile-print-area h1[b-cv86ynb6dk] {
        font-size: 18pt !important;
    }

    #water-profile-print-area h2[b-cv86ynb6dk] {
        font-size: 14pt !important;
    }

    #water-profile-print-area h3[b-cv86ynb6dk] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-cv86ynb6dk] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.follow-up > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.referred > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.cancelled > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.month > span[b-cv86ynb6dk] { background:#73569b; }

.service-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-cv86ynb6dk] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-cv86ynb6dk] {
    display:block;
    color:#7c8d86;
    font-size:.84rem;
}

.care-metrics strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-cv86ynb6dk],
.service-unit-cell[b-cv86ynb6dk],
.provider-location-cell[b-cv86ynb6dk],
.result-cell[b-cv86ynb6dk],
.follow-score-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-cv86ynb6dk],
.result-cell[b-cv86ynb6dk] {
    min-width:230px;
}

.history-date-cell strong[b-cv86ynb6dk],
.service-unit-cell strong[b-cv86ynb6dk],
.provider-location-cell strong[b-cv86ynb6dk],
.result-cell strong[b-cv86ynb6dk],
.follow-score-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-cv86ynb6dk],
.service-unit-cell small[b-cv86ynb6dk],
.provider-location-cell small[b-cv86ynb6dk],
.result-cell small[b-cv86ynb6dk],
.follow-score-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.history-date-cell em[b-cv86ynb6dk],
.provider-location-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.referred[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-cv86ynb6dk] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-cv86ynb6dk] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-cv86ynb6dk] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-cv86ynb6dk] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.source-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-cv86ynb6dk],
.source-actions button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-cv86ynb6dk] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-cv86ynb6dk] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-cv86ynb6dk] {
    min-height:180px;
}

.source-photo-card img[b-cv86ynb6dk] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-cv86ynb6dk] {
    margin-top:18px;
}

.vital-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-cv86ynb6dk],
.quality-grid > div[b-cv86ynb6dk],
.follow-up-grid > div[b-cv86ynb6dk] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-cv86ynb6dk],
.quality-grid span[b-cv86ynb6dk],
.follow-up-grid span[b-cv86ynb6dk] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-cv86ynb6dk],
.quality-grid strong[b-cv86ynb6dk],
.follow-up-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.84rem;
}

.vital-summary[b-cv86ynb6dk] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.84rem;
    line-height:1.65;
}

.follow-up-grid[b-cv86ynb6dk],
.quality-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.84rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:.94rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:.92rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-cv86ynb6dk] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-cv86ynb6dk] { background:rgba(104,120,114,.89); }

.view-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-cv86ynb6dk],
    .service-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-cv86ynb6dk],
    .vital-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-cv86ynb6dk] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-cv86ynb6dk],
    .quality-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-cv86ynb6dk],
    .service-overview[b-cv86ynb6dk],
    .care-metrics[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .source-photo-grid[b-cv86ynb6dk],
    .vital-grid[b-cv86ynb6dk],
    .follow-up-grid[b-cv86ynb6dk],
    .quality-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.follow-up > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.referred > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.overdue > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.inactive > span[b-cv86ynb6dk] { background:#687872; }

.risk-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-cv86ynb6dk],
.risk-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.risk-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-cv86ynb6dk] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-cv86ynb6dk],
.care-metrics strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-cv86ynb6dk],
.care-metrics small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.care-metrics[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-cv86ynb6dk] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-cv86ynb6dk],
.risk-adl-cell[b-cv86ynb6dk],
.dependency-living-cell[b-cv86ynb6dk],
.caregiver-cell[b-cv86ynb6dk],
.follow-up-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-cv86ynb6dk] {
    min-width:190px;
}

.register-age-cell strong[b-cv86ynb6dk],
.risk-adl-cell strong[b-cv86ynb6dk],
.dependency-living-cell strong[b-cv86ynb6dk],
.caregiver-cell strong[b-cv86ynb6dk],
.follow-up-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-cv86ynb6dk],
.risk-adl-cell small[b-cv86ynb6dk],
.dependency-living-cell small[b-cv86ynb6dk],
.caregiver-cell small[b-cv86ynb6dk],
.follow-up-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:5px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.55;
}

.register-age-cell em[b-cv86ynb6dk],
.caregiver-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-cv86ynb6dk],
.dependency-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.identity-chip[b-cv86ynb6dk],
.overdue-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.risk-chip.low[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.risk-chip.high[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.active[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.referred[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.overdue-chip[b-cv86ynb6dk] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-cv86ynb6dk] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-cv86ynb6dk] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-cv86ynb6dk] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.84rem;
}

.source-data-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-cv86ynb6dk] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.84rem;
    line-height:1.6;
}

.source-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-cv86ynb6dk],
.source-actions button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-cv86ynb6dk] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-cv86ynb6dk] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.assessment-preview strong[b-cv86ynb6dk] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-cv86ynb6dk],
.reference-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-cv86ynb6dk],
.reference-grid > div[b-cv86ynb6dk],
.care-plan-grid > div[b-cv86ynb6dk] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-cv86ynb6dk],
.reference-grid span[b-cv86ynb6dk],
.care-plan-grid span[b-cv86ynb6dk] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.assessment-grid strong[b-cv86ynb6dk],
.reference-grid strong[b-cv86ynb6dk],
.care-plan-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-cv86ynb6dk] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.84rem !important;
    line-height:1.58 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:.96rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:.94rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-cv86ynb6dk] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-cv86ynb6dk] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-cv86ynb6dk] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-cv86ynb6dk] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-cv86ynb6dk],
    .assessment-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-cv86ynb6dk],
    .risk-overview[b-cv86ynb6dk],
    .dependency-grid[b-cv86ynb6dk],
    .care-metrics[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .assessment-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .care-plan-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.84rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:16.5px;
    line-height:1.62;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-cv86ynb6dk] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-cv86ynb6dk] { background:#73569b; }
.status-overview-card.field > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.completed > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.follow-up > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.referred > span[b-cv86ynb6dk] { background:#b55b82; }

.visit-type-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-cv86ynb6dk],
.visit-type-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-cv86ynb6dk] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.visit-type-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-cv86ynb6dk] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-cv86ynb6dk],
.care-metrics strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-cv86ynb6dk],
.care-metrics small[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE */

.visit-date-cell[b-cv86ynb6dk],
.visit-type-cell[b-cv86ynb6dk],
.team-location-cell[b-cv86ynb6dk],
.result-cell[b-cv86ynb6dk],
.follow-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-cv86ynb6dk],
.result-cell[b-cv86ynb6dk] {
    min-width:230px;
}

.visit-date-cell strong[b-cv86ynb6dk],
.visit-type-cell strong[b-cv86ynb6dk],
.team-location-cell strong[b-cv86ynb6dk],
.result-cell strong[b-cv86ynb6dk],
.follow-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-cv86ynb6dk],
.visit-type-cell small[b-cv86ynb6dk],
.team-location-cell small[b-cv86ynb6dk],
.result-cell small[b-cv86ynb6dk],
.follow-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.58;
}

.visit-date-cell em[b-cv86ynb6dk],
.team-location-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.identity-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.referred[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.priority-text[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-cv86ynb6dk] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-cv86ynb6dk] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-cv86ynb6dk] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-cv86ynb6dk] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-muted);
    font-size:.84rem;
}

.source-data-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-cv86ynb6dk] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-cv86ynb6dk] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-cv86ynb6dk],
.reference-grid > div[b-cv86ynb6dk] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-cv86ynb6dk],
.reference-grid span[b-cv86ynb6dk] {
    display:block;
    color:#7e8f87;
    font-size:.84rem;
}

.vital-grid strong[b-cv86ynb6dk],
.reference-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:.98rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-cv86ynb6dk],
    .visit-type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-cv86ynb6dk],
    .visit-type-overview[b-cv86ynb6dk],
    .target-grid[b-cv86ynb6dk],
    .care-metrics[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .vital-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.65;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-cv86ynb6dk] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.review > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.eligible > span[b-cv86ynb6dk] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.paid > span[b-cv86ynb6dk] { background:#73569b; }

.type-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-cv86ynb6dk],
.type-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-cv86ynb6dk] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-cv86ynb6dk],
.target-grid button[b-cv86ynb6dk] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

/* TABLE */

.application-no-cell[b-cv86ynb6dk],
.welfare-type-cell[b-cv86ynb6dk],
.household-cell[b-cv86ynb6dk],
.amount-cell[b-cv86ynb6dk],
.officer-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-cv86ynb6dk],
.officer-cell[b-cv86ynb6dk] {
    min-width:210px;
}

.application-no-cell strong[b-cv86ynb6dk],
.welfare-type-cell strong[b-cv86ynb6dk],
.household-cell strong[b-cv86ynb6dk],
.amount-cell strong[b-cv86ynb6dk],
.officer-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-cv86ynb6dk],
.welfare-type-cell small[b-cv86ynb6dk],
.household-cell small[b-cv86ynb6dk],
.amount-cell small[b-cv86ynb6dk],
.officer-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.application-no-cell em[b-cv86ynb6dk],
.household-cell em[b-cv86ynb6dk],
.amount-cell em[b-cv86ynb6dk],
.officer-cell em[b-cv86ynb6dk],
.citizen-photo-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.source-group-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.source-group-chip[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-cv86ynb6dk] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-cv86ynb6dk],
.amount-preview[b-cv86ynb6dk] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-cv86ynb6dk] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-cv86ynb6dk] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-cv86ynb6dk],
.amount-preview > div[b-cv86ynb6dk] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-cv86ynb6dk],
.amount-preview small[b-cv86ynb6dk] {
    display:block;
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.amount-preview small[b-cv86ynb6dk] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-cv86ynb6dk],
.amount-preview strong[b-cv86ynb6dk] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-cv86ynb6dk],
.amount-preview span[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-document-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-cv86ynb6dk] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-cv86ynb6dk],
.amount-document-grid small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.amount-document-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-cv86ynb6dk] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-cv86ynb6dk] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-cv86ynb6dk] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-cv86ynb6dk] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-cv86ynb6dk],
    .type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .type-overview[b-cv86ynb6dk],
    .budget-grid[b-cv86ynb6dk],
    .target-grid[b-cv86ynb6dk],
    .care-metrics[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .assessment-preview[b-cv86ynb6dk],
    .amount-preview[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.66;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-cv86ynb6dk] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-cv86ynb6dk] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.payment > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.suspended > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.expiring > span[b-cv86ynb6dk] { background:#73569b; }

.target-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-cv86ynb6dk],
.target-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-cv86ynb6dk] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-cv86ynb6dk],
.follow-grid button[b-cv86ynb6dk] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.84rem;
}

.follow-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-cv86ynb6dk] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.registry-cell[b-cv86ynb6dk],
.benefit-cell[b-cv86ynb6dk],
.period-cell[b-cv86ynb6dk],
.amount-cell[b-cv86ynb6dk],
.payment-cycle-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-cv86ynb6dk] {
    min-width:225px;
}

.registry-cell strong[b-cv86ynb6dk],
.benefit-cell strong[b-cv86ynb6dk],
.period-cell strong[b-cv86ynb6dk],
.amount-cell strong[b-cv86ynb6dk],
.payment-cycle-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-cv86ynb6dk],
.benefit-cell small[b-cv86ynb6dk],
.period-cell small[b-cv86ynb6dk],
.amount-cell small[b-cv86ynb6dk],
.payment-cycle-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.registry-cell em[b-cv86ynb6dk],
.period-cell em[b-cv86ynb6dk],
.amount-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-cv86ynb6dk],
.cycle-chip[b-cv86ynb6dk],
.verify-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.source-group-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.benefit-chip.allowance[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-cv86ynb6dk] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.expired[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.source-group-chip[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-cv86ynb6dk] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-cv86ynb6dk] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.amount-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-cv86ynb6dk] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-cv86ynb6dk] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* LARGE MUD TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-cv86ynb6dk] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-cv86ynb6dk] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-cv86ynb6dk],
    .target-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .target-overview[b-cv86ynb6dk],
    .amount-metrics[b-cv86ynb6dk],
    .follow-grid[b-cv86ynb6dk],
    .condition-switch-grid[b-cv86ynb6dk],
    .amount-preview[b-cv86ynb6dk],
    .source-data-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .patient-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.66;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-cv86ynb6dk] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-cv86ynb6dk] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-cv86ynb6dk] { background:#687872; }
.status-overview-card.approval > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.processing > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.paid > span[b-cv86ynb6dk] { background:#34734b; }
.status-overview-card.failed > span[b-cv86ynb6dk] { background:#b54d43; }

.disbursement-progress[b-cv86ynb6dk] {
    margin-top:15px;
}

.disbursement-progress > div[b-cv86ynb6dk] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-cv86ynb6dk] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-cv86ynb6dk],
.amount-cell[b-cv86ynb6dk],
.progress-cell[b-cv86ynb6dk],
.date-cell[b-cv86ynb6dk],
.control-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-cv86ynb6dk] {
    min-width:245px;
}

.batch-cell strong[b-cv86ynb6dk],
.amount-cell strong[b-cv86ynb6dk],
.progress-cell strong[b-cv86ynb6dk],
.date-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-cv86ynb6dk],
.amount-cell small[b-cv86ynb6dk],
.progress-cell small[b-cv86ynb6dk],
.date-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:6px;
    color:#72847b;
    font-size:.84rem;
    line-height:1.62;
}

.batch-cell em[b-cv86ynb6dk],
.amount-cell em[b-cv86ynb6dk],
.date-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-cv86ynb6dk] {
    min-width:180px;
}

.recipient-stack[b-cv86ynb6dk] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-cv86ynb6dk],
.recipient-stack span[b-cv86ynb6dk] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-cv86ynb6dk] {
    margin-left:0;
}

.recipient-stack img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.recipient-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.table-progress[b-cv86ynb6dk] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-cv86ynb6dk] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-cv86ynb6dk],
.approval-chip[b-cv86ynb6dk],
.reconcile-chip[b-cv86ynb6dk],
.cycle-chip[b-cv86ynb6dk],
.line-status-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.status-chip.draft[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.approved[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.control-cell[b-cv86ynb6dk] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-cv86ynb6dk] {
    align-items:center;
}

.selection-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-cv86ynb6dk] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-cv86ynb6dk] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-cv86ynb6dk] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-cv86ynb6dk] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.source-selection-summary strong[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-cv86ynb6dk] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-cv86ynb6dk] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-cv86ynb6dk],
.source-selection-table td[b-cv86ynb6dk] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-cv86ynb6dk] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-cv86ynb6dk] {
    background:#f0faf6;
}

.source-person-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-cv86ynb6dk] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-cv86ynb6dk],
.source-benefit-cell strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-cv86ynb6dk],
.source-benefit-cell small[b-cv86ynb6dk],
.source-date[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.84rem;
}

.source-person-cell em[b-cv86ynb6dk] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.source-benefit-cell[b-cv86ynb6dk] {
    min-width:190px;
}

.source-amount[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:750;
}

.bank-readiness span.ready[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-document-buttons[b-cv86ynb6dk] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-cv86ynb6dk] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-cv86ynb6dk] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
}

.amount-preview strong[b-cv86ynb6dk] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.84rem;
}

/* DETAIL */

.batch-overview-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-cv86ynb6dk] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-cv86ynb6dk] {
    font-size:3.5rem;
}

.batch-overview-content small[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-cv86ynb6dk] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.print-line-table-wrap[b-cv86ynb6dk] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-cv86ynb6dk] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-cv86ynb6dk],
.print-line-table td[b-cv86ynb6dk] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.84rem;
    vertical-align:top;
}

.print-line-table th[b-cv86ynb6dk] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-cv86ynb6dk],
.print-line-table td small[b-cv86ynb6dk] {
    display:block;
}

.print-line-table td small[b-cv86ynb6dk] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-cv86ynb6dk] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-cv86ynb6dk] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-cv86ynb6dk] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-cv86ynb6dk] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-cv86ynb6dk] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-cv86ynb6dk] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.84rem;
}

.recipient-detail-grid strong[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-cv86ynb6dk] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-cv86ynb6dk] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-cv86ynb6dk] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-cv86ynb6dk] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-cv86ynb6dk] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-cv86ynb6dk],
    .recipient-detail-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-cv86ynb6dk] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-cv86ynb6dk] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .amount-metrics[b-cv86ynb6dk],
    .follow-grid[b-cv86ynb6dk],
    .source-selection-summary[b-cv86ynb6dk],
    .amount-preview[b-cv86ynb6dk],
    .recipient-detail-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-cv86ynb6dk] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-cv86ynb6dk] {
        overflow-x:auto;
    }

    .source-selection-table[b-cv86ynb6dk] {
        min-width:1050px;
    }

    .batch-overview-panel[b-cv86ynb6dk],
    .recipient-detail-card[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-cv86ynb6dk] {
        width:100%;
        height:190px;
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .batch-overview-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.66;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-cv86ynb6dk] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-cv86ynb6dk],
.type-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-cv86ynb6dk] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.full > span[b-cv86ynb6dk] { background:#c56b2a; }
.status-overview-card.overflow > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.maintenance > span[b-cv86ynb6dk] { background:#73569b; }

.type-overview[b-cv86ynb6dk] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-cv86ynb6dk],
.type-overview-card.selected[b-cv86ynb6dk] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-cv86ynb6dk] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-cv86ynb6dk] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-cv86ynb6dk] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-cv86ynb6dk] {
    margin-top:15px;
}

.fill-progress > div[b-cv86ynb6dk] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-cv86ynb6dk] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-cv86ynb6dk] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-cv86ynb6dk] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-cv86ynb6dk] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-cv86ynb6dk] {
    background:#987634;
}

.map-pin.full[b-cv86ynb6dk] {
    background:#c56b2a;
}

.map-pin.overflow[b-cv86ynb6dk] {
    background:#b54d43;
}

.map-pin.maintenance[b-cv86ynb6dk] {
    background:#73569b;
}

.map-pin.inactive[b-cv86ynb6dk] {
    background:#687872;
}

.map-pin span[b-cv86ynb6dk] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-cv86ynb6dk] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-cv86ynb6dk] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-cv86ynb6dk] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-cv86ynb6dk] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-cv86ynb6dk] { background:#987634; }
.map-board-legend i.full[b-cv86ynb6dk] { background:#b54d43; }
.map-board-legend i.maintenance[b-cv86ynb6dk] { background:#73569b; }

.map-board-caption[b-cv86ynb6dk] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-cv86ynb6dk],
.map-board-caption small[b-cv86ynb6dk] {
    display:block;
}

.map-board-caption strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-cv86ynb6dk] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.point-photo-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-cv86ynb6dk] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.point-photo-cell em[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-cv86ynb6dk],
.bin-cell[b-cv86ynb6dk],
.fill-cell[b-cv86ynb6dk],
.collection-cell[b-cv86ynb6dk],
.sensor-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-cv86ynb6dk] {
    min-width:220px;
}

.location-cell strong[b-cv86ynb6dk],
.bin-cell strong[b-cv86ynb6dk],
.fill-cell strong[b-cv86ynb6dk],
.collection-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-cv86ynb6dk],
.bin-cell small[b-cv86ynb6dk],
.fill-cell small[b-cv86ynb6dk],
.collection-cell small[b-cv86ynb6dk],
.sensor-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.location-cell em[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.waste-type-chip[b-cv86ynb6dk],
.collection-chip[b-cv86ynb6dk],
.sensor-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.waste-type-chip.general[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.status-chip.active[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.full[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.table-progress[b-cv86ynb6dk] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-cv86ynb6dk] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-cv86ynb6dk] { background:var(--theme-primary); }
.table-progress.medium span[b-cv86ynb6dk] { background:#2f789f; }
.table-progress.high span[b-cv86ynb6dk] { background:#987634; }
.table-progress.critical span[b-cv86ynb6dk] { background:#b54d43; }

.repair-alert[b-cv86ynb6dk],
.clean-alert[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.84rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-cv86ynb6dk] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-cv86ynb6dk] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-cv86ynb6dk] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-cv86ynb6dk] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-cv86ynb6dk] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-cv86ynb6dk] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-cv86ynb6dk] { background:#2f789f; }
.fill-preview-bin.high span[b-cv86ynb6dk] { background:#987634; }
.fill-preview-bin.critical span[b-cv86ynb6dk] { background:#b54d43; }

.fill-preview-bin strong[b-cv86ynb6dk] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-cv86ynb6dk] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.84rem;
    line-height:1.55;
}

.source-photo-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-cv86ynb6dk] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-cv86ynb6dk] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-cv86ynb6dk] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.large-fill-indicator[b-cv86ynb6dk] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-cv86ynb6dk] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-cv86ynb6dk] { background:#2f789f; }
.large-fill-indicator.high > span[b-cv86ynb6dk] { background:#987634; }
.large-fill-indicator.critical > span[b-cv86ynb6dk] { background:#b54d43; }

.large-fill-indicator strong[b-cv86ynb6dk],
.large-fill-indicator small[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-cv86ynb6dk] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-cv86ynb6dk] {
    font-size:.84rem;
}

.detail-map-preview[b-cv86ynb6dk] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-cv86ynb6dk] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-cv86ynb6dk] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-cv86ynb6dk] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-cv86ynb6dk] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-cv86ynb6dk] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.84rem;
}

.workflow-button.collect[b-cv86ynb6dk] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-cv86ynb6dk] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-cv86ynb6dk],
    .type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-cv86ynb6dk] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-cv86ynb6dk] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .type-overview[b-cv86ynb6dk],
    .amount-metrics[b-cv86ynb6dk],
    .follow-grid[b-cv86ynb6dk],
    .condition-switch-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-cv86ynb6dk],
    .fill-preview-card[b-cv86ynb6dk],
    .coordinate-preview[b-cv86ynb6dk],
    .collection-history-list article[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-cv86ynb6dk] {
        min-height:240px;
    }

    .large-fill-indicator[b-cv86ynb6dk],
    .fill-preview-bin[b-cv86ynb6dk],
    .coordinate-pin[b-cv86ynb6dk] {
        margin:0 auto;
    }

    .map-board[b-cv86ynb6dk] {
        min-height:500px;
    }

    .map-pin[b-cv86ynb6dk] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .point-cover-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.68;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-cv86ynb6dk] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.received > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.inspecting > span[b-cv86ynb6dk] { background:#2f789f; }
.status-overview-card.in-progress > span[b-cv86ynb6dk] { background:#73569b; }
.status-overview-card.resolved > span[b-cv86ynb6dk] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-cv86ynb6dk] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-cv86ynb6dk]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-cv86ynb6dk],
.pollution-type-card.selected[b-cv86ynb6dk] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.pollution-type-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-cv86ynb6dk] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-cv86ynb6dk] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-cv86ynb6dk] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-cv86ynb6dk] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-cv86ynb6dk] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-cv86ynb6dk] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-cv86ynb6dk] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-cv86ynb6dk] {
    margin-top:18px;
}

.sla-progress > div[b-cv86ynb6dk] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-cv86ynb6dk] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-cv86ynb6dk] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-cv86ynb6dk] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-cv86ynb6dk] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-cv86ynb6dk] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-cv86ynb6dk] { background:#2f789f; }
.pollution-map-pin.medium[b-cv86ynb6dk] { background:#987634; }
.pollution-map-pin.high[b-cv86ynb6dk] { background:#c56b2a; }
.pollution-map-pin.critical[b-cv86ynb6dk] { background:#b54d43; }

.pollution-map-pin span[b-cv86ynb6dk] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-cv86ynb6dk] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-cv86ynb6dk] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.84rem;
}

.map-board-legend i[b-cv86ynb6dk] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-cv86ynb6dk] { background:#2f789f; }
.map-board-legend i.medium[b-cv86ynb6dk] { background:#987634; }
.map-board-legend i.high[b-cv86ynb6dk] { background:#c56b2a; }
.map-board-legend i.critical[b-cv86ynb6dk] { background:#b54d43; }

.map-board-caption[b-cv86ynb6dk] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-cv86ynb6dk],
.map-board-caption small[b-cv86ynb6dk] {
    display:block;
}

.map-board-caption strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-cv86ynb6dk] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-cv86ynb6dk] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.complaint-photo-cell em[b-cv86ynb6dk] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.type-severity-cell[b-cv86ynb6dk],
.reporter-cell[b-cv86ynb6dk],
.location-cell[b-cv86ynb6dk],
.inspection-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-cv86ynb6dk],
.location-cell[b-cv86ynb6dk] {
    min-width:195px;
}

.reporter-cell strong[b-cv86ynb6dk],
.location-cell strong[b-cv86ynb6dk],
.inspection-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-cv86ynb6dk],
.location-cell small[b-cv86ynb6dk],
.inspection-cell small[b-cv86ynb6dk],
.status-cell small[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.reporter-cell em[b-cv86ynb6dk],
.location-cell em[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-style:normal;
}

.pollution-type-chip[b-cv86ynb6dk],
.severity-chip[b-cv86ynb6dk],
.inspection-chip[b-cv86ynb6dk],
.status-chip[b-cv86ynb6dk],
.overdue-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.pollution-type-chip.air[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.severity-chip.high[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-cv86ynb6dk] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-cv86ynb6dk] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-cv86ynb6dk] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

/* FORM */

.anonymous-switch-card[b-cv86ynb6dk] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-cv86ynb6dk],
.anonymous-switch-card small[b-cv86ynb6dk] {
    display:block;
}

.anonymous-switch-card strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-cv86ynb6dk] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.coordinate-preview[b-cv86ynb6dk] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-cv86ynb6dk],
.map-board-grid[b-cv86ynb6dk] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-cv86ynb6dk] { background:#c56b2a; }
.coordinate-pin.critical[b-cv86ynb6dk] { background:#b54d43; }
.coordinate-pin.medium[b-cv86ynb6dk] { background:#987634; }

.coordinate-pin .mud-icon-root[b-cv86ynb6dk] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-cv86ynb6dk] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.source-point-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-cv86ynb6dk] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-condition-row[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.84rem;
    font-weight:750;
}

.source-condition-row span.warning[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-cv86ynb6dk] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-cv86ynb6dk] { color:#987634; background:#fff4df; }

.measurement-preview small[b-cv86ynb6dk],
.measurement-preview strong[b-cv86ynb6dk],
.measurement-preview em[b-cv86ynb6dk] {
    display:block;
}

.measurement-preview small[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-preview strong[b-cv86ynb6dk] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-cv86ynb6dk] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

.source-photo-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
}

.source-photo-preview h3[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-cv86ynb6dk] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-cv86ynb6dk] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-cv86ynb6dk] {
    color:var(--theme-primary);
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-cv86ynb6dk] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.severity-emblem[b-cv86ynb6dk] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-cv86ynb6dk] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-cv86ynb6dk] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-cv86ynb6dk] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-cv86ynb6dk] {
    font-size:2.25rem;
}

.severity-emblem strong[b-cv86ynb6dk] {
    font-size:1.10rem;
}

.severity-emblem small[b-cv86ynb6dk] {
    font-size:.84rem;
}

.measurement-document-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-cv86ynb6dk] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-cv86ynb6dk],
.measurement-document-grid strong[b-cv86ynb6dk] {
    display:block;
}

.measurement-document-grid span[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-document-grid strong[b-cv86ynb6dk] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-cv86ynb6dk] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-cv86ynb6dk] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-cv86ynb6dk] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-cv86ynb6dk] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-cv86ynb6dk] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-cv86ynb6dk] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-cv86ynb6dk] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-cv86ynb6dk] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-cv86ynb6dk] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-cv86ynb6dk] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-cv86ynb6dk] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-cv86ynb6dk],
    .measurement-document-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-cv86ynb6dk] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-cv86ynb6dk],
    .source-photo-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-cv86ynb6dk],
    .source-photo-preview button[b-cv86ynb6dk] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .pollution-type-overview[b-cv86ynb6dk],
    .amount-metrics[b-cv86ynb6dk],
    .follow-grid[b-cv86ynb6dk],
    .measurement-preview[b-cv86ynb6dk],
    .measurement-document-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-cv86ynb6dk],
    .coordinate-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-cv86ynb6dk] {
        height:250px;
    }

    .coordinate-pin[b-cv86ynb6dk] {
        margin:0 auto;
    }

    .pollution-map-board[b-cv86ynb6dk] {
        min-height:500px;
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .complaint-cover-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.water-page[b-cv86ynb6dk] {
    font-size:17px;
    line-height:1.68;
}

.water-hero[b-cv86ynb6dk] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-cv86ynb6dk] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-cv86ynb6dk] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-cv86ynb6dk] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-cv86ynb6dk] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-cv86ynb6dk] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-cv86ynb6dk] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-cv86ynb6dk] { background:#987634; }
.status-overview-card.polluted > span[b-cv86ynb6dk] { background:#c56b2a; }
.status-overview-card.critical > span[b-cv86ynb6dk] { background:#b54d43; }
.status-overview-card.restoring > span[b-cv86ynb6dk] { background:#73569b; }

/* SOURCE TYPE CARDS */

.source-type-overview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.source-type-card[b-cv86ynb6dk] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.source-type-card[b-cv86ynb6dk]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.source-type-card:hover[b-cv86ynb6dk],
.source-type-card.selected[b-cv86ynb6dk] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.source-type-card > span[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.source-type-card > div[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
}

.source-type-card small[b-cv86ynb6dk] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.source-type-card strong[b-cv86ynb6dk] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.source-type-card.canal[b-cv86ynb6dk] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.source-type-card.pond[b-cv86ynb6dk] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.source-type-card.reservoir[b-cv86ynb6dk] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.source-type-card.river[b-cv86ynb6dk] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.source-type-card.groundwater[b-cv86ynb6dk] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.source-type-card.drainage[b-cv86ynb6dk] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.source-type-card.tap-water[b-cv86ynb6dk] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.water-metric-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.water-metric-grid article[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.water-metric-grid article > span[b-cv86ynb6dk] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.water-metric-grid article.ph > span[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.water-metric-grid article.do > span[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.water-metric-grid article.bod > span[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.water-metric-grid article.turbidity > span[b-cv86ynb6dk] { color:#987634; background:#fff4df; }

.water-metric-grid small[b-cv86ynb6dk],
.water-metric-grid strong[b-cv86ynb6dk],
.water-metric-grid em[b-cv86ynb6dk] {
    display:block;
}

.water-metric-grid small[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.86rem;
}

.water-metric-grid strong[b-cv86ynb6dk] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.water-metric-grid em[b-cv86ynb6dk] {
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
    font-style:normal;
}

/* MAP */

.water-map-board[b-cv86ynb6dk] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.water-map-pin[b-cv86ynb6dk] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.water-map-pin.good[b-cv86ynb6dk] { background:var(--theme-primary); }
.water-map-pin.watch[b-cv86ynb6dk] { background:#987634; }
.water-map-pin.polluted[b-cv86ynb6dk] { background:#c56b2a; }
.water-map-pin.critical[b-cv86ynb6dk] { background:#b54d43; }
.water-map-pin.restoring[b-cv86ynb6dk] { background:#73569b; }
.water-map-pin.closed[b-cv86ynb6dk] { background:#687872; }

.water-map-pin span[b-cv86ynb6dk] {
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-cv86ynb6dk] { background:var(--theme-primary); }
.map-board-legend i.watch[b-cv86ynb6dk] { background:#987634; }
.map-board-legend i.polluted[b-cv86ynb6dk] { background:#c56b2a; }
.map-board-legend i.critical[b-cv86ynb6dk] { background:#b54d43; }
.map-board-legend i.restoring[b-cv86ynb6dk] { background:#73569b; }

/* TABLE */

.source-photo-cell[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.source-photo-mini[b-cv86ynb6dk] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-photo-mini img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-photo-cell strong[b-cv86ynb6dk] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.source-photo-cell small[b-cv86ynb6dk],
.source-photo-cell em[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.source-photo-cell em[b-cv86ynb6dk] {
    color:#2f789f;
    font-style:normal;
}

.type-usage-cell[b-cv86ynb6dk],
.latest-reading-cell[b-cv86ynb6dk],
.inspection-cell[b-cv86ynb6dk],
.status-cell[b-cv86ynb6dk] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.source-type-chip[b-cv86ynb6dk],
.quality-status-chip[b-cv86ynb6dk],
.usage-chip[b-cv86ynb6dk],
.lab-chip[b-cv86ynb6dk],
.no-reading-chip[b-cv86ynb6dk],
.overdue-chip[b-cv86ynb6dk],
.follow-up-chip[b-cv86ynb6dk],
.complaint-count-chip[b-cv86ynb6dk] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.84rem;
    font-weight:800;
}

.source-type-chip.canal[b-cv86ynb6dk] { color:#2f789f; background:#e8f3f8; }
.source-type-chip.pond[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.source-type-chip.reservoir[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.source-type-chip.river[b-cv86ynb6dk] { color:#278ca8; background:#e5f5f9; }
.source-type-chip.groundwater[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.source-type-chip.drainage[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }
.source-type-chip.tap-water[b-cv86ynb6dk] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-cv86ynb6dk] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-cv86ynb6dk] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-cv86ynb6dk] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-cv86ynb6dk] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-cv86ynb6dk] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-cv86ynb6dk] { color:#687872; background:#edf1ef; }

.usage-chip[b-cv86ynb6dk] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-cv86ynb6dk] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.no-reading-chip[b-cv86ynb6dk] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-cv86ynb6dk] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-cv86ynb6dk] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-cv86ynb6dk] {
    color:#73569b;
    background:#f0eafb;
}

.latest-reading-cell strong[b-cv86ynb6dk],
.inspection-cell strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-reading-cell small[b-cv86ynb6dk],
.inspection-cell small[b-cv86ynb6dk],
.type-usage-cell small[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.quality-metric-mini[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.quality-metric-mini span[b-cv86ynb6dk] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.84rem;
}

.quality-metric-mini strong[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.88rem;
}

.row-action.sample[b-cv86ynb6dk] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-cv86ynb6dk] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-cv86ynb6dk] { background:var(--theme-primary); }
.coordinate-pin.watch[b-cv86ynb6dk] { background:#987634; }
.coordinate-pin.polluted[b-cv86ynb6dk] { background:#c56b2a; }
.coordinate-pin.critical[b-cv86ynb6dk] { background:#b54d43; }
.coordinate-pin.restoring[b-cv86ynb6dk] { background:#73569b; }
.coordinate-pin.closed[b-cv86ynb6dk] { background:#687872; }

.coordinate-pin .mud-icon-root[b-cv86ynb6dk] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-cv86ynb6dk] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-cv86ynb6dk] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-cv86ynb6dk] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.linked-photo-preview[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-cv86ynb6dk] {
    color:#73569b;
    font-size:.84rem;
    font-weight:800;
}

.linked-photo-preview h3[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-cv86ynb6dk] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.linked-photo-preview button[b-cv86ynb6dk] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.reading-form-modal[b-cv86ynb6dk] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.reading-preview-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.reading-preview-grid article[b-cv86ynb6dk] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.reading-preview-grid small[b-cv86ynb6dk],
.reading-preview-grid strong[b-cv86ynb6dk],
.reading-preview-grid span[b-cv86ynb6dk] {
    display:block;
}

.reading-preview-grid small[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.reading-preview-grid strong[b-cv86ynb6dk] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.reading-preview-grid span[b-cv86ynb6dk] {
    margin-top:5px;
    color:#2f789f;
    font-size:.84rem;
}

.reading-preview-grid article.ph[b-cv86ynb6dk] { border-top:4px solid #73569b; }
.reading-preview-grid article.do[b-cv86ynb6dk] { border-top:4px solid #2f789f; }
.reading-preview-grid article.bod[b-cv86ynb6dk] { border-top:4px solid #c56b2a; }
.reading-preview-grid article.cod[b-cv86ynb6dk] { border-top:4px solid #b54d43; }
.reading-preview-grid article.turbidity[b-cv86ynb6dk] { border-top:4px solid #987634; }
.reading-preview-grid article.coliform[b-cv86ynb6dk] { border-top:4px solid var(--theme-primary); }

.reading-photo-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.water-cover-panel[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.water-cover-photo[b-cv86ynb6dk] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.water-cover-photo img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.water-cover-content small[b-cv86ynb6dk] {
    color:#2f789f;
    font-size:.84rem;
    font-weight:800;
    letter-spacing:.07em;
}

.water-cover-content h2[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.water-cover-content p[b-cv86ynb6dk] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.water-cover-meta[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.water-cover-meta span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.84rem;
    font-weight:750;
}

.quality-emblem[b-cv86ynb6dk] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.quality-emblem.watch[b-cv86ynb6dk] { color:#987634; border-color:#f2e6c9; }
.quality-emblem.polluted[b-cv86ynb6dk] { color:#c56b2a; border-color:#f8ddc7; }
.quality-emblem.critical[b-cv86ynb6dk] { color:#b54d43; border-color:#f4d7d3; }
.quality-emblem.restoring[b-cv86ynb6dk] { color:#73569b; border-color:#e8def4; }
.quality-emblem.closed[b-cv86ynb6dk] { color:#687872; border-color:#dde5e1; }

.quality-emblem .mud-icon-root[b-cv86ynb6dk] {
    font-size:2.25rem;
}

.quality-emblem strong[b-cv86ynb6dk] {
    font-size:1.05rem;
    text-align:center;
}

.quality-emblem small[b-cv86ynb6dk] {
    font-size:.84rem;
}

.measurement-document-grid[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-cv86ynb6dk] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-cv86ynb6dk],
.measurement-document-grid strong[b-cv86ynb6dk] {
    display:block;
}

.measurement-document-grid span[b-cv86ynb6dk] {
    color:#71837a;
    font-size:.84rem;
}

.measurement-document-grid strong[b-cv86ynb6dk] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.reading-history-panel[b-cv86ynb6dk],
.linked-complaint-panel[b-cv86ynb6dk] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.reading-card-list[b-cv86ynb6dk],
.linked-complaint-list[b-cv86ynb6dk] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.reading-card[b-cv86ynb6dk] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.reading-card.good[b-cv86ynb6dk] { border-left-color:var(--theme-primary); }
.reading-card.watch[b-cv86ynb6dk] { border-left-color:#987634; }
.reading-card.polluted[b-cv86ynb6dk] { border-left-color:#c56b2a; }
.reading-card.critical[b-cv86ynb6dk] { border-left-color:#b54d43; }
.reading-card.restoring[b-cv86ynb6dk] { border-left-color:#73569b; }

.reading-card-head[b-cv86ynb6dk] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.reading-card-head strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.reading-card-head small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.84rem;
}

.reading-card-metrics[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.reading-card-metrics span[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.84rem;
}

.reading-card-metrics strong[b-cv86ynb6dk] {
    color:#2f789f;
}

.reading-card p[b-cv86ynb6dk] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.reading-photo-actions[b-cv86ynb6dk] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.reading-photo-actions button[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.84rem;
    cursor:pointer;
}

.linked-complaint-list article[b-cv86ynb6dk] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-cv86ynb6dk] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-cv86ynb6dk] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-cv86ynb6dk] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-cv86ynb6dk] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.84rem;
}

.linked-complaint-list p[b-cv86ynb6dk] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.86rem;
}

.linked-complaint-list a[b-cv86ynb6dk] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.84rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-cv86ynb6dk] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-cv86ynb6dk] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-cv86ynb6dk] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-cv86ynb6dk] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-cv86ynb6dk] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-cv86ynb6dk] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.water-page[b-cv86ynb6dk]  .water-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.water-page[b-cv86ynb6dk]  .mud-input,
.water-page[b-cv86ynb6dk]  .mud-select-input {
    font-size:1.02rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.water-page[b-cv86ynb6dk]  .mud-list-item-text {
    font-size:1rem !important;
}

.water-page[b-cv86ynb6dk]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .source-type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .water-metric-grid[b-cv86ynb6dk],
    .measurement-document-grid[b-cv86ynb6dk],
    .reading-preview-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .water-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .source-type-overview[b-cv86ynb6dk] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .water-cover-panel[b-cv86ynb6dk] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .quality-emblem[b-cv86ynb6dk] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-cv86ynb6dk] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-cv86ynb6dk],
    .source-type-overview[b-cv86ynb6dk],
    .amount-metrics[b-cv86ynb6dk],
    .follow-grid[b-cv86ynb6dk],
    .water-metric-grid[b-cv86ynb6dk],
    .measurement-document-grid[b-cv86ynb6dk],
    .reading-preview-grid[b-cv86ynb6dk],
    .reference-grid[b-cv86ynb6dk],
    .amount-document-grid[b-cv86ynb6dk],
    .reading-photo-grid[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-cover-panel[b-cv86ynb6dk],
    .coordinate-preview[b-cv86ynb6dk],
    .linked-complaint-list article[b-cv86ynb6dk] {
        grid-template-columns:minmax(0,1fr);
    }

    .water-cover-photo[b-cv86ynb6dk] {
        height:250px;
    }

    .coordinate-pin[b-cv86ynb6dk] {
        margin:0 auto;
    }

    .water-map-board[b-cv86ynb6dk] {
        min-height:500px;
    }

    .linked-complaint-list button[b-cv86ynb6dk] {
        height:210px;
    }

    .water-page[b-cv86ynb6dk]  .water-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #water-profile-print-area[b-cv86ynb6dk],
    #water-profile-print-area *[b-cv86ynb6dk] {
        visibility:visible !important;
    }

    #water-profile-print-area[b-cv86ynb6dk] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .water-view-modal[b-cv86ynb6dk] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-cv86ynb6dk],
    .document-status-strip[b-cv86ynb6dk],
    .water-cover-panel[b-cv86ynb6dk],
    .document-section[b-cv86ynb6dk],
    .document-footer[b-cv86ynb6dk] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/06EducationandActivities/EducationActivities.razor.rz.scp.css */
:root[b-z4271ndj8v] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.activity-page[b-z4271ndj8v] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.activity-page[b-z4271ndj8v]  .activity-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.activity-hero[b-z4271ndj8v] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-z4271ndj8v] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-z4271ndj8v] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-z4271ndj8v],
.hero-action-panel[b-z4271ndj8v] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-z4271ndj8v] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-z4271ndj8v] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-z4271ndj8v] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-z4271ndj8v] {
    color: #d8ede6;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-z4271ndj8v] {
    margin-top: 3px;
    font-size: .94rem;
}

.activity-hero h1[b-z4271ndj8v] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.activity-hero p[b-z4271ndj8v] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-z4271ndj8v] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .90rem;
    font-weight: 650;
}

.hero-action-panel[b-z4271ndj8v] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-z4271ndj8v] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-z4271ndj8v] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-z4271ndj8v] {
    font-size: .90rem;
}

.hero-status small[b-z4271ndj8v] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .90rem;
}

.activity-page[b-z4271ndj8v]  .hero-add-button,
.activity-page[b-z4271ndj8v]  .toolbar-add-button,
.activity-page[b-z4271ndj8v]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.activity-page[b-z4271ndj8v]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-z4271ndj8v],
.hero-refresh-button[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-z4271ndj8v] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-z4271ndj8v] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-z4271ndj8v] {
    opacity: .55;
    cursor: wait;
}

.activity-page[b-z4271ndj8v]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.activity-page[b-z4271ndj8v]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-z4271ndj8v] {
    margin-top: 2px !important;
}

.summary-card[b-z4271ndj8v] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-z4271ndj8v] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-z4271ndj8v] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-z4271ndj8v] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-z4271ndj8v] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-z4271ndj8v] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-z4271ndj8v] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-z4271ndj8v] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-z4271ndj8v] {
    color: #788982;
    font-size: .90rem;
    font-weight: 650;
}

.summary-card p[b-z4271ndj8v] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-z4271ndj8v] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-z4271ndj8v] {
    color: #798a83;
    font-size: .90rem;
}

.summary-card em[b-z4271ndj8v] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-z4271ndj8v],
.status-overview-card.selected[b-z4271ndj8v] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-z4271ndj8v] {
    background: #f5faf7;
}

.status-overview-card > span[b-z4271ndj8v] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-z4271ndj8v] { background:#687872; }
.status-overview-card.reviewing > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.difference > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.approved > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.closed > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.voided > span[b-z4271ndj8v] { background:#687872; }
.status-overview-card.today > span[b-z4271ndj8v] { background:#73569b; }

.status-overview-card div[b-z4271ndj8v] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-z4271ndj8v] {
    color: var(--theme-muted);
    font-size: .90rem;
}

.status-overview-card strong[b-z4271ndj8v] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-z4271ndj8v] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-z4271ndj8v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-z4271ndj8v] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-z4271ndj8v] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .90rem;
    font-weight: 700;
}

.variance-grid[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-z4271ndj8v] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-z4271ndj8v] {
    display: block;
    color: #3c5047;
    font-size: .90rem;
}

.variance-card small[b-z4271ndj8v] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .90rem;
}

.closing-progress[b-z4271ndj8v] {
    margin-top: 13px;
}

.progress-track[b-z4271ndj8v] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-z4271ndj8v] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-z4271ndj8v] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-z4271ndj8v] {
    display: block;
    color: #87958f;
    font-size: .90rem;
}

.progress-metrics strong[b-z4271ndj8v] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-z4271ndj8v],
.activity-list-panel[b-z4271ndj8v] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-z4271ndj8v] {
    padding: 15px;
}

.filter-heading[b-z4271ndj8v],
.list-toolbar[b-z4271ndj8v] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-z4271ndj8v],
.panel-kicker[b-z4271ndj8v] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-z4271ndj8v],
.list-toolbar h2[b-z4271ndj8v] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-z4271ndj8v],
.list-toolbar p[b-z4271ndj8v] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .90rem;
    line-height: 1.65;
}

.clear-filter-button[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-z4271ndj8v] {
    margin-top: 8px !important;
}

.activity-page[b-z4271ndj8v]  .premium-field,
.activity-page[b-z4271ndj8v]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.activity-page[b-z4271ndj8v]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    text-transform: none !important;
}

.filter-summary[b-z4271ndj8v] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .90rem;
}

.filter-summary strong[b-z4271ndj8v] {
    color: var(--theme-primary);
}

.activity-list-panel[b-z4271ndj8v] {
    overflow: hidden;
}

.list-toolbar[b-z4271ndj8v] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.activity-page[b-z4271ndj8v]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-z4271ndj8v] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-z4271ndj8v] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-z4271ndj8v] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-z4271ndj8v] {
    margin: 0;
    font-size: .90rem;
}

.activity-page[b-z4271ndj8v]  .activity-table {
    font-family: 'Kanit',sans-serif;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head {
    background: #f1f7f4;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .90rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-z4271ndj8v] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-z4271ndj8v] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-z4271ndj8v] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .90rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-z4271ndj8v] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .90rem;
}

.date-shift-cell[b-z4271ndj8v],
.counter-cashier-cell[b-z4271ndj8v],
.money-cell[b-z4271ndj8v],
.difference-cell[b-z4271ndj8v],
.transaction-status-cell[b-z4271ndj8v] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-z4271ndj8v] {
    min-width: 175px;
}

.date-shift-cell strong[b-z4271ndj8v],
.counter-cashier-cell strong[b-z4271ndj8v],
.money-cell strong[b-z4271ndj8v],
.difference-cell strong[b-z4271ndj8v],
.transaction-status-cell strong[b-z4271ndj8v] {
    color: #3c5047;
    font-size: .90rem;
    line-height: 1.48;
}

.date-shift-cell small[b-z4271ndj8v],
.counter-cashier-cell small[b-z4271ndj8v],
.money-cell small[b-z4271ndj8v],
.difference-cell small[b-z4271ndj8v] {
    margin-top: 3px;
    color: #84928d;
    font-size: .90rem;
}

.date-shift-cell em[b-z4271ndj8v],
.counter-cashier-cell em[b-z4271ndj8v] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-z4271ndj8v] { color:var(--theme-primary); }
.money-cell.actual strong[b-z4271ndj8v] { color:#2f789f; }

.difference-cell.matched strong[b-z4271ndj8v] { color:#34734b; }
.difference-cell.over strong[b-z4271ndj8v] { color:#987634; }
.difference-cell.short strong[b-z4271ndj8v] { color:#b54d43; }

.status-chip[b-z4271ndj8v],
.match-chip[b-z4271ndj8v] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .90rem;
    font-weight: 700;
}

.status-chip i[b-z4271ndj8v] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.difference[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-z4271ndj8v] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-z4271ndj8v] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.activity-page[b-z4271ndj8v]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.activity-page[b-z4271ndj8v]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.activity-page[b-z4271ndj8v]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.activity-page[b-z4271ndj8v]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.activity-page[b-z4271ndj8v]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-z4271ndj8v] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-z4271ndj8v] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .90rem;
}

/* MODALS */

.modal-backdrop[b-z4271ndj8v],
.image-preview-backdrop[b-z4271ndj8v] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.activity-form-modal[b-z4271ndj8v],
.activity-view-modal[b-z4271ndj8v],
.delete-modal[b-z4271ndj8v],
.image-preview-modal[b-z4271ndj8v] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-z4271ndj8v],
.view-toolbar[b-z4271ndj8v],
.image-preview-header[b-z4271ndj8v] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-z4271ndj8v] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-z4271ndj8v] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-z4271ndj8v],
.view-toolbar small[b-z4271ndj8v],
.image-preview-header small[b-z4271ndj8v] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-z4271ndj8v],
.view-toolbar h2[b-z4271ndj8v],
.image-preview-header h3[b-z4271ndj8v] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-z4271ndj8v] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.modal-body[b-z4271ndj8v],
.view-scroll[b-z4271ndj8v] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-z4271ndj8v] {
    background: #e9efec;
}

.modal-footer[b-z4271ndj8v] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.activity-page[b-z4271ndj8v]  .cancel-button,
.activity-page[b-z4271ndj8v]  .save-button,
.activity-page[b-z4271ndj8v]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.form-section-title[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-z4271ndj8v] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-z4271ndj8v] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-z4271ndj8v] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.form-section-title small[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.open-transactions-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-z4271ndj8v] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-z4271ndj8v],
.calculation-heading[b-z4271ndj8v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-z4271ndj8v],
.calculation-heading small[b-z4271ndj8v] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-z4271ndj8v],
.calculation-heading h3[b-z4271ndj8v] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-z4271ndj8v],
.calculation-heading > span[b-z4271ndj8v] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-z4271ndj8v] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-z4271ndj8v] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.source-summary-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.system-amount-grid[b-z4271ndj8v] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-z4271ndj8v] {
    display:block;
    color:#84928d;
    font-size:.90rem;
}

.system-amount-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.reconciliation-calculation-preview[b-z4271ndj8v] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-z4271ndj8v] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-z4271ndj8v] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-z4271ndj8v] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-z4271ndj8v] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-z4271ndj8v] {
    display:block;
    color:#8b7b74;
    font-size:.90rem;
}

.calculation-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.90rem;
}

.calculation-grid .short span[b-z4271ndj8v],
.calculation-grid .short strong[b-z4271ndj8v],
.calculation-grid .short small[b-z4271ndj8v] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-z4271ndj8v] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-z4271ndj8v] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.photo-upload-heading small[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.photo-preview[b-z4271ndj8v] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-z4271ndj8v] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-z4271ndj8v] {
    color:#40544b;
    font-size:.90rem;
}

.photo-empty small[b-z4271ndj8v] {
    font-size:.90rem;
}

.photo-upload-actions[b-z4271ndj8v] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-z4271ndj8v],
.remove-photo-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-z4271ndj8v] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-z4271ndj8v] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-z4271ndj8v] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-z4271ndj8v],
.detail-transaction-table[b-z4271ndj8v] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-z4271ndj8v],
.source-transaction-row[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-z4271ndj8v] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-z4271ndj8v],
.source-transaction-row > span[b-z4271ndj8v] {
    padding:7px;
    font-size:.90rem;
}

.source-transaction-row[b-z4271ndj8v] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-z4271ndj8v] {
    border-bottom:0;
}

.mini-photo-button[b-z4271ndj8v] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-z4271ndj8v],
.source-transaction-more[b-z4271ndj8v] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

.mock-rule-warning[b-z4271ndj8v] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.90rem !important;
}

/* VIEW & PRINT */

.activity-view-modal[b-z4271ndj8v] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.activity-page[b-z4271ndj8v]  .view-edit-button,
.activity-page[b-z4271ndj8v]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.activity-page[b-z4271ndj8v]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-activity-profile[b-z4271ndj8v] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-z4271ndj8v] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-z4271ndj8v] {
    text-align:center;
}

.document-organization small[b-z4271ndj8v] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-z4271ndj8v] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-z4271ndj8v] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.90rem;
}

.document-number-box[b-z4271ndj8v] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-z4271ndj8v],
.document-number-box small[b-z4271ndj8v] {
    display:block;
    color:#778980;
    font-size:.90rem;
}

.document-number-box strong[b-z4271ndj8v] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
    word-break:break-word;
}

.document-status-strip[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-z4271ndj8v] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-z4271ndj8v] {
    display:block;
    color:#83918b;
    font-size:.90rem;
}

.document-status-strip > div strong[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.90rem;
}

.scope-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-z4271ndj8v] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-z4271ndj8v] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
}

.scope-reference-box[b-z4271ndj8v] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.scope-reference-box strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.90rem;
}

.scope-reference-box small[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-z4271ndj8v],
.transaction-summary-section[b-z4271ndj8v],
.source-transaction-section[b-z4271ndj8v],
.review-section[b-z4271ndj8v] {
    margin-top:16px;
}

.section-title[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-z4271ndj8v] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.90rem;
    font-weight:800;
}

.section-title small[b-z4271ndj8v] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-z4271ndj8v] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-z4271ndj8v] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-z4271ndj8v],
.comparison-row[b-z4271ndj8v],
.comparison-total[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-z4271ndj8v] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-z4271ndj8v],
.comparison-row span[b-z4271ndj8v],
.comparison-total span[b-z4271ndj8v] {
    padding:8px 9px;
    font-size:.90rem;
}

.comparison-row[b-z4271ndj8v] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-z4271ndj8v],
.comparison-total span:not(:first-child)[b-z4271ndj8v] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-z4271ndj8v] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-z4271ndj8v] { color:#34734b; }
.difference-text.over[b-z4271ndj8v] { color:#987634; }
.difference-text.short[b-z4271ndj8v] { color:#b54d43; }

.transaction-summary-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-z4271ndj8v] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-z4271ndj8v] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-z4271ndj8v] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-z4271ndj8v] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-z4271ndj8v] { background:#f4fafc; }

.transaction-summary-grid span[b-z4271ndj8v] {
    display:block;
    color:#84928c;
    font-size:.90rem;
}

.transaction-summary-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-z4271ndj8v] {
    display:block;
    color:#798a83;
    font-size:.90rem;
}

.detail-transaction-header[b-z4271ndj8v],
.detail-transaction-row[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-z4271ndj8v] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-z4271ndj8v],
.detail-transaction-row span[b-z4271ndj8v] {
    padding:8px 7px;
    font-size:.90rem;
}

.detail-transaction-row[b-z4271ndj8v] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-z4271ndj8v] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.review-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.review-note-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-z4271ndj8v] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
}

.review-note-grid p[b-z4271ndj8v] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.document-footer[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.document-footer p[b-z4271ndj8v] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.90rem;
    line-height:1.6;
}

.qr-placeholder[b-z4271ndj8v] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-z4271ndj8v] {
    font-size:.90rem;
    font-weight:700;
}

.mock-document-label[b-z4271ndj8v] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.90rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-z4271ndj8v],
.attachment-panel[b-z4271ndj8v] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-z4271ndj8v] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-z4271ndj8v] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:700;
}

.history-list[b-z4271ndj8v] {
    display:grid;
    gap:7px;
}

.history-item[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-z4271ndj8v] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-z4271ndj8v] {
    color:#3c5047;
    font-size:.90rem;
}

.history-item small[b-z4271ndj8v],
.history-item em[b-z4271ndj8v] {
    color:#84928d;
    font-size:.90rem;
    font-style:normal;
}

.history-item p[b-z4271ndj8v] {
    margin:4px 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.55;
}

.attachment-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-z4271ndj8v] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-z4271ndj8v] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-z4271ndj8v] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-z4271ndj8v] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-z4271ndj8v] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-z4271ndj8v] { background:rgba(52,115,75,.89); }

.attachment-empty[b-z4271ndj8v] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-z4271ndj8v] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-z4271ndj8v] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-z4271ndj8v] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-z4271ndj8v] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-z4271ndj8v] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-z4271ndj8v] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-z4271ndj8v] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.7;
}

.delete-modal p strong[b-z4271ndj8v] {
    color:#b54d43;
}

.delete-warning[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.90rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-z4271ndj8v] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.activity-page[b-z4271ndj8v]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .activity-hero[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-z4271ndj8v] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-z4271ndj8v] {
        grid-column:1 / -1;
    }

    .document-header[b-z4271ndj8v] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-z4271ndj8v] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .activity-page[b-z4271ndj8v] {
        padding-top:10px;
    }

    .activity-page[b-z4271ndj8v]  .activity-container {
        padding-inline:10px !important;
    }

    .activity-hero[b-z4271ndj8v] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-z4271ndj8v],
    .list-toolbar[b-z4271ndj8v],
    .source-summary-heading[b-z4271ndj8v],
    .calculation-heading[b-z4271ndj8v],
    .view-toolbar[b-z4271ndj8v],
    .section-heading[b-z4271ndj8v] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-z4271ndj8v],
    .variance-grid[b-z4271ndj8v],
    .progress-metrics[b-z4271ndj8v],
    .source-summary-grid[b-z4271ndj8v],
    .system-amount-grid[b-z4271ndj8v],
    .calculation-grid[b-z4271ndj8v],
    .photo-upload-grid[b-z4271ndj8v],
    .transaction-summary-grid[b-z4271ndj8v],
    .review-grid[b-z4271ndj8v],
    .review-note-grid[b-z4271ndj8v],
    .attachment-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-z4271ndj8v] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-z4271ndj8v] {
        width:100%;
    }

    .print-activity-profile[b-z4271ndj8v] {
        padding:22px 18px;
    }

    .document-footer[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-z4271ndj8v] {
        grid-column:auto;
    }

    .status-overview[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-z4271ndj8v] {
        width:100%;
    }

    .document-header[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-z4271ndj8v] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-z4271ndj8v] {
        visibility:hidden !important;
    }

    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-z4271ndj8v] {
        display:none !important;
    }

    .modal-backdrop[b-z4271ndj8v],
    .activity-view-modal[b-z4271ndj8v],
    .view-scroll[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .scope-panel[b-z4271ndj8v],
    .amount-comparison-section[b-z4271ndj8v],
    .transaction-summary-section[b-z4271ndj8v],
    .source-transaction-section[b-z4271ndj8v],
    .review-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }

    .mock-document-label[b-z4271ndj8v] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-z4271ndj8v] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.activity-page[b-z4271ndj8v]  .hero-add-button,
.activity-page[b-z4271ndj8v]  .toolbar-add-button,
.activity-page[b-z4271ndj8v]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.confirmed > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.checked-in > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.in-service > span[b-z4271ndj8v] { background:#c46a2b; }
.status-overview-card.completed > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.cancelled > span[b-z4271ndj8v] { background:#b54d43; }

.service-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-z4271ndj8v],
.service-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-z4271ndj8v] {
    background:#f4faf7;
}

.service-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-z4271ndj8v] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.service-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-z4271ndj8v] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-z4271ndj8v] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.focus-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.90rem;
}

/* TABLE */

.citizen-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-z4271ndj8v] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.citizen-photo-cell small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.90rem;
}

.appointment-time-cell[b-z4271ndj8v],
.service-unit-cell[b-z4271ndj8v],
.provider-location-cell[b-z4271ndj8v],
.queue-priority-cell[b-z4271ndj8v],
.reason-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-z4271ndj8v],
.reason-cell[b-z4271ndj8v] {
    min-width:180px;
}

.appointment-time-cell strong[b-z4271ndj8v],
.service-unit-cell strong[b-z4271ndj8v],
.provider-location-cell strong[b-z4271ndj8v],
.queue-priority-cell strong[b-z4271ndj8v],
.reason-cell strong[b-z4271ndj8v] {
    color:#3c5047;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell small[b-z4271ndj8v],
.service-unit-cell small[b-z4271ndj8v],
.provider-location-cell small[b-z4271ndj8v],
.queue-priority-cell small[b-z4271ndj8v],
.reason-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell em[b-z4271ndj8v],
.provider-location-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-z4271ndj8v],
.priority-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-z4271ndj8v] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-z4271ndj8v] { color:#987634; background:#fff4df; }

.priority-chip[b-z4271ndj8v] {
    margin-top:5px;
}

.priority-chip.normal[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-z4271ndj8v] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-z4271ndj8v] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-z4271ndj8v] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-z4271ndj8v] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.identity-chip[b-z4271ndj8v] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.identity-chip.verified[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-z4271ndj8v],
.identity-chip.not-found[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-z4271ndj8v] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.citizen-source-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.citizen-address[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.90rem;
}

.citizen-source-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-z4271ndj8v],
.citizen-source-actions a[b-z4271ndj8v] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-z4271ndj8v] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-z4271ndj8v] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-z4271ndj8v] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.preview-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.consent-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-z4271ndj8v] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-z4271ndj8v] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-z4271ndj8v] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-z4271ndj8v] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-z4271ndj8v] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-z4271ndj8v] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-z4271ndj8v] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-z4271ndj8v] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.5;
}

.identity-box[b-z4271ndj8v] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-z4271ndj8v],
.identity-box small[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.identity-box strong[b-z4271ndj8v] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
}

.service-section[b-z4271ndj8v],
.reason-section[b-z4271ndj8v],
.reminder-section[b-z4271ndj8v] {
    margin-top:16px;
}

.reference-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-z4271ndj8v] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-z4271ndj8v],
.timeline-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.reference-grid strong[b-z4271ndj8v],
.timeline-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.note-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-z4271ndj8v] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-z4271ndj8v] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.note-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.note-grid p[b-z4271ndj8v] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.timeline-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-z4271ndj8v] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.90rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-z4271ndj8v] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-z4271ndj8v] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-z4271ndj8v],
    .preview-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-z4271ndj8v] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-z4271ndj8v] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-z4271ndj8v] {
        grid-column:1 / -1;
    }

    .reference-grid[b-z4271ndj8v],
    .timeline-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-z4271ndj8v],
    .focus-grid[b-z4271ndj8v],
    .citizen-source-grid[b-z4271ndj8v],
    .preview-grid[b-z4271ndj8v],
    .consent-grid[b-z4271ndj8v],
    .source-photo-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .note-grid[b-z4271ndj8v],
    .timeline-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-z4271ndj8v] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-z4271ndj8v] {
        margin:0 auto;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .service-section[b-z4271ndj8v],
    .reason-section[b-z4271ndj8v],
    .reminder-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size: 16px;
    line-height: 1.55;
}

.activity-page[b-z4271ndj8v]  .mud-typography,
.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-input-label,
.activity-page[b-z4271ndj8v]  .mud-select,
.activity-page[b-z4271ndj8v]  .mud-list-item-text,
.activity-page[b-z4271ndj8v]  .mud-button-label,
.activity-page[b-z4271ndj8v]  .mud-table-cell,
.activity-page[b-z4271ndj8v]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size: .92rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size: .90rem !important;
    font-weight: 600 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size: .90rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size: .90rem !important;
    font-weight: 700 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .90rem !important;
    line-height: 1.55 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .90rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-z4271ndj8v] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-z4271ndj8v] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-z4271ndj8v] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-z4271ndj8v] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-z4271ndj8v] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-z4271ndj8v] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-z4271ndj8v] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-z4271ndj8v] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-z4271ndj8v],
.activity-list-panel[b-z4271ndj8v],
.insight-panel[b-z4271ndj8v] {
    border-radius: 20px;
}

.filter-panel[b-z4271ndj8v] {
    padding: 20px;
}

.list-toolbar[b-z4271ndj8v] {
    padding: 19px 20px;
}

.filter-heading p[b-z4271ndj8v],
.list-toolbar p[b-z4271ndj8v] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-z4271ndj8v] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-z4271ndj8v] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-z4271ndj8v],
.service-unit-cell[b-z4271ndj8v],
.provider-location-cell[b-z4271ndj8v],
.queue-priority-cell[b-z4271ndj8v],
.reason-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    min-width: 155px;
}

.provider-location-cell[b-z4271ndj8v],
.reason-cell[b-z4271ndj8v] {
    min-width: 215px;
}

.service-chip[b-z4271ndj8v],
.priority-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.identity-chip[b-z4271ndj8v] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-z4271ndj8v] {
    min-width: 205px;
    gap: 7px;
}

.activity-page[b-z4271ndj8v]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-z4271ndj8v] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-z4271ndj8v],
.view-toolbar[b-z4271ndj8v],
.image-preview-header[b-z4271ndj8v] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-z4271ndj8v],
.view-scroll[b-z4271ndj8v] {
    padding: 20px;
}

.modal-footer[b-z4271ndj8v] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-z4271ndj8v] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-z4271ndj8v] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-z4271ndj8v],
.preview-grid > div[b-z4271ndj8v],
.reference-grid > div[b-z4271ndj8v],
.timeline-grid > div[b-z4271ndj8v] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-z4271ndj8v] {
    padding: 13px;
}

.photo-preview[b-z4271ndj8v] {
    min-height: 200px;
}

.photo-preview img[b-z4271ndj8v] {
    height: 200px;
}

.history-item[b-z4271ndj8v] {
    padding: 12px;
}

.attachment-card[b-z4271ndj8v],
.attachment-card img[b-z4271ndj8v] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .activity-page[b-z4271ndj8v] {
        font-size: 15px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .90rem !important;
    }

    .summary-card[b-z4271ndj8v] {
        min-height: 122px;
    }

    .status-overview-card[b-z4271ndj8v],
    .service-overview-card[b-z4271ndj8v] {
        min-height: 82px;
    }

    .modal-body[b-z4271ndj8v],
    .view-scroll[b-z4271ndj8v] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #activity-profile-print-area[b-z4271ndj8v] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #activity-profile-print-area h1[b-z4271ndj8v] {
        font-size: 18pt !important;
    }

    #activity-profile-print-area h2[b-z4271ndj8v] {
        font-size: 14pt !important;
    }

    #activity-profile-print-area h3[b-z4271ndj8v] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.follow-up > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.referred > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.cancelled > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.month > span[b-z4271ndj8v] { background:#73569b; }

.service-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-z4271ndj8v] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-z4271ndj8v] {
    display:block;
    color:#7c8d86;
    font-size:.90rem;
}

.care-metrics strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-z4271ndj8v],
.service-unit-cell[b-z4271ndj8v],
.provider-location-cell[b-z4271ndj8v],
.result-cell[b-z4271ndj8v],
.follow-score-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-z4271ndj8v],
.result-cell[b-z4271ndj8v] {
    min-width:230px;
}

.history-date-cell strong[b-z4271ndj8v],
.service-unit-cell strong[b-z4271ndj8v],
.provider-location-cell strong[b-z4271ndj8v],
.result-cell strong[b-z4271ndj8v],
.follow-score-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-z4271ndj8v],
.service-unit-cell small[b-z4271ndj8v],
.provider-location-cell small[b-z4271ndj8v],
.result-cell small[b-z4271ndj8v],
.follow-score-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.history-date-cell em[b-z4271ndj8v],
.provider-location-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.referred[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-z4271ndj8v] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-z4271ndj8v] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-z4271ndj8v] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-z4271ndj8v] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-z4271ndj8v] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-z4271ndj8v],
.source-actions button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-z4271ndj8v] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-z4271ndj8v] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-z4271ndj8v] {
    min-height:180px;
}

.source-photo-card img[b-z4271ndj8v] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-z4271ndj8v] {
    margin-top:18px;
}

.vital-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-z4271ndj8v],
.quality-grid > div[b-z4271ndj8v],
.follow-up-grid > div[b-z4271ndj8v] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-z4271ndj8v],
.quality-grid span[b-z4271ndj8v],
.follow-up-grid span[b-z4271ndj8v] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-z4271ndj8v],
.quality-grid strong[b-z4271ndj8v],
.follow-up-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.vital-summary[b-z4271ndj8v] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.90rem;
    line-height:1.65;
}

.follow-up-grid[b-z4271ndj8v],
.quality-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.55 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:.94rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:.92rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-z4271ndj8v] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-z4271ndj8v] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-z4271ndj8v] { background:rgba(104,120,114,.89); }

.view-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-z4271ndj8v],
    .service-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-z4271ndj8v],
    .vital-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-z4271ndj8v] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-z4271ndj8v],
    .quality-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-z4271ndj8v],
    .service-overview[b-z4271ndj8v],
    .care-metrics[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .source-photo-grid[b-z4271ndj8v],
    .vital-grid[b-z4271ndj8v],
    .follow-up-grid[b-z4271ndj8v],
    .quality-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.follow-up > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.referred > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.overdue > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.inactive > span[b-z4271ndj8v] { background:#687872; }

.risk-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-z4271ndj8v],
.risk-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.risk-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-z4271ndj8v] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-z4271ndj8v],
.care-metrics strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-z4271ndj8v],
.care-metrics small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.care-metrics[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-z4271ndj8v] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-z4271ndj8v],
.risk-adl-cell[b-z4271ndj8v],
.dependency-living-cell[b-z4271ndj8v],
.caregiver-cell[b-z4271ndj8v],
.follow-up-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-z4271ndj8v] {
    min-width:190px;
}

.register-age-cell strong[b-z4271ndj8v],
.risk-adl-cell strong[b-z4271ndj8v],
.dependency-living-cell strong[b-z4271ndj8v],
.caregiver-cell strong[b-z4271ndj8v],
.follow-up-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-z4271ndj8v],
.risk-adl-cell small[b-z4271ndj8v],
.dependency-living-cell small[b-z4271ndj8v],
.caregiver-cell small[b-z4271ndj8v],
.follow-up-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.register-age-cell em[b-z4271ndj8v],
.caregiver-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-z4271ndj8v],
.dependency-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.identity-chip[b-z4271ndj8v],
.overdue-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.risk-chip.low[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.risk-chip.high[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.active[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.referred[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.overdue-chip[b-z4271ndj8v] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-z4271ndj8v] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-z4271ndj8v] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-z4271ndj8v] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-z4271ndj8v] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-z4271ndj8v] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.6;
}

.source-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-z4271ndj8v],
.source-actions button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-z4271ndj8v] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-z4271ndj8v] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.assessment-preview strong[b-z4271ndj8v] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-z4271ndj8v],
.reference-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-z4271ndj8v],
.reference-grid > div[b-z4271ndj8v],
.care-plan-grid > div[b-z4271ndj8v] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-z4271ndj8v],
.reference-grid span[b-z4271ndj8v],
.care-plan-grid span[b-z4271ndj8v] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.assessment-grid strong[b-z4271ndj8v],
.reference-grid strong[b-z4271ndj8v],
.care-plan-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.55;
}

.care-plan-main[b-z4271ndj8v] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.90rem;
    line-height:1.7;
}

.care-plan-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.58 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:.96rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:.94rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-z4271ndj8v] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-z4271ndj8v] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-z4271ndj8v] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-z4271ndj8v] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-z4271ndj8v] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-z4271ndj8v],
    .assessment-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-z4271ndj8v],
    .risk-overview[b-z4271ndj8v],
    .dependency-grid[b-z4271ndj8v],
    .care-metrics[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .assessment-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .care-plan-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:16.5px;
    line-height:1.62;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-z4271ndj8v] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.field > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.completed > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.follow-up > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.referred > span[b-z4271ndj8v] { background:#b55b82; }

.visit-type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-z4271ndj8v],
.visit-type-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-z4271ndj8v] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.visit-type-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-z4271ndj8v] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-z4271ndj8v],
.care-metrics strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-z4271ndj8v],
.care-metrics small[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE */

.visit-date-cell[b-z4271ndj8v],
.visit-type-cell[b-z4271ndj8v],
.team-location-cell[b-z4271ndj8v],
.result-cell[b-z4271ndj8v],
.follow-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-z4271ndj8v],
.result-cell[b-z4271ndj8v] {
    min-width:230px;
}

.visit-date-cell strong[b-z4271ndj8v],
.visit-type-cell strong[b-z4271ndj8v],
.team-location-cell strong[b-z4271ndj8v],
.result-cell strong[b-z4271ndj8v],
.follow-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-z4271ndj8v],
.visit-type-cell small[b-z4271ndj8v],
.team-location-cell small[b-z4271ndj8v],
.result-cell small[b-z4271ndj8v],
.follow-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.58;
}

.visit-date-cell em[b-z4271ndj8v],
.team-location-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.identity-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.referred[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.priority-text[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-z4271ndj8v] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-z4271ndj8v] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-z4271ndj8v] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-z4271ndj8v] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-z4271ndj8v] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.65;
}

.source-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-z4271ndj8v] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-z4271ndj8v] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-z4271ndj8v],
.reference-grid > div[b-z4271ndj8v] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-z4271ndj8v],
.reference-grid span[b-z4271ndj8v] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-z4271ndj8v],
.reference-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:.98rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-z4271ndj8v],
    .visit-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-z4271ndj8v],
    .visit-type-overview[b-z4271ndj8v],
    .target-grid[b-z4271ndj8v],
    .care-metrics[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .vital-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.65;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-z4271ndj8v] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.review > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.eligible > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.paid > span[b-z4271ndj8v] { background:#73569b; }

.type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-z4271ndj8v],
.type-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-z4271ndj8v] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-z4271ndj8v],
.target-grid button[b-z4271ndj8v] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.budget-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

/* TABLE */

.application-no-cell[b-z4271ndj8v],
.welfare-type-cell[b-z4271ndj8v],
.household-cell[b-z4271ndj8v],
.amount-cell[b-z4271ndj8v],
.officer-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-z4271ndj8v],
.officer-cell[b-z4271ndj8v] {
    min-width:210px;
}

.application-no-cell strong[b-z4271ndj8v],
.welfare-type-cell strong[b-z4271ndj8v],
.household-cell strong[b-z4271ndj8v],
.amount-cell strong[b-z4271ndj8v],
.officer-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-z4271ndj8v],
.welfare-type-cell small[b-z4271ndj8v],
.household-cell small[b-z4271ndj8v],
.amount-cell small[b-z4271ndj8v],
.officer-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.application-no-cell em[b-z4271ndj8v],
.household-cell em[b-z4271ndj8v],
.amount-cell em[b-z4271ndj8v],
.officer-cell em[b-z4271ndj8v],
.citizen-photo-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.source-group-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.source-group-chip[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-z4271ndj8v] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-z4271ndj8v],
.amount-preview[b-z4271ndj8v] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-z4271ndj8v] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-z4271ndj8v] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-z4271ndj8v],
.amount-preview > div[b-z4271ndj8v] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-z4271ndj8v],
.amount-preview small[b-z4271ndj8v] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.amount-preview small[b-z4271ndj8v] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-z4271ndj8v],
.amount-preview strong[b-z4271ndj8v] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-z4271ndj8v],
.amount-preview span[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-document-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-z4271ndj8v] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-z4271ndj8v],
.amount-document-grid small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-document-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-z4271ndj8v] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-z4271ndj8v] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-z4271ndj8v] {
    min-height:43px;
    font-size:.90rem;
}

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-z4271ndj8v] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-z4271ndj8v],
    .type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .type-overview[b-z4271ndj8v],
    .budget-grid[b-z4271ndj8v],
    .target-grid[b-z4271ndj8v],
    .care-metrics[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .assessment-preview[b-z4271ndj8v],
    .amount-preview[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.66;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-z4271ndj8v] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.payment > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.suspended > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.expiring > span[b-z4271ndj8v] { background:#73569b; }

.target-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-z4271ndj8v],
.target-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-z4271ndj8v] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.target-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-z4271ndj8v],
.follow-grid button[b-z4271ndj8v] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-metrics strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

.follow-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-z4271ndj8v] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.registry-cell[b-z4271ndj8v],
.benefit-cell[b-z4271ndj8v],
.period-cell[b-z4271ndj8v],
.amount-cell[b-z4271ndj8v],
.payment-cycle-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-z4271ndj8v] {
    min-width:225px;
}

.registry-cell strong[b-z4271ndj8v],
.benefit-cell strong[b-z4271ndj8v],
.period-cell strong[b-z4271ndj8v],
.amount-cell strong[b-z4271ndj8v],
.payment-cycle-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-z4271ndj8v],
.benefit-cell small[b-z4271ndj8v],
.period-cell small[b-z4271ndj8v],
.amount-cell small[b-z4271ndj8v],
.payment-cycle-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.registry-cell em[b-z4271ndj8v],
.period-cell em[b-z4271ndj8v],
.amount-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-z4271ndj8v],
.cycle-chip[b-z4271ndj8v],
.verify-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.source-group-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.benefit-chip.allowance[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-z4271ndj8v] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.expired[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.source-group-chip[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-z4271ndj8v] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-z4271ndj8v] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-z4271ndj8v] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-z4271ndj8v] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-z4271ndj8v] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* LARGE MUD TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-z4271ndj8v] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-z4271ndj8v] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-z4271ndj8v],
    .target-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .target-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .condition-switch-grid[b-z4271ndj8v],
    .amount-preview[b-z4271ndj8v],
    .source-data-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .patient-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.66;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-z4271ndj8v] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-z4271ndj8v] { background:#687872; }
.status-overview-card.approval > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.processing > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.paid > span[b-z4271ndj8v] { background:#34734b; }
.status-overview-card.failed > span[b-z4271ndj8v] { background:#b54d43; }

.disbursement-progress[b-z4271ndj8v] {
    margin-top:15px;
}

.disbursement-progress > div[b-z4271ndj8v] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-z4271ndj8v],
.amount-cell[b-z4271ndj8v],
.progress-cell[b-z4271ndj8v],
.date-cell[b-z4271ndj8v],
.control-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-z4271ndj8v] {
    min-width:245px;
}

.batch-cell strong[b-z4271ndj8v],
.amount-cell strong[b-z4271ndj8v],
.progress-cell strong[b-z4271ndj8v],
.date-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-z4271ndj8v],
.amount-cell small[b-z4271ndj8v],
.progress-cell small[b-z4271ndj8v],
.date-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.batch-cell em[b-z4271ndj8v],
.amount-cell em[b-z4271ndj8v],
.date-cell em[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-z4271ndj8v] {
    min-width:180px;
}

.recipient-stack[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-z4271ndj8v],
.recipient-stack span[b-z4271ndj8v] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-z4271ndj8v] {
    margin-left:0;
}

.recipient-stack img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.recipient-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.table-progress[b-z4271ndj8v] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-z4271ndj8v],
.approval-chip[b-z4271ndj8v],
.reconcile-chip[b-z4271ndj8v],
.cycle-chip[b-z4271ndj8v],
.line-status-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.approved[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.control-cell[b-z4271ndj8v] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-z4271ndj8v] {
    align-items:center;
}

.selection-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-z4271ndj8v] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-z4271ndj8v] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-z4271ndj8v] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-z4271ndj8v] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.source-selection-summary strong[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-z4271ndj8v] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-z4271ndj8v] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-z4271ndj8v],
.source-selection-table td[b-z4271ndj8v] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.90rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-z4271ndj8v] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.90rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-z4271ndj8v] {
    background:#f0faf6;
}

.source-person-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-z4271ndj8v] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-z4271ndj8v],
.source-benefit-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-person-cell small[b-z4271ndj8v],
.source-benefit-cell small[b-z4271ndj8v],
.source-date[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.source-person-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.source-benefit-cell[b-z4271ndj8v] {
    min-width:190px;
}

.source-amount[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.bank-readiness span.ready[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.source-document-buttons[b-z4271ndj8v] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-z4271ndj8v] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-z4271ndj8v] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-z4271ndj8v] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-z4271ndj8v] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* DETAIL */

.batch-overview-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-z4271ndj8v] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-z4271ndj8v] {
    font-size:3.5rem;
}

.batch-overview-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-z4271ndj8v] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.print-line-table-wrap[b-z4271ndj8v] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-z4271ndj8v] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-z4271ndj8v],
.print-line-table td[b-z4271ndj8v] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.90rem;
    vertical-align:top;
}

.print-line-table th[b-z4271ndj8v] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-z4271ndj8v],
.print-line-table td small[b-z4271ndj8v] {
    display:block;
}

.print-line-table td small[b-z4271ndj8v] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-z4271ndj8v] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-z4271ndj8v] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-z4271ndj8v] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-z4271ndj8v] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-z4271ndj8v] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid strong[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.recipient-document-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-z4271ndj8v] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-z4271ndj8v] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-z4271ndj8v] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-z4271ndj8v] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-z4271ndj8v] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-z4271ndj8v],
    .recipient-detail-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-z4271ndj8v] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-z4271ndj8v] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .source-selection-summary[b-z4271ndj8v],
    .amount-preview[b-z4271ndj8v],
    .recipient-detail-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-z4271ndj8v] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-z4271ndj8v] {
        overflow-x:auto;
    }

    .source-selection-table[b-z4271ndj8v] {
        min-width:1050px;
    }

    .batch-overview-panel[b-z4271ndj8v],
    .recipient-detail-card[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-z4271ndj8v] {
        width:100%;
        height:190px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .batch-overview-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.66;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-z4271ndj8v],
.type-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.full > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.overflow > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.maintenance > span[b-z4271ndj8v] { background:#73569b; }

.type-overview[b-z4271ndj8v] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-z4271ndj8v],
.type-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-z4271ndj8v] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-z4271ndj8v] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-z4271ndj8v] {
    margin-top:15px;
}

.fill-progress > div[b-z4271ndj8v] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-z4271ndj8v] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-z4271ndj8v] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-z4271ndj8v] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-z4271ndj8v] {
    background:#987634;
}

.map-pin.full[b-z4271ndj8v] {
    background:#c56b2a;
}

.map-pin.overflow[b-z4271ndj8v] {
    background:#b54d43;
}

.map-pin.maintenance[b-z4271ndj8v] {
    background:#73569b;
}

.map-pin.inactive[b-z4271ndj8v] {
    background:#687872;
}

.map-pin span[b-z4271ndj8v] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-z4271ndj8v] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-z4271ndj8v] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-z4271ndj8v] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-z4271ndj8v] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-z4271ndj8v] { background:#987634; }
.map-board-legend i.full[b-z4271ndj8v] { background:#b54d43; }
.map-board-legend i.maintenance[b-z4271ndj8v] { background:#73569b; }

.map-board-caption[b-z4271ndj8v] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-z4271ndj8v],
.map-board-caption small[b-z4271ndj8v] {
    display:block;
}

.map-board-caption strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.point-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-z4271ndj8v] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-z4271ndj8v] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.point-photo-cell em[b-z4271ndj8v] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-z4271ndj8v],
.bin-cell[b-z4271ndj8v],
.fill-cell[b-z4271ndj8v],
.collection-cell[b-z4271ndj8v],
.sensor-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-z4271ndj8v] {
    min-width:220px;
}

.location-cell strong[b-z4271ndj8v],
.bin-cell strong[b-z4271ndj8v],
.fill-cell strong[b-z4271ndj8v],
.collection-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-z4271ndj8v],
.bin-cell small[b-z4271ndj8v],
.fill-cell small[b-z4271ndj8v],
.collection-cell small[b-z4271ndj8v],
.sensor-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.waste-type-chip[b-z4271ndj8v],
.collection-chip[b-z4271ndj8v],
.sensor-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.waste-type-chip.general[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.status-chip.active[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.full[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.table-progress[b-z4271ndj8v] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-z4271ndj8v] { background:var(--theme-primary); }
.table-progress.medium span[b-z4271ndj8v] { background:#2f789f; }
.table-progress.high span[b-z4271ndj8v] { background:#987634; }
.table-progress.critical span[b-z4271ndj8v] { background:#b54d43; }

.repair-alert[b-z4271ndj8v],
.clean-alert[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-z4271ndj8v] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-z4271ndj8v] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-z4271ndj8v] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.fill-preview-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-z4271ndj8v] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-z4271ndj8v] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-z4271ndj8v] { background:#2f789f; }
.fill-preview-bin.high span[b-z4271ndj8v] { background:#987634; }
.fill-preview-bin.critical span[b-z4271ndj8v] { background:#b54d43; }

.fill-preview-bin strong[b-z4271ndj8v] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-z4271ndj8v] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-z4271ndj8v] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.source-photo-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-z4271ndj8v] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-z4271ndj8v] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.large-fill-indicator[b-z4271ndj8v] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-z4271ndj8v] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-z4271ndj8v] { background:#2f789f; }
.large-fill-indicator.high > span[b-z4271ndj8v] { background:#987634; }
.large-fill-indicator.critical > span[b-z4271ndj8v] { background:#b54d43; }

.large-fill-indicator strong[b-z4271ndj8v],
.large-fill-indicator small[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-z4271ndj8v] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-z4271ndj8v] {
    font-size:.90rem;
}

.detail-map-preview[b-z4271ndj8v] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-z4271ndj8v] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-z4271ndj8v] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-z4271ndj8v] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-z4271ndj8v] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.collection-history-list small[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-button.collect[b-z4271ndj8v] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-z4271ndj8v] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-z4271ndj8v],
    .type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-z4271ndj8v] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-z4271ndj8v] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-z4271ndj8v] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .type-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .condition-switch-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-z4271ndj8v],
    .fill-preview-card[b-z4271ndj8v],
    .coordinate-preview[b-z4271ndj8v],
    .collection-history-list article[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-z4271ndj8v] {
        min-height:240px;
    }

    .large-fill-indicator[b-z4271ndj8v],
    .fill-preview-bin[b-z4271ndj8v],
    .coordinate-pin[b-z4271ndj8v] {
        margin:0 auto;
    }

    .map-board[b-z4271ndj8v] {
        min-height:500px;
    }

    .map-pin[b-z4271ndj8v] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .point-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.68;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.received > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.inspecting > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.in-progress > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.resolved > span[b-z4271ndj8v] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-z4271ndj8v]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-z4271ndj8v],
.pollution-type-card.selected[b-z4271ndj8v] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.pollution-type-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-z4271ndj8v] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-z4271ndj8v] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-z4271ndj8v] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-z4271ndj8v] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-z4271ndj8v] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-z4271ndj8v] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-z4271ndj8v] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-z4271ndj8v] {
    margin-top:18px;
}

.sla-progress > div[b-z4271ndj8v] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-z4271ndj8v] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-z4271ndj8v] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-z4271ndj8v] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-z4271ndj8v] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-z4271ndj8v] { background:#2f789f; }
.pollution-map-pin.medium[b-z4271ndj8v] { background:#987634; }
.pollution-map-pin.high[b-z4271ndj8v] { background:#c56b2a; }
.pollution-map-pin.critical[b-z4271ndj8v] { background:#b54d43; }

.pollution-map-pin span[b-z4271ndj8v] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-z4271ndj8v] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-z4271ndj8v] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-z4271ndj8v] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-z4271ndj8v] { background:#2f789f; }
.map-board-legend i.medium[b-z4271ndj8v] { background:#987634; }
.map-board-legend i.high[b-z4271ndj8v] { background:#c56b2a; }
.map-board-legend i.critical[b-z4271ndj8v] { background:#b54d43; }

.map-board-caption[b-z4271ndj8v] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-z4271ndj8v],
.map-board-caption small[b-z4271ndj8v] {
    display:block;
}

.map-board-caption strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-z4271ndj8v] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.complaint-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.type-severity-cell[b-z4271ndj8v],
.reporter-cell[b-z4271ndj8v],
.location-cell[b-z4271ndj8v],
.inspection-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-z4271ndj8v],
.location-cell[b-z4271ndj8v] {
    min-width:195px;
}

.reporter-cell strong[b-z4271ndj8v],
.location-cell strong[b-z4271ndj8v],
.inspection-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-z4271ndj8v],
.location-cell small[b-z4271ndj8v],
.inspection-cell small[b-z4271ndj8v],
.status-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.reporter-cell em[b-z4271ndj8v],
.location-cell em[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.pollution-type-chip[b-z4271ndj8v],
.severity-chip[b-z4271ndj8v],
.inspection-chip[b-z4271ndj8v],
.status-chip[b-z4271ndj8v],
.overdue-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.pollution-type-chip.air[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.severity-chip.high[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-z4271ndj8v] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-z4271ndj8v] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-z4271ndj8v] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* FORM */

.anonymous-switch-card[b-z4271ndj8v] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-z4271ndj8v],
.anonymous-switch-card small[b-z4271ndj8v] {
    display:block;
}

.anonymous-switch-card strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.coordinate-preview[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-z4271ndj8v],
.map-board-grid[b-z4271ndj8v] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-z4271ndj8v] { background:#c56b2a; }
.coordinate-pin.critical[b-z4271ndj8v] { background:#b54d43; }
.coordinate-pin.medium[b-z4271ndj8v] { background:#987634; }

.coordinate-pin .mud-icon-root[b-z4271ndj8v] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-z4271ndj8v] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.source-point-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-z4271ndj8v] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-condition-row[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:750;
}

.source-condition-row span.warning[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-z4271ndj8v] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-z4271ndj8v] { color:#987634; background:#fff4df; }

.measurement-preview small[b-z4271ndj8v],
.measurement-preview strong[b-z4271ndj8v],
.measurement-preview em[b-z4271ndj8v] {
    display:block;
}

.measurement-preview small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-preview strong[b-z4271ndj8v] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.source-photo-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-z4271ndj8v] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-z4271ndj8v] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.severity-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.25rem;
}

.severity-emblem strong[b-z4271ndj8v] {
    font-size:1.10rem;
}

.severity-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.measurement-document-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-z4271ndj8v] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-z4271ndj8v],
.measurement-document-grid strong[b-z4271ndj8v] {
    display:block;
}

.measurement-document-grid span[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-z4271ndj8v] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-z4271ndj8v] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-z4271ndj8v] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-z4271ndj8v] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-z4271ndj8v] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-z4271ndj8v] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-z4271ndj8v] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-z4271ndj8v] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-z4271ndj8v] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-z4271ndj8v] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-z4271ndj8v] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-z4271ndj8v] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-z4271ndj8v],
    .source-photo-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-z4271ndj8v],
    .source-photo-preview button[b-z4271ndj8v] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .pollution-type-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .measurement-preview[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-z4271ndj8v],
    .coordinate-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .coordinate-pin[b-z4271ndj8v] {
        margin:0 auto;
    }

    .pollution-map-board[b-z4271ndj8v] {
        min-height:500px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .complaint-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.68;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.polluted > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.critical > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.restoring > span[b-z4271ndj8v] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-z4271ndj8v]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-z4271ndj8v],
.institution-type-card.selected[b-z4271ndj8v] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-z4271ndj8v] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-z4271ndj8v] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-z4271ndj8v] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-z4271ndj8v] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-z4271ndj8v] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-z4271ndj8v] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-z4271ndj8v] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.activity-metric-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.activity-metric-grid article[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.activity-metric-grid article > span[b-z4271ndj8v] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.activity-metric-grid article.ph > span[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.activity-metric-grid article.do > span[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.activity-metric-grid article.bod > span[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.activity-metric-grid article.turbidity > span[b-z4271ndj8v] { color:#987634; background:#fff4df; }

.activity-metric-grid small[b-z4271ndj8v],
.activity-metric-grid strong[b-z4271ndj8v],
.activity-metric-grid em[b-z4271ndj8v] {
    display:block;
}

.activity-metric-grid small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.activity-metric-grid strong[b-z4271ndj8v] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.activity-metric-grid em[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-z4271ndj8v] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-z4271ndj8v] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-z4271ndj8v] { background:var(--theme-primary); }
.education-map-pin.watch[b-z4271ndj8v] { background:#987634; }
.education-map-pin.polluted[b-z4271ndj8v] { background:#c56b2a; }
.education-map-pin.critical[b-z4271ndj8v] { background:#b54d43; }
.education-map-pin.restoring[b-z4271ndj8v] { background:#73569b; }
.education-map-pin.closed[b-z4271ndj8v] { background:#687872; }

.education-map-pin span[b-z4271ndj8v] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-z4271ndj8v] { background:var(--theme-primary); }
.map-board-legend i.watch[b-z4271ndj8v] { background:#987634; }
.map-board-legend i.polluted[b-z4271ndj8v] { background:#c56b2a; }
.map-board-legend i.critical[b-z4271ndj8v] { background:#b54d43; }
.map-board-legend i.restoring[b-z4271ndj8v] { background:#73569b; }

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-z4271ndj8v],
.latest-progress-cell[b-z4271ndj8v],
.inspection-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-z4271ndj8v],
.quality-status-chip[b-z4271ndj8v],
.usage-chip[b-z4271ndj8v],
.lab-chip[b-z4271ndj8v],
.no-progress-chip[b-z4271ndj8v],
.overdue-chip[b-z4271ndj8v],
.follow-up-chip[b-z4271ndj8v],
.complaint-count-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.canal[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-z4271ndj8v] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.usage-chip[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-z4271ndj8v],
.inspection-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-z4271ndj8v],
.inspection-cell small[b-z4271ndj8v],
.type-level-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-z4271ndj8v] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.90rem;
}

.size-cell strong[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
}

.row-action.sample[b-z4271ndj8v] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-z4271ndj8v] { background:var(--theme-primary); }
.coordinate-pin.watch[b-z4271ndj8v] { background:#987634; }
.coordinate-pin.polluted[b-z4271ndj8v] { background:#c56b2a; }
.coordinate-pin.critical[b-z4271ndj8v] { background:#b54d43; }
.coordinate-pin.restoring[b-z4271ndj8v] { background:#73569b; }
.coordinate-pin.closed[b-z4271ndj8v] { background:#687872; }

.coordinate-pin .mud-icon-root[b-z4271ndj8v] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-z4271ndj8v] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-z4271ndj8v] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.linked-photo-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-z4271ndj8v] {
    color:#73569b;
    font-size:.90rem;
    font-weight:800;
}

.linked-photo-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-z4271ndj8v] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-photo-preview button[b-z4271ndj8v] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.participant-form-modal[b-z4271ndj8v] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.review-score-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.review-score-preview article[b-z4271ndj8v] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.review-score-preview small[b-z4271ndj8v],
.review-score-preview strong[b-z4271ndj8v],
.review-score-preview span[b-z4271ndj8v] {
    display:block;
}

.review-score-preview small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-z4271ndj8v] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.review-score-preview span[b-z4271ndj8v] {
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.review-score-preview article.ph[b-z4271ndj8v] { border-top:4px solid #73569b; }
.review-score-preview article.do[b-z4271ndj8v] { border-top:4px solid #2f789f; }
.review-score-preview article.bod[b-z4271ndj8v] { border-top:4px solid #c56b2a; }
.review-score-preview article.cod[b-z4271ndj8v] { border-top:4px solid #b54d43; }
.review-score-preview article.turbidity[b-z4271ndj8v] { border-top:4px solid #987634; }
.review-score-preview article.coliform[b-z4271ndj8v] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-z4271ndj8v] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-z4271ndj8v] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-z4271ndj8v] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.25rem;
}

.education-emblem strong[b-z4271ndj8v] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.measurement-document-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-z4271ndj8v] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-z4271ndj8v],
.measurement-document-grid strong[b-z4271ndj8v] {
    display:block;
}

.measurement-document-grid span[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-z4271ndj8v] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.participant-history-panel[b-z4271ndj8v],
.linked-complaint-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.participant-card-list[b-z4271ndj8v],
.linked-complaint-list[b-z4271ndj8v] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.participant-card[b-z4271ndj8v] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.participant-card.good[b-z4271ndj8v] { border-left-color:var(--theme-primary); }
.participant-card.watch[b-z4271ndj8v] { border-left-color:#987634; }
.participant-card.polluted[b-z4271ndj8v] { border-left-color:#c56b2a; }
.participant-card.critical[b-z4271ndj8v] { border-left-color:#b54d43; }
.participant-card.restoring[b-z4271ndj8v] { border-left-color:#73569b; }

.participant-card-head[b-z4271ndj8v] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.participant-card-head strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.participant-card-head small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.participant-card-metrics[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.participant-card-metrics span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.90rem;
}

.participant-card-metrics strong[b-z4271ndj8v] {
    color:#2f789f;
}

.participant-card p[b-z4271ndj8v] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.assessment-photo-actions[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

.linked-complaint-list article[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-z4271ndj8v] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.90rem;
}

.linked-complaint-list p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-complaint-list a[b-z4271ndj8v] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.90rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-z4271ndj8v] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .institution-type-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .amount-document-grid[b-z4271ndj8v],
    .progress-photo-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-z4271ndj8v],
    .coordinate-preview[b-z4271ndj8v],
    .linked-complaint-list article[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .coordinate-pin[b-z4271ndj8v] {
        margin:0 auto;
    }

    .education-map-board[b-z4271ndj8v] {
        min-height:500px;
    }

    .linked-complaint-list button[b-z4271ndj8v] {
        height:210px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .education-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.68;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-z4271ndj8v] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-z4271ndj8v] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.diseased > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-z4271ndj8v] { background:#b54d43; }
.status-overview-card.treatment > span[b-z4271ndj8v] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-z4271ndj8v]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-z4271ndj8v],
.institution-type-card.selected[b-z4271ndj8v] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-z4271ndj8v] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-z4271ndj8v] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-z4271ndj8v] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-z4271ndj8v] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-z4271ndj8v] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-z4271ndj8v] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-z4271ndj8v] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.activity-metric-grid article.carbon > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.activity-metric-grid article.photo > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.activity-metric-grid article.maintenance > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.activity-metric-grid article.treatment > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-z4271ndj8v] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-z4271ndj8v] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-z4271ndj8v] { background:var(--theme-primary); }
.education-map-pin.watch[b-z4271ndj8v] { background:#987634; }
.education-map-pin.diseased[b-z4271ndj8v] { background:#c56b2a; }
.education-map-pin.hazardous[b-z4271ndj8v] { background:#b54d43; }
.education-map-pin.treatment[b-z4271ndj8v] { background:#73569b; }
.education-map-pin.removed[b-z4271ndj8v] { background:#687872; }

.education-map-pin span[b-z4271ndj8v] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-z4271ndj8v] { background:var(--theme-primary); }
.map-board-legend i.watch[b-z4271ndj8v] { background:#987634; }
.map-board-legend i.diseased[b-z4271ndj8v] { background:#c56b2a; }
.map-board-legend i.hazardous[b-z4271ndj8v] { background:#b54d43; }
.map-board-legend i.treatment[b-z4271ndj8v] { background:#73569b; }

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-z4271ndj8v],
.latest-progress-cell[b-z4271ndj8v],
.maintenance-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-z4271ndj8v],
.health-status-chip[b-z4271ndj8v],
.risk-chip[b-z4271ndj8v],
.health-score-chip[b-z4271ndj8v],
.no-progress-chip[b-z4271ndj8v],
.overdue-chip[b-z4271ndj8v],
.urgent-chip[b-z4271ndj8v],
.water-link-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-z4271ndj8v] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-z4271ndj8v] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.risk-chip.high[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-z4271ndj8v],
.urgent-chip[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-z4271ndj8v],
.latest-progress-cell strong[b-z4271ndj8v],
.maintenance-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-z4271ndj8v],
.latest-progress-cell small[b-z4271ndj8v],
.maintenance-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-z4271ndj8v] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.size-cell strong[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.size-cell em[b-z4271ndj8v] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.90rem;
    font-style:normal;
}

.row-action.inspect[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-z4271ndj8v] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-z4271ndj8v] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* INSPECTION */

.participant-form-modal[b-z4271ndj8v] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.good[b-z4271ndj8v] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.watch[b-z4271ndj8v] {
    border-top:4px solid #987634;
}

.review-score-preview article.diseased[b-z4271ndj8v],
.review-score-preview article.high[b-z4271ndj8v] {
    border-top:4px solid #c56b2a;
}

.review-score-preview article.hazardous[b-z4271ndj8v],
.review-score-preview article.critical[b-z4271ndj8v] {
    border-top:4px solid #b54d43;
}

.review-score-preview article.medium[b-z4271ndj8v] {
    border-top:4px solid #987634;
}

.review-score-preview article.low[b-z4271ndj8v] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-z4271ndj8v] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-z4271ndj8v] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-z4271ndj8v] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.25rem;
}

.education-emblem strong[b-z4271ndj8v] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.participant-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.participant-card[b-z4271ndj8v] {
    border-left:5px solid var(--theme-primary);
}

.participant-card.medium[b-z4271ndj8v],
.participant-card.watch[b-z4271ndj8v] {
    border-left-color:#987634;
}

.participant-card.high[b-z4271ndj8v],
.participant-card.diseased[b-z4271ndj8v] {
    border-left-color:#c56b2a;
}

.participant-card.critical[b-z4271ndj8v],
.participant-card.hazardous[b-z4271ndj8v] {
    border-left-color:#b54d43;
}

.view-register-button[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-z4271ndj8v] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-z4271ndj8v],
    .source-photo-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .institution-type-overview[b-z4271ndj8v],
    .amount-metrics[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .progress-photo-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-z4271ndj8v],
    .coordinate-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .coordinate-pin[b-z4271ndj8v] {
        margin:0 auto;
    }

    .education-map-board[b-z4271ndj8v] {
        min-height:500px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .education-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.72;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.full > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.maintenance > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.review > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.temp-closed > span[b-z4271ndj8v] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-z4271ndj8v]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-z4271ndj8v],
.institution-type-card.selected[b-z4271ndj8v] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-z4271ndj8v] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-z4271ndj8v] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-z4271ndj8v] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-z4271ndj8v] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-z4271ndj8v] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-z4271ndj8v] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-z4271ndj8v] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-z4271ndj8v] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.activity-metric-grid article.attendance > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.activity-metric-grid article.health > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.activity-metric-grid article.assessment > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.activity-metric-grid article.green > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-z4271ndj8v] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-z4271ndj8v] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-z4271ndj8v] { background:var(--theme-primary); }
.education-map-pin.full[b-z4271ndj8v] { background:#987634; }
.education-map-pin.maintenance[b-z4271ndj8v] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-z4271ndj8v] { background:#73569b; }
.education-map-pin.temp-closed[b-z4271ndj8v],
.education-map-pin.inactive[b-z4271ndj8v] { background:#b54d43; }

.education-map-pin span[b-z4271ndj8v] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-z4271ndj8v] { background:var(--theme-primary); }
.map-board-legend i.full[b-z4271ndj8v] { background:#987634; }
.map-board-legend i.maintenance[b-z4271ndj8v] { background:#c56b2a; }
.map-board-legend i.review[b-z4271ndj8v] { background:#73569b; }
.map-board-legend i.closed[b-z4271ndj8v] { background:#b54d43; }

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-z4271ndj8v],
.latest-progress-cell[b-z4271ndj8v],
.assessment-date-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-z4271ndj8v],
.institution-status-chip[b-z4271ndj8v],
.accreditation-chip[b-z4271ndj8v],
.assessment-result-chip[b-z4271ndj8v],
.no-progress-chip[b-z4271ndj8v],
.overdue-chip[b-z4271ndj8v],
.due-chip[b-z4271ndj8v],
.green-link-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-z4271ndj8v],
.assessment-result-chip.passed[b-z4271ndj8v],
.assessment-result-chip.excellent[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-z4271ndj8v],
.assessment-result-chip.conditional[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-z4271ndj8v],
.assessment-result-chip.review[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-z4271ndj8v],
.accreditation-chip.not-assessed[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-z4271ndj8v],
.latest-progress-cell small[b-z4271ndj8v],
.assessment-date-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.latest-progress-cell strong[b-z4271ndj8v],
.assessment-date-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-z4271ndj8v] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.occupancy-track[b-z4271ndj8v] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.personnel-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-z4271ndj8v] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.personnel-cell strong[b-z4271ndj8v] {
    color:var(--theme-primary);
}

.personnel-cell em[b-z4271ndj8v] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.90rem;
    font-style:normal;
}

.row-action.assess[b-z4271ndj8v] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-z4271ndj8v] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-z4271ndj8v],
.capacity-preview strong[b-z4271ndj8v] {
    display:block;
}

.capacity-preview small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.capacity-preview strong[b-z4271ndj8v] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-z4271ndj8v] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.participant-form-modal[b-z4271ndj8v] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.excellent[b-z4271ndj8v],
.review-score-preview article.passed[b-z4271ndj8v] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.conditional[b-z4271ndj8v] {
    border-top:4px solid #987634;
}

.review-score-preview article.review[b-z4271ndj8v] {
    border-top:4px solid #b54d43;
}

.participant-card.excellent[b-z4271ndj8v],
.participant-card.passed[b-z4271ndj8v] {
    border-left-color:var(--theme-primary);
}

.participant-card.conditional[b-z4271ndj8v] {
    border-left-color:#987634;
}

.participant-card.review[b-z4271ndj8v] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-z4271ndj8v] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-z4271ndj8v] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-z4271ndj8v] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.25rem;
}

.education-emblem strong[b-z4271ndj8v] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.participant-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-register-button[b-z4271ndj8v] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-z4271ndj8v] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-z4271ndj8v] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.04rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-z4271ndj8v],
    .source-photo-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .institution-type-overview[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .progress-photo-grid[b-z4271ndj8v],
    .capacity-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .education-map-board[b-z4271ndj8v] {
        min-height:500px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .education-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.74;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-z4271ndj8v] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.new > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.watch > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.transferred > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.graduated > span[b-z4271ndj8v] { background:#73569b; }

.activity-metric-grid article.new > span[b-z4271ndj8v] {
    color:#c56b2a;
    background:#fff0df;
}

.activity-metric-grid article.health > span[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.activity-metric-grid article.scholarship > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.activity-metric-grid article.photo > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-z4271ndj8v],
.latest-progress-cell[b-z4271ndj8v],
.care-cell[b-z4271ndj8v] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-z4271ndj8v],
.student-status-chip[b-z4271ndj8v],
.health-chip[b-z4271ndj8v],
.special-care-chip[b-z4271ndj8v],
.scholarship-chip[b-z4271ndj8v],
.learning-chip[b-z4271ndj8v],
.no-progress-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.school-chip[b-z4271ndj8v] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-z4271ndj8v] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.health-chip.referred[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-z4271ndj8v],
.learning-chip.good[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-z4271ndj8v],
.latest-progress-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-z4271ndj8v],
.latest-progress-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-cell[b-z4271ndj8v] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.progress-track[b-z4271ndj8v] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-z4271ndj8v] { background:var(--theme-primary); }
.progress-track i.watch[b-z4271ndj8v] { background:#987634; }
.progress-track i.risk[b-z4271ndj8v] { background:#b54d43; }

.teacher-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-z4271ndj8v],
.teacher-cell small[b-z4271ndj8v] {
    display:block;
}

.teacher-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.progress[b-z4271ndj8v] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-z4271ndj8v] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-z4271ndj8v] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-z4271ndj8v] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.participant-form-modal[b-z4271ndj8v] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.review-score-preview article[b-z4271ndj8v] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.watch[b-z4271ndj8v],
.review-score-preview article.pass[b-z4271ndj8v] {
    border-top-color:#987634;
}

.review-score-preview article.risk[b-z4271ndj8v],
.review-score-preview article.support[b-z4271ndj8v] {
    border-top-color:#b54d43;
}

.review-score-preview small[b-z4271ndj8v],
.review-score-preview strong[b-z4271ndj8v],
.review-score-preview span[b-z4271ndj8v] {
    display:block;
}

.review-score-preview small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-z4271ndj8v] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.review-score-preview span[b-z4271ndj8v] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.participant-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.participant-card[b-z4271ndj8v] {
    border-left:5px solid var(--theme-primary);
}

.participant-card.pass[b-z4271ndj8v] {
    border-left-color:#2f789f;
}

.participant-card.support[b-z4271ndj8v] {
    border-left-color:#b54d43;
}

.view-register-button[b-z4271ndj8v] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.activity-document-photo[b-z4271ndj8v] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.activity-document-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.05rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .progress-photo-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .activity-form-modal[b-z4271ndj8v],
    .participant-form-modal[b-z4271ndj8v],
    .activity-view-modal[b-z4271ndj8v] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   SCHOLARSHIP MANAGEMENT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.75;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.applications[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.approved[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.paid[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.balance[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.submitted > span[b-z4271ndj8v] { background:#c56b2a; }
.status-overview-card.under-review > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.waiting-payment > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.partial > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.paid > span[b-z4271ndj8v] { background:var(--theme-primary); }

.activity-metric-grid article.review > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.activity-metric-grid article.waiting > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.activity-metric-grid article.partial > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.activity-metric-grid article.average > span[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.application-program-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:180px;
    flex-direction:column;
    gap:7px;
}

.application-program-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.99rem;
}

.application-program-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.scholarship-type-chip[b-z4271ndj8v],
.scholarship-status-chip[b-z4271ndj8v],
.priority-chip[b-z4271ndj8v],
.special-care-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.scholarship-type-chip.need[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-type-chip.merit[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.scholarship-type-chip.disability[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.scholarship-type-chip.sport[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.scholarship-type-chip.culture[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.scholarship-type-chip.emergency[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.scholarship-status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.scholarship-status-chip.submitted[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.scholarship-status-chip.under-review[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.scholarship-status-chip.approved[b-z4271ndj8v],
.scholarship-status-chip.paid[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-status-chip.waiting-payment[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.scholarship-status-chip.partial[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.scholarship-status-chip.rejected[b-z4271ndj8v],
.scholarship-status-chip.cancelled[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.special-care-chip[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.eligibility-cell[b-z4271ndj8v],
.amount-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:205px;
}

.eligibility-cell span[b-z4271ndj8v],
.amount-cell span[b-z4271ndj8v] {
    display:flex;
    min-height:39px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.eligibility-cell strong[b-z4271ndj8v],
.amount-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.eligibility-cell em[b-z4271ndj8v] {
    grid-column:1 / -1;
}

.amount-cell span:nth-child(3)[b-z4271ndj8v] {
    grid-column:1 / -1;
    color:#987634;
    background:#fffaf0;
}

.payment-progress-cell[b-z4271ndj8v] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:9px;
}

.payment-progress-cell > div:first-child[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.payment-progress-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-progress-cell span[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.payment-track[b-z4271ndj8v] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.payment-track i[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.payment-progress-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

.officer-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-z4271ndj8v],
.officer-cell small[b-z4271ndj8v] {
    display:block;
}

.officer-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.officer-cell small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.review[b-z4271ndj8v] {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-action.pay[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* APPLICATION FORM */

.linked-student-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-student-preview > button[b-z4271ndj8v] {
    height:190px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:20px;
    cursor:zoom-in;
}

.linked-student-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-student-preview small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-student-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.linked-student-preview p[b-z4271ndj8v] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.93rem;
}

.linked-student-preview > div > div[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-student-preview > div > div span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.document-upload-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.document-upload-card[b-z4271ndj8v] {
    overflow:hidden;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.document-upload-heading[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-z4271ndj8v] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.document-upload-heading strong[b-z4271ndj8v],
.document-upload-heading small[b-z4271ndj8v] {
    display:block;
}

.document-upload-heading strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.document-upload-heading small[b-z4271ndj8v] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-z4271ndj8v] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-z4271ndj8v] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty .mud-icon-root[b-z4271ndj8v] {
    font-size:2rem;
}

.document-empty strong[b-z4271ndj8v] {
    font-size:.91rem;
}

.document-empty small[b-z4271ndj8v] {
    font-size:.90rem;
}

.officer-grid[b-z4271ndj8v] {
    margin-top:10px;
}

.privacy-warning[b-z4271ndj8v] {
    margin-top:20px;
    font-size:.96rem !important;
}

/* REVIEW */

.participant-form-modal[b-z4271ndj8v],
.attendance-form-modal[b-z4271ndj8v] {
    width:min(1120px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-source-summary[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.review-source-summary > div[b-z4271ndj8v] {
    min-height:105px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.review-student[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.review-student img[b-z4271ndj8v] {
    width:78px;
    height:78px;
    border-radius:19px;
    object-fit:cover;
}

.review-source-summary small[b-z4271ndj8v],
.review-source-summary strong[b-z4271ndj8v],
.review-source-summary span[b-z4271ndj8v] {
    display:block;
}

.review-source-summary small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.review-source-summary strong[b-z4271ndj8v] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1rem;
}

.review-source-summary span[b-z4271ndj8v] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-score-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.review-score-preview article[b-z4271ndj8v] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.conditional[b-z4271ndj8v],
.review-score-preview article.requested[b-z4271ndj8v] {
    border-top-color:#987634;
}

.review-score-preview article.review[b-z4271ndj8v] {
    border-top-color:#b54d43;
}

.review-score-preview article.approved[b-z4271ndj8v] {
    border-top-color:#73569b;
}

.review-score-preview small[b-z4271ndj8v],
.review-score-preview strong[b-z4271ndj8v],
.review-score-preview span[b-z4271ndj8v] {
    display:block;
}

.review-score-preview small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-z4271ndj8v] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.34rem;
}

.review-score-preview span[b-z4271ndj8v] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-document-card[b-z4271ndj8v],
.payment-document-card[b-z4271ndj8v] {
    max-width:520px;
    margin:18px auto 0;
}

.review-save-button[b-z4271ndj8v] {
    background:linear-gradient(135deg,#73569b,#584078) !important;
    color:#fff !important;
}

/* PAYMENT */

.payment-summary-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.payment-summary-grid article[b-z4271ndj8v] {
    min-height:105px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.payment-summary-grid small[b-z4271ndj8v],
.payment-summary-grid strong[b-z4271ndj8v],
.payment-summary-grid span[b-z4271ndj8v] {
    display:block;
}

.payment-summary-grid small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.payment-summary-grid strong[b-z4271ndj8v] {
    margin-top:6px;
    color:var(--theme-primary);
    font-size:1.30rem;
}

.payment-summary-grid span[b-z4271ndj8v] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.payment-save-button[b-z4271ndj8v] {
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
    color:#fff !important;
}

/* VIEW */

.scholarship-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.scholarship-cover-photo[b-z4271ndj8v] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.scholarship-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.scholarship-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.scholarship-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.40rem;
}

.scholarship-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.94rem;
}

.scholarship-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.scholarship-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.scholarship-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.scholarship-emblem.submitted[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.scholarship-emblem.under-review[b-z4271ndj8v] { color:#73569b; border-color:#e8def4; }
.scholarship-emblem.waiting-payment[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.scholarship-emblem.partial[b-z4271ndj8v] { color:#2f789f; border-color:#d8eaf2; }
.scholarship-emblem.rejected[b-z4271ndj8v],
.scholarship-emblem.cancelled[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }

.scholarship-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.3rem;
}

.scholarship-emblem strong[b-z4271ndj8v] {
    font-size:1.05rem;
    text-align:center;
}

.scholarship-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.activity-document-photo[b-z4271ndj8v] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.activity-document-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-register-button[b-z4271ndj8v] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.view-attendance-button[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.participant-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.participant-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    gap:12px;
    padding:15px;
    border-left:5px solid var(--theme-primary);
    border-radius:13px;
    background:#f7fbf8;
}

.participant-card > span[b-z4271ndj8v] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.participant-card > div > div[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.participant-card strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1rem;
}

.participant-card small[b-z4271ndj8v],
.participant-card p[b-z4271ndj8v],
.participant-card em[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.participant-card p[b-z4271ndj8v] {
    margin:5px 0;
}

.participant-card em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.history-empty[b-z4271ndj8v] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.student > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.application > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.income > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.support > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.approval > span[b-z4271ndj8v] { background:rgba(52,115,75,.90); }
.attachment-card.payment > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.96rem !important;
    line-height:1.74 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:67px;
    color:#26463c;
    font-size:.98rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.06rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:1.02rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1.04rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:1rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scholarship-cover-panel[b-z4271ndj8v] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1100px) {
    .document-upload-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-source-summary[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-student-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .scholarship-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .review-source-summary[b-z4271ndj8v],
    .review-score-preview[b-z4271ndj8v],
    .payment-summary-grid[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.92rem !important;
    }

    .activity-form-modal[b-z4271ndj8v],
    .participant-form-modal[b-z4271ndj8v],
    .attendance-form-modal[b-z4271ndj8v],
    .activity-view-modal[b-z4271ndj8v] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .scholarship-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}


/* =========================================================
   CHILDREN & YOUTH ACTIVITIES โ€” PREMIUM LARGE TEXT
   ========================================================= */

.activity-page[b-z4271ndj8v] {
    font-size:17px;
    line-height:1.76;
}

.activity-hero[b-z4271ndj8v] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.activities[b-z4271ndj8v] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.participants[b-z4271ndj8v] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.budget[b-z4271ndj8v] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.outcome[b-z4271ndj8v] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-z4271ndj8v] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.open > span[b-z4271ndj8v] { background:var(--theme-primary); }
.status-overview-card.full > span[b-z4271ndj8v] { background:#987634; }
.status-overview-card.ongoing > span[b-z4271ndj8v] { background:#2f789f; }
.status-overview-card.completed > span[b-z4271ndj8v] { background:#73569b; }
.status-overview-card.postponed > span[b-z4271ndj8v] { background:#c56b2a; }

/* CATEGORY CARDS */

.category-overview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.category-overview-card[b-z4271ndj8v] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:108px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.category-overview-card[b-z4271ndj8v]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--category-soft,rgba(10,114,87,.08));
    content:"";
}

.category-overview-card:hover[b-z4271ndj8v],
.category-overview-card.selected[b-z4271ndj8v] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.category-overview-card > span[b-z4271ndj8v] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--category-color);
    background:var(--category-soft);
}

.category-overview-card > div[b-z4271ndj8v] {
    position:relative;
    z-index:2;
}

.category-overview-card small[b-z4271ndj8v],
.category-overview-card strong[b-z4271ndj8v],
.category-overview-card em[b-z4271ndj8v] {
    display:block;
}

.category-overview-card small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.category-overview-card strong[b-z4271ndj8v] {
    margin-top:5px;
    color:var(--category-color);
    font-size:1.25rem;
    font-weight:850;
}

.category-overview-card em[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.category-overview-card.learning[b-z4271ndj8v] {
    --category-color:var(--theme-primary);
    --category-soft:rgba(10,114,87,.13);
}

.category-overview-card.sport[b-z4271ndj8v] {
    --category-color:#2f789f;
    --category-soft:rgba(47,120,159,.13);
}

.category-overview-card.art[b-z4271ndj8v] {
    --category-color:#b3678a;
    --category-soft:rgba(179,103,138,.13);
}

.category-overview-card.environment[b-z4271ndj8v] {
    --category-color:#39794f;
    --category-soft:rgba(57,121,79,.13);
}

.category-overview-card.volunteer[b-z4271ndj8v] {
    --category-color:#c56b2a;
    --category-soft:rgba(197,107,42,.13);
}

.category-overview-card.digital[b-z4271ndj8v] {
    --category-color:#73569b;
    --category-soft:rgba(115,86,155,.13);
}

/* METRICS */

.activity-metric-grid article.upcoming > span[b-z4271ndj8v] {
    color:#c56b2a;
    background:#fff0df;
}

.activity-metric-grid article.full > span[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.activity-metric-grid article.ongoing > span[b-z4271ndj8v] {
    color:#2f789f;
    background:#e8f3f8;
}

.activity-metric-grid article.photo > span[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.activity-photo-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:102px minmax(0,1fr);
    min-width:380px;
    align-items:center;
    gap:14px;
}

.activity-photo-mini[b-z4271ndj8v] {
    width:102px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.activity-photo-mini img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-photo-cell strong[b-z4271ndj8v] {
    display:block;
    color:var(--theme-ink);
    font-size:1.03rem;
    font-weight:800;
    line-height:1.58;
}

.activity-photo-cell small[b-z4271ndj8v],
.activity-photo-cell em[b-z4271ndj8v] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.activity-photo-cell em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.schedule-location-cell[b-z4271ndj8v],
.registration-cell[b-z4271ndj8v],
.payment-progress-cell[b-z4271ndj8v],
.status-cell[b-z4271ndj8v] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:8px;
}

.schedule-location-cell > span[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.91rem;
    font-weight:800;
}

.schedule-location-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.schedule-location-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.54;
}

.registration-cell > div:first-child[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.registration-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1rem;
}

.registration-cell span[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.registration-track[b-z4271ndj8v] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.registration-track i[b-z4271ndj8v] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.registration-track i.available[b-z4271ndj8v] { background:var(--theme-primary); }
.registration-track i.near-full[b-z4271ndj8v] { background:#987634; }
.registration-track i.full[b-z4271ndj8v] { background:#b54d43; }

.registration-cell small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.budget-cell[b-z4271ndj8v],
.outcome-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:215px;
}

.budget-cell span[b-z4271ndj8v],
.outcome-cell span[b-z4271ndj8v] {
    display:flex;
    min-height:40px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.budget-cell strong[b-z4271ndj8v],
.outcome-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.budget-cell small[b-z4271ndj8v],
.outcome-cell small[b-z4271ndj8v] {
    grid-column:1 / -1;
    color:#71837a;
    font-size:.90rem;
}

.no-outcome-chip[b-z4271ndj8v],
.activity-status-chip[b-z4271ndj8v],
.priority-chip[b-z4271ndj8v],
.category-chip[b-z4271ndj8v],
.attendance-chip[b-z4271ndj8v] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.no-outcome-chip[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.activity-status-chip.draft[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.activity-status-chip.open[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.activity-status-chip.full[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.activity-status-chip.ongoing[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.activity-status-chip.completed[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.activity-status-chip.postponed[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.activity-status-chip.cancelled[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-z4271ndj8v] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }

.category-chip.learning[b-z4271ndj8v] { color:var(--theme-primary); background:#e7f5ef; }
.category-chip.sport[b-z4271ndj8v] { color:#2f789f; background:#e8f3f8; }
.category-chip.art[b-z4271ndj8v] { color:#b3678a; background:#faedf3; }
.category-chip.music[b-z4271ndj8v] { color:#73569b; background:#f0eafb; }
.category-chip.environment[b-z4271ndj8v] { color:#39794f; background:#eaf5ed; }
.category-chip.volunteer[b-z4271ndj8v] { color:#c56b2a; background:#fff0df; }
.category-chip.digital[b-z4271ndj8v] { color:#356b9b; background:#e8f1f8; }
.category-chip.health[b-z4271ndj8v] { color:#b54d43; background:#fff0ee; }
.category-chip.culture[b-z4271ndj8v] { color:#987634; background:#fff4df; }
.category-chip.career[b-z4271ndj8v] { color:#4d7c68; background:#eaf3ef; }

.officer-cell[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:215px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-z4271ndj8v] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-z4271ndj8v],
.officer-cell small[b-z4271ndj8v] {
    display:block;
}

.officer-cell strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-z4271ndj8v] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.register[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

.row-action.attendance[b-z4271ndj8v] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.complete[b-z4271ndj8v] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM PREVIEW */

.activity-preview-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:17px 0 24px;
}

.activity-preview-grid article[b-z4271ndj8v] {
    min-height:104px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.activity-preview-grid small[b-z4271ndj8v],
.activity-preview-grid strong[b-z4271ndj8v],
.activity-preview-grid span[b-z4271ndj8v] {
    display:block;
}

.activity-preview-grid small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.activity-preview-grid strong[b-z4271ndj8v] {
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.32rem;
}

.activity-preview-grid span[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

/* UPLOAD */

.activity-upload-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:13px;
    margin-bottom:20px;
}

.activity-upload-card[b-z4271ndj8v] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.activity-upload-heading[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.activity-upload-heading > span[b-z4271ndj8v] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.activity-upload-heading strong[b-z4271ndj8v],
.activity-upload-heading small[b-z4271ndj8v] {
    display:block;
}

.activity-upload-heading strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.activity-upload-heading small[b-z4271ndj8v] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.activity-upload-preview[b-z4271ndj8v] {
    height:165px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.activity-upload-preview img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-upload-empty[b-z4271ndj8v] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.activity-upload-empty .mud-icon-root[b-z4271ndj8v] {
    font-size:2rem;
}

.activity-upload-empty strong[b-z4271ndj8v],
.activity-upload-empty small[b-z4271ndj8v] {
    font-size:.90rem;
}

.privacy-warning[b-z4271ndj8v] {
    margin-top:20px;
    font-size:.98rem !important;
}

/* PARTICIPANT */

.participant-form-modal[b-z4271ndj8v],
.attendance-form-modal[b-z4271ndj8v],
.completion-form-modal[b-z4271ndj8v] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.participant-activity-summary[b-z4271ndj8v],
.completion-summary-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.participant-activity-summary > div[b-z4271ndj8v],
.completion-summary-grid article[b-z4271ndj8v] {
    min-height:102px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.participant-activity-summary small[b-z4271ndj8v],
.participant-activity-summary strong[b-z4271ndj8v],
.completion-summary-grid small[b-z4271ndj8v],
.completion-summary-grid strong[b-z4271ndj8v],
.completion-summary-grid span[b-z4271ndj8v] {
    display:block;
}

.participant-activity-summary small[b-z4271ndj8v],
.completion-summary-grid small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.participant-activity-summary strong[b-z4271ndj8v],
.completion-summary-grid strong[b-z4271ndj8v] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.04rem;
}

.completion-summary-grid span[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.linked-participant-preview[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:155px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:15px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-participant-preview > img[b-z4271ndj8v] {
    width:155px;
    height:155px;
    border-radius:22px;
    object-fit:cover;
}

.linked-participant-preview small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-participant-preview h3[b-z4271ndj8v] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.25rem;
}

.linked-participant-preview p[b-z4271ndj8v] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-participant-preview > div > div[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-participant-preview > div > div span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.linked-participant-preview .special-care-note[b-z4271ndj8v] {
    color:#73569b;
    background:#f0eafb;
}

.consent-warning[b-z4271ndj8v] {
    margin-top:18px;
    font-size:.96rem !important;
}

.register-save-button[b-z4271ndj8v] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

/* ATTENDANCE */

.attendance-toolbar[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:15px;
    padding:14px 16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.attendance-toolbar strong[b-z4271ndj8v],
.attendance-toolbar span[b-z4271ndj8v] {
    display:block;
}

.attendance-toolbar strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:1.04rem;
}

.attendance-toolbar span[b-z4271ndj8v] {
    margin-top:3px;
    color:#71837a;
    font-size:.91rem;
}

.attendance-toolbar > div:last-child[b-z4271ndj8v] {
    display:flex;
    gap:8px;
}

.attendance-toolbar button[b-z4271ndj8v] {
    min-height:40px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.20);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.attendance-register-list[b-z4271ndj8v] {
    display:flex;
    max-height:55vh;
    overflow:auto;
    flex-direction:column;
    gap:10px;
    padding-right:5px;
}

.attendance-row[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:64px minmax(180px,1fr) 180px 155px minmax(180px,1fr);
    align-items:center;
    gap:11px;
    padding:12px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:15px;
    background:#fff;
}

.attendance-row.attended[b-z4271ndj8v] { border-left-color:var(--theme-primary); }
.attendance-row.late[b-z4271ndj8v] { border-left-color:#987634; }
.attendance-row.absent[b-z4271ndj8v] { border-left-color:#b54d43; }

.attendance-row > img[b-z4271ndj8v] {
    width:64px;
    height:64px;
    border-radius:17px;
    object-fit:cover;
}

.attendance-person strong[b-z4271ndj8v],
.attendance-person small[b-z4271ndj8v] {
    display:block;
}

.attendance-person strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.attendance-person small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-recorder[b-z4271ndj8v] {
    margin-top:16px !important;
}

.attendance-save-button[b-z4271ndj8v] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#225c7a) !important;
}

/* COMPLETION */

.completion-score-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.completion-score-grid article[b-z4271ndj8v] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.completion-score-grid article.watch[b-z4271ndj8v] {
    border-top-color:#987634;
}

.completion-score-grid article.risk[b-z4271ndj8v] {
    border-top-color:#b54d43;
}

.completion-score-grid small[b-z4271ndj8v],
.completion-score-grid strong[b-z4271ndj8v],
.completion-score-grid span[b-z4271ndj8v] {
    display:block;
}

.completion-score-grid small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.completion-score-grid strong[b-z4271ndj8v] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.35rem;
}

.completion-score-grid span[b-z4271ndj8v] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.completion-photo-grid[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.completion-save-button[b-z4271ndj8v] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.activity-cover-panel[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.activity-cover-photo[b-z4271ndj8v] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.activity-cover-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-cover-content small[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.activity-cover-content h2[b-z4271ndj8v] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.activity-cover-content p[b-z4271ndj8v] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.96rem;
    line-height:1.7;
}

.activity-cover-meta[b-z4271ndj8v] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.activity-cover-meta span[b-z4271ndj8v] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.activity-emblem[b-z4271ndj8v] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.activity-emblem.full[b-z4271ndj8v] { color:#987634; border-color:#f2e6c9; }
.activity-emblem.ongoing[b-z4271ndj8v] { color:#2f789f; border-color:#d8eaf2; }
.activity-emblem.completed[b-z4271ndj8v] { color:#73569b; border-color:#e8def4; }
.activity-emblem.postponed[b-z4271ndj8v] { color:#c56b2a; border-color:#f8ddc7; }
.activity-emblem.cancelled[b-z4271ndj8v] { color:#b54d43; border-color:#f4d7d3; }

.activity-emblem .mud-icon-root[b-z4271ndj8v] {
    font-size:2.3rem;
}

.activity-emblem strong[b-z4271ndj8v] {
    font-size:1.05rem;
    text-align:center;
}

.activity-emblem small[b-z4271ndj8v] {
    font-size:.90rem;
}

.activity-document-photo[b-z4271ndj8v] {
    width:128px;
    height:96px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:22px;
    background:#e7f5ef;
}

.activity-document-photo img[b-z4271ndj8v] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-register-button[b-z4271ndj8v] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.view-attendance-button[b-z4271ndj8v] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-complete-button[b-z4271ndj8v] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.result-score-strip[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

.result-score-strip article[b-z4271ndj8v] {
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.result-score-strip small[b-z4271ndj8v],
.result-score-strip strong[b-z4271ndj8v] {
    display:block;
}

.result-score-strip small[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.result-score-strip strong[b-z4271ndj8v] {
    margin-top:5px;
    color:var(--theme-primary);
    font-size:1.16rem;
}

.participant-history-panel[b-z4271ndj8v] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.participant-card-list[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.participant-card[b-z4271ndj8v] {
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    gap:12px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:14px;
    background:#f7fbf8;
}

.participant-card.attended[b-z4271ndj8v] { border-left-color:var(--theme-primary); }
.participant-card.late[b-z4271ndj8v] { border-left-color:#987634; }
.participant-card.absent[b-z4271ndj8v] { border-left-color:#b54d43; }

.participant-card > img[b-z4271ndj8v] {
    width:70px;
    height:70px;
    border-radius:18px;
    object-fit:cover;
}

.participant-card > div > div[b-z4271ndj8v] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.participant-card strong[b-z4271ndj8v] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.participant-card p[b-z4271ndj8v],
.participant-card em[b-z4271ndj8v] {
    color:#71837a;
    font-size:.90rem;
}

.participant-card p[b-z4271ndj8v] {
    margin:5px 0;
}

.participant-card em[b-z4271ndj8v] {
    color:var(--theme-primary);
    font-style:normal;
}

.attendance-chip.attended[b-z4271ndj8v] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.attendance-chip.late[b-z4271ndj8v] {
    color:#987634;
    background:#fff4df;
}

.attendance-chip.absent[b-z4271ndj8v] {
    color:#b54d43;
    background:#fff0ee;
}

.attendance-chip.not-recorded[b-z4271ndj8v] {
    color:#687872;
    background:#edf1ef;
}

.history-empty[b-z4271ndj8v] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.cover > span[b-z4271ndj8v] { background:rgba(10,114,87,.90); }
.attachment-card.venue > span[b-z4271ndj8v] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }
.attachment-card.schedule > span[b-z4271ndj8v] { background:rgba(152,118,52,.90); }
.attachment-card.safety > span[b-z4271ndj8v] { background:rgba(181,77,67,.90); }
.attachment-card.result > span[b-z4271ndj8v] { background:rgba(57,121,79,.90); }
.attachment-card.report > span[b-z4271ndj8v] { background:rgba(115,86,155,.90); }

/* LARGE TEXT */

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.75 !important;
}

.activity-page[b-z4271ndj8v]  .activity-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.activity-page[b-z4271ndj8v]  .mud-input,
.activity-page[b-z4271ndj8v]  .mud-select-input {
    font-size:1.07rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.activity-page[b-z4271ndj8v]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.activity-page[b-z4271ndj8v]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1650px) {
    .category-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-upload-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width:1500px) {
    .status-overview[b-z4271ndj8v] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-metric-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .activity-cover-panel[b-z4271ndj8v] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1150px) {
    .activity-upload-grid[b-z4271ndj8v],
    .participant-card-list[b-z4271ndj8v] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attendance-row[b-z4271ndj8v] {
        grid-template-columns:60px minmax(180px,1fr) 170px;
    }

    .attendance-time-field[b-z4271ndj8v],
    .attendance-note-field[b-z4271ndj8v] {
        grid-column:auto / span 1;
    }

    .activity-cover-panel[b-z4271ndj8v] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .activity-emblem[b-z4271ndj8v] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-z4271ndj8v],
    .category-overview[b-z4271ndj8v],
    .follow-grid[b-z4271ndj8v],
    .activity-metric-grid[b-z4271ndj8v],
    .reference-grid[b-z4271ndj8v],
    .measurement-document-grid[b-z4271ndj8v],
    .activity-preview-grid[b-z4271ndj8v],
    .participant-activity-summary[b-z4271ndj8v],
    .completion-summary-grid[b-z4271ndj8v],
    .completion-score-grid[b-z4271ndj8v],
    .completion-photo-grid[b-z4271ndj8v],
    .activity-upload-grid[b-z4271ndj8v],
    .participant-card-list[b-z4271ndj8v],
    .result-score-strip[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview > img[b-z4271ndj8v] {
        width:100%;
        height:240px;
    }

    .attendance-toolbar[b-z4271ndj8v] {
        align-items:flex-start;
        flex-direction:column;
    }

    .attendance-row[b-z4271ndj8v] {
        grid-template-columns:58px minmax(0,1fr);
    }

    .attendance-status-select[b-z4271ndj8v],
    .attendance-time-field[b-z4271ndj8v],
    .attendance-note-field[b-z4271ndj8v] {
        grid-column:1 / -1;
    }

    .activity-cover-panel[b-z4271ndj8v] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-cover-photo[b-z4271ndj8v] {
        height:250px;
    }

    .activity-page[b-z4271ndj8v]  .activity-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .activity-form-modal[b-z4271ndj8v],
    .participant-form-modal[b-z4271ndj8v],
    .attendance-form-modal[b-z4271ndj8v],
    .completion-form-modal[b-z4271ndj8v],
    .activity-view-modal[b-z4271ndj8v] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #activity-profile-print-area[b-z4271ndj8v],
    #activity-profile-print-area *[b-z4271ndj8v] {
        visibility:visible !important;
    }

    #activity-profile-print-area[b-z4271ndj8v] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .activity-view-modal[b-z4271ndj8v] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-z4271ndj8v],
    .document-status-strip[b-z4271ndj8v],
    .activity-cover-panel[b-z4271ndj8v],
    .document-section[b-z4271ndj8v],
    .document-footer[b-z4271ndj8v] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/06EducationandActivities/EducationScholarships.razor.rz.scp.css */
:root[b-pha9p4nhps] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.scholarship-page[b-pha9p4nhps] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.scholarship-hero[b-pha9p4nhps] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-pha9p4nhps] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-pha9p4nhps] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-pha9p4nhps],
.hero-action-panel[b-pha9p4nhps] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-pha9p4nhps] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-pha9p4nhps] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-pha9p4nhps] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-pha9p4nhps] {
    color: #d8ede6;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-pha9p4nhps] {
    margin-top: 3px;
    font-size: .94rem;
}

.scholarship-hero h1[b-pha9p4nhps] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.scholarship-hero p[b-pha9p4nhps] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-pha9p4nhps] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .90rem;
    font-weight: 650;
}

.hero-action-panel[b-pha9p4nhps] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-pha9p4nhps] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-pha9p4nhps] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-pha9p4nhps] {
    font-size: .90rem;
}

.hero-status small[b-pha9p4nhps] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .90rem;
}

.scholarship-page[b-pha9p4nhps]  .hero-add-button,
.scholarship-page[b-pha9p4nhps]  .toolbar-add-button,
.scholarship-page[b-pha9p4nhps]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.scholarship-page[b-pha9p4nhps]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-pha9p4nhps],
.hero-refresh-button[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-pha9p4nhps] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-pha9p4nhps] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-pha9p4nhps] {
    opacity: .55;
    cursor: wait;
}

.scholarship-page[b-pha9p4nhps]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.scholarship-page[b-pha9p4nhps]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-pha9p4nhps] {
    margin-top: 2px !important;
}

.summary-card[b-pha9p4nhps] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-pha9p4nhps] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-pha9p4nhps] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-pha9p4nhps] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-pha9p4nhps] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-pha9p4nhps] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-pha9p4nhps] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-pha9p4nhps] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-pha9p4nhps] {
    color: #788982;
    font-size: .90rem;
    font-weight: 650;
}

.summary-card p[b-pha9p4nhps] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-pha9p4nhps] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-pha9p4nhps] {
    color: #798a83;
    font-size: .90rem;
}

.summary-card em[b-pha9p4nhps] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-pha9p4nhps],
.status-overview-card.selected[b-pha9p4nhps] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-pha9p4nhps] {
    background: #f5faf7;
}

.status-overview-card > span[b-pha9p4nhps] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-pha9p4nhps] { background:#687872; }
.status-overview-card.reviewing > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.difference > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.approved > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.closed > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.voided > span[b-pha9p4nhps] { background:#687872; }
.status-overview-card.today > span[b-pha9p4nhps] { background:#73569b; }

.status-overview-card div[b-pha9p4nhps] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-pha9p4nhps] {
    color: var(--theme-muted);
    font-size: .90rem;
}

.status-overview-card strong[b-pha9p4nhps] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-pha9p4nhps] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-pha9p4nhps] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-pha9p4nhps] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-pha9p4nhps] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .90rem;
    font-weight: 700;
}

.variance-grid[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-pha9p4nhps] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-pha9p4nhps] {
    display: block;
    color: #3c5047;
    font-size: .90rem;
}

.variance-card small[b-pha9p4nhps] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .90rem;
}

.closing-progress[b-pha9p4nhps] {
    margin-top: 13px;
}

.progress-track[b-pha9p4nhps] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-pha9p4nhps] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-pha9p4nhps] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-pha9p4nhps] {
    display: block;
    color: #87958f;
    font-size: .90rem;
}

.progress-metrics strong[b-pha9p4nhps] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-pha9p4nhps],
.scholarship-list-panel[b-pha9p4nhps] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-pha9p4nhps] {
    padding: 15px;
}

.filter-heading[b-pha9p4nhps],
.list-toolbar[b-pha9p4nhps] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-pha9p4nhps],
.panel-kicker[b-pha9p4nhps] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-pha9p4nhps],
.list-toolbar h2[b-pha9p4nhps] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-pha9p4nhps],
.list-toolbar p[b-pha9p4nhps] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .90rem;
    line-height: 1.65;
}

.clear-filter-button[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-pha9p4nhps] {
    margin-top: 8px !important;
}

.scholarship-page[b-pha9p4nhps]  .premium-field,
.scholarship-page[b-pha9p4nhps]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.scholarship-page[b-pha9p4nhps]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    text-transform: none !important;
}

.filter-summary[b-pha9p4nhps] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .90rem;
}

.filter-summary strong[b-pha9p4nhps] {
    color: var(--theme-primary);
}

.scholarship-list-panel[b-pha9p4nhps] {
    overflow: hidden;
}

.list-toolbar[b-pha9p4nhps] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.scholarship-page[b-pha9p4nhps]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-pha9p4nhps] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-pha9p4nhps] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-pha9p4nhps] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-pha9p4nhps] {
    margin: 0;
    font-size: .90rem;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table {
    font-family: 'Kanit',sans-serif;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head {
    background: #f1f7f4;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .90rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-pha9p4nhps] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-pha9p4nhps] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-pha9p4nhps] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .90rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-pha9p4nhps] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .90rem;
}

.date-shift-cell[b-pha9p4nhps],
.counter-cashier-cell[b-pha9p4nhps],
.money-cell[b-pha9p4nhps],
.difference-cell[b-pha9p4nhps],
.transaction-status-cell[b-pha9p4nhps] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-pha9p4nhps] {
    min-width: 175px;
}

.date-shift-cell strong[b-pha9p4nhps],
.counter-cashier-cell strong[b-pha9p4nhps],
.money-cell strong[b-pha9p4nhps],
.difference-cell strong[b-pha9p4nhps],
.transaction-status-cell strong[b-pha9p4nhps] {
    color: #3c5047;
    font-size: .90rem;
    line-height: 1.48;
}

.date-shift-cell small[b-pha9p4nhps],
.counter-cashier-cell small[b-pha9p4nhps],
.money-cell small[b-pha9p4nhps],
.difference-cell small[b-pha9p4nhps] {
    margin-top: 3px;
    color: #84928d;
    font-size: .90rem;
}

.date-shift-cell em[b-pha9p4nhps],
.counter-cashier-cell em[b-pha9p4nhps] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-pha9p4nhps] { color:var(--theme-primary); }
.money-cell.actual strong[b-pha9p4nhps] { color:#2f789f; }

.difference-cell.matched strong[b-pha9p4nhps] { color:#34734b; }
.difference-cell.over strong[b-pha9p4nhps] { color:#987634; }
.difference-cell.short strong[b-pha9p4nhps] { color:#b54d43; }

.status-chip[b-pha9p4nhps],
.match-chip[b-pha9p4nhps] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .90rem;
    font-weight: 700;
}

.status-chip i[b-pha9p4nhps] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.difference[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-pha9p4nhps] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-pha9p4nhps] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.scholarship-page[b-pha9p4nhps]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.scholarship-page[b-pha9p4nhps]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.scholarship-page[b-pha9p4nhps]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.scholarship-page[b-pha9p4nhps]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.scholarship-page[b-pha9p4nhps]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-pha9p4nhps] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-pha9p4nhps] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .90rem;
}

/* MODALS */

.modal-backdrop[b-pha9p4nhps],
.image-preview-backdrop[b-pha9p4nhps] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.scholarship-form-modal[b-pha9p4nhps],
.scholarship-view-modal[b-pha9p4nhps],
.delete-modal[b-pha9p4nhps],
.image-preview-modal[b-pha9p4nhps] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-pha9p4nhps],
.view-toolbar[b-pha9p4nhps],
.image-preview-header[b-pha9p4nhps] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-pha9p4nhps] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-pha9p4nhps] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-pha9p4nhps],
.view-toolbar small[b-pha9p4nhps],
.image-preview-header small[b-pha9p4nhps] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-pha9p4nhps],
.view-toolbar h2[b-pha9p4nhps],
.image-preview-header h3[b-pha9p4nhps] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-pha9p4nhps] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.modal-body[b-pha9p4nhps],
.view-scroll[b-pha9p4nhps] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-pha9p4nhps] {
    background: #e9efec;
}

.modal-footer[b-pha9p4nhps] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.scholarship-page[b-pha9p4nhps]  .cancel-button,
.scholarship-page[b-pha9p4nhps]  .save-button,
.scholarship-page[b-pha9p4nhps]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.form-section-title[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-pha9p4nhps] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-pha9p4nhps] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-pha9p4nhps] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.form-section-title small[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.open-transactions-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-pha9p4nhps] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-pha9p4nhps],
.calculation-heading[b-pha9p4nhps] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-pha9p4nhps],
.calculation-heading small[b-pha9p4nhps] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-pha9p4nhps],
.calculation-heading h3[b-pha9p4nhps] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-pha9p4nhps],
.calculation-heading > span[b-pha9p4nhps] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-pha9p4nhps] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-pha9p4nhps] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.source-summary-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.system-amount-grid[b-pha9p4nhps] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-pha9p4nhps] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-pha9p4nhps] {
    display:block;
    color:#84928d;
    font-size:.90rem;
}

.system-amount-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.reconciliation-calculation-preview[b-pha9p4nhps] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-pha9p4nhps] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-pha9p4nhps] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-pha9p4nhps] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-pha9p4nhps] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-pha9p4nhps] {
    display:block;
    color:#8b7b74;
    font-size:.90rem;
}

.calculation-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.90rem;
}

.calculation-grid .short span[b-pha9p4nhps],
.calculation-grid .short strong[b-pha9p4nhps],
.calculation-grid .short small[b-pha9p4nhps] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-pha9p4nhps] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-pha9p4nhps] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-pha9p4nhps] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.photo-upload-heading small[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.photo-preview[b-pha9p4nhps] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-pha9p4nhps] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-pha9p4nhps] {
    color:#40544b;
    font-size:.90rem;
}

.photo-empty small[b-pha9p4nhps] {
    font-size:.90rem;
}

.photo-upload-actions[b-pha9p4nhps] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-pha9p4nhps],
.remove-photo-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-pha9p4nhps] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-pha9p4nhps] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-pha9p4nhps] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-pha9p4nhps],
.detail-transaction-table[b-pha9p4nhps] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-pha9p4nhps],
.source-transaction-row[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-pha9p4nhps] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-pha9p4nhps],
.source-transaction-row > span[b-pha9p4nhps] {
    padding:7px;
    font-size:.90rem;
}

.source-transaction-row[b-pha9p4nhps] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-pha9p4nhps] {
    border-bottom:0;
}

.mini-photo-button[b-pha9p4nhps] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-pha9p4nhps],
.source-transaction-more[b-pha9p4nhps] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

.mock-rule-warning[b-pha9p4nhps] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.90rem !important;
}

/* VIEW & PRINT */

.scholarship-view-modal[b-pha9p4nhps] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.scholarship-page[b-pha9p4nhps]  .view-edit-button,
.scholarship-page[b-pha9p4nhps]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.scholarship-page[b-pha9p4nhps]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-scholarship-profile[b-pha9p4nhps] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-pha9p4nhps] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-pha9p4nhps] {
    text-align:center;
}

.document-organization small[b-pha9p4nhps] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-pha9p4nhps] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-pha9p4nhps] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.90rem;
}

.document-number-box[b-pha9p4nhps] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-pha9p4nhps],
.document-number-box small[b-pha9p4nhps] {
    display:block;
    color:#778980;
    font-size:.90rem;
}

.document-number-box strong[b-pha9p4nhps] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
    word-break:break-word;
}

.document-status-strip[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-pha9p4nhps] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-pha9p4nhps] {
    display:block;
    color:#83918b;
    font-size:.90rem;
}

.document-status-strip > div strong[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.90rem;
}

.scope-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-pha9p4nhps] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-pha9p4nhps] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
}

.scope-reference-box[b-pha9p4nhps] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.scope-reference-box strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.90rem;
}

.scope-reference-box small[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-pha9p4nhps],
.transaction-summary-section[b-pha9p4nhps],
.source-transaction-section[b-pha9p4nhps],
.review-section[b-pha9p4nhps] {
    margin-top:16px;
}

.section-title[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-pha9p4nhps] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.90rem;
    font-weight:800;
}

.section-title small[b-pha9p4nhps] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-pha9p4nhps] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-pha9p4nhps] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-pha9p4nhps],
.comparison-row[b-pha9p4nhps],
.comparison-total[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-pha9p4nhps] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-pha9p4nhps],
.comparison-row span[b-pha9p4nhps],
.comparison-total span[b-pha9p4nhps] {
    padding:8px 9px;
    font-size:.90rem;
}

.comparison-row[b-pha9p4nhps] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-pha9p4nhps],
.comparison-total span:not(:first-child)[b-pha9p4nhps] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-pha9p4nhps] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-pha9p4nhps] { color:#34734b; }
.difference-text.over[b-pha9p4nhps] { color:#987634; }
.difference-text.short[b-pha9p4nhps] { color:#b54d43; }

.transaction-summary-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-pha9p4nhps] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-pha9p4nhps] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-pha9p4nhps] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-pha9p4nhps] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-pha9p4nhps] { background:#f4fafc; }

.transaction-summary-grid span[b-pha9p4nhps] {
    display:block;
    color:#84928c;
    font-size:.90rem;
}

.transaction-summary-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-pha9p4nhps] {
    display:block;
    color:#798a83;
    font-size:.90rem;
}

.detail-transaction-header[b-pha9p4nhps],
.detail-transaction-row[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-pha9p4nhps] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-pha9p4nhps],
.detail-transaction-row span[b-pha9p4nhps] {
    padding:8px 7px;
    font-size:.90rem;
}

.detail-transaction-row[b-pha9p4nhps] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-pha9p4nhps] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.review-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.review-note-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-pha9p4nhps] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
}

.review-note-grid p[b-pha9p4nhps] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.document-footer[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.document-footer p[b-pha9p4nhps] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.90rem;
    line-height:1.6;
}

.qr-placeholder[b-pha9p4nhps] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-pha9p4nhps] {
    font-size:.90rem;
    font-weight:700;
}

.mock-document-label[b-pha9p4nhps] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.90rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-pha9p4nhps],
.attachment-panel[b-pha9p4nhps] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-pha9p4nhps] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-pha9p4nhps] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:700;
}

.history-list[b-pha9p4nhps] {
    display:grid;
    gap:7px;
}

.history-item[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-pha9p4nhps] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-pha9p4nhps] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-pha9p4nhps] {
    color:#3c5047;
    font-size:.90rem;
}

.history-item small[b-pha9p4nhps],
.history-item em[b-pha9p4nhps] {
    color:#84928d;
    font-size:.90rem;
    font-style:normal;
}

.history-item p[b-pha9p4nhps] {
    margin:4px 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.55;
}

.attachment-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-pha9p4nhps] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-pha9p4nhps] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-pha9p4nhps] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-pha9p4nhps] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-pha9p4nhps] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-pha9p4nhps] { background:rgba(52,115,75,.89); }

.attachment-empty[b-pha9p4nhps] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-pha9p4nhps] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-pha9p4nhps] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-pha9p4nhps] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-pha9p4nhps] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-pha9p4nhps] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-pha9p4nhps] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-pha9p4nhps] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.7;
}

.delete-modal p strong[b-pha9p4nhps] {
    color:#b54d43;
}

.delete-warning[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.90rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-pha9p4nhps] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.scholarship-page[b-pha9p4nhps]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .scholarship-hero[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-pha9p4nhps] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-pha9p4nhps] {
        grid-column:1 / -1;
    }

    .document-header[b-pha9p4nhps] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-pha9p4nhps] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .scholarship-page[b-pha9p4nhps] {
        padding-top:10px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-container {
        padding-inline:10px !important;
    }

    .scholarship-hero[b-pha9p4nhps] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-pha9p4nhps],
    .list-toolbar[b-pha9p4nhps],
    .source-summary-heading[b-pha9p4nhps],
    .calculation-heading[b-pha9p4nhps],
    .view-toolbar[b-pha9p4nhps],
    .section-heading[b-pha9p4nhps] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-pha9p4nhps],
    .variance-grid[b-pha9p4nhps],
    .progress-metrics[b-pha9p4nhps],
    .source-summary-grid[b-pha9p4nhps],
    .system-amount-grid[b-pha9p4nhps],
    .calculation-grid[b-pha9p4nhps],
    .photo-upload-grid[b-pha9p4nhps],
    .transaction-summary-grid[b-pha9p4nhps],
    .review-grid[b-pha9p4nhps],
    .review-note-grid[b-pha9p4nhps],
    .attachment-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-pha9p4nhps] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-pha9p4nhps] {
        width:100%;
    }

    .print-scholarship-profile[b-pha9p4nhps] {
        padding:22px 18px;
    }

    .document-footer[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-pha9p4nhps] {
        grid-column:auto;
    }

    .status-overview[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-pha9p4nhps] {
        width:100%;
    }

    .document-header[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-pha9p4nhps] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-pha9p4nhps] {
        visibility:hidden !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-pha9p4nhps] {
        display:none !important;
    }

    .modal-backdrop[b-pha9p4nhps],
    .scholarship-view-modal[b-pha9p4nhps],
    .view-scroll[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .scope-panel[b-pha9p4nhps],
    .amount-comparison-section[b-pha9p4nhps],
    .transaction-summary-section[b-pha9p4nhps],
    .source-transaction-section[b-pha9p4nhps],
    .review-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }

    .mock-document-label[b-pha9p4nhps] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-pha9p4nhps] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.scholarship-page[b-pha9p4nhps]  .hero-add-button,
.scholarship-page[b-pha9p4nhps]  .toolbar-add-button,
.scholarship-page[b-pha9p4nhps]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.confirmed > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.checked-in > span[b-pha9p4nhps] { background:#73569b; }
.status-overview-card.in-service > span[b-pha9p4nhps] { background:#c46a2b; }
.status-overview-card.completed > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.cancelled > span[b-pha9p4nhps] { background:#b54d43; }

.service-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-pha9p4nhps],
.service-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-pha9p4nhps] {
    background:#f4faf7;
}

.service-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-pha9p4nhps] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.service-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-pha9p4nhps] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-pha9p4nhps] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.focus-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.90rem;
}

/* TABLE */

.citizen-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-pha9p4nhps] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.citizen-photo-cell small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.90rem;
}

.appointment-time-cell[b-pha9p4nhps],
.service-unit-cell[b-pha9p4nhps],
.provider-location-cell[b-pha9p4nhps],
.queue-priority-cell[b-pha9p4nhps],
.reason-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-pha9p4nhps],
.reason-cell[b-pha9p4nhps] {
    min-width:180px;
}

.appointment-time-cell strong[b-pha9p4nhps],
.service-unit-cell strong[b-pha9p4nhps],
.provider-location-cell strong[b-pha9p4nhps],
.queue-priority-cell strong[b-pha9p4nhps],
.reason-cell strong[b-pha9p4nhps] {
    color:#3c5047;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell small[b-pha9p4nhps],
.service-unit-cell small[b-pha9p4nhps],
.provider-location-cell small[b-pha9p4nhps],
.queue-priority-cell small[b-pha9p4nhps],
.reason-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell em[b-pha9p4nhps],
.provider-location-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-pha9p4nhps],
.priority-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-pha9p4nhps] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-pha9p4nhps] { color:#987634; background:#fff4df; }

.priority-chip[b-pha9p4nhps] {
    margin-top:5px;
}

.priority-chip.normal[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-pha9p4nhps] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-pha9p4nhps] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-pha9p4nhps] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-pha9p4nhps] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.identity-chip[b-pha9p4nhps] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.identity-chip.verified[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-pha9p4nhps],
.identity-chip.not-found[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-pha9p4nhps] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.citizen-source-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.citizen-address[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.90rem;
}

.citizen-source-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-pha9p4nhps],
.citizen-source-actions a[b-pha9p4nhps] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-pha9p4nhps] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-pha9p4nhps] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-pha9p4nhps] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.preview-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.consent-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-pha9p4nhps] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-pha9p4nhps] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-pha9p4nhps] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-pha9p4nhps] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-pha9p4nhps] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-pha9p4nhps] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-pha9p4nhps] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-pha9p4nhps] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.5;
}

.identity-box[b-pha9p4nhps] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-pha9p4nhps],
.identity-box small[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.identity-box strong[b-pha9p4nhps] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
}

.service-section[b-pha9p4nhps],
.reason-section[b-pha9p4nhps],
.reminder-section[b-pha9p4nhps] {
    margin-top:16px;
}

.reference-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-pha9p4nhps] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-pha9p4nhps],
.timeline-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.reference-grid strong[b-pha9p4nhps],
.timeline-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.note-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-pha9p4nhps] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-pha9p4nhps] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.note-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.note-grid p[b-pha9p4nhps] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.timeline-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-pha9p4nhps] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.90rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-pha9p4nhps] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-pha9p4nhps] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-pha9p4nhps],
    .preview-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-pha9p4nhps] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-pha9p4nhps] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-pha9p4nhps] {
        grid-column:1 / -1;
    }

    .reference-grid[b-pha9p4nhps],
    .timeline-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-pha9p4nhps],
    .focus-grid[b-pha9p4nhps],
    .citizen-source-grid[b-pha9p4nhps],
    .preview-grid[b-pha9p4nhps],
    .consent-grid[b-pha9p4nhps],
    .source-photo-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .note-grid[b-pha9p4nhps],
    .timeline-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-pha9p4nhps] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-pha9p4nhps] {
        margin:0 auto;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .service-section[b-pha9p4nhps],
    .reason-section[b-pha9p4nhps],
    .reminder-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size: 16px;
    line-height: 1.55;
}

.scholarship-page[b-pha9p4nhps]  .mud-typography,
.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-input-label,
.scholarship-page[b-pha9p4nhps]  .mud-select,
.scholarship-page[b-pha9p4nhps]  .mud-list-item-text,
.scholarship-page[b-pha9p4nhps]  .mud-button-label,
.scholarship-page[b-pha9p4nhps]  .mud-table-cell,
.scholarship-page[b-pha9p4nhps]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size: .92rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size: .90rem !important;
    font-weight: 600 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size: .90rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size: .90rem !important;
    font-weight: 700 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .90rem !important;
    line-height: 1.55 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .90rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-pha9p4nhps] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-pha9p4nhps] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-pha9p4nhps] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-pha9p4nhps] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-pha9p4nhps] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-pha9p4nhps] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-pha9p4nhps] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-pha9p4nhps] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-pha9p4nhps],
.scholarship-list-panel[b-pha9p4nhps],
.insight-panel[b-pha9p4nhps] {
    border-radius: 20px;
}

.filter-panel[b-pha9p4nhps] {
    padding: 20px;
}

.list-toolbar[b-pha9p4nhps] {
    padding: 19px 20px;
}

.filter-heading p[b-pha9p4nhps],
.list-toolbar p[b-pha9p4nhps] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-pha9p4nhps] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-pha9p4nhps] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-pha9p4nhps],
.service-unit-cell[b-pha9p4nhps],
.provider-location-cell[b-pha9p4nhps],
.queue-priority-cell[b-pha9p4nhps],
.reason-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    min-width: 155px;
}

.provider-location-cell[b-pha9p4nhps],
.reason-cell[b-pha9p4nhps] {
    min-width: 215px;
}

.service-chip[b-pha9p4nhps],
.priority-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.identity-chip[b-pha9p4nhps] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-pha9p4nhps] {
    min-width: 205px;
    gap: 7px;
}

.scholarship-page[b-pha9p4nhps]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-pha9p4nhps] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-pha9p4nhps],
.view-toolbar[b-pha9p4nhps],
.image-preview-header[b-pha9p4nhps] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-pha9p4nhps],
.view-scroll[b-pha9p4nhps] {
    padding: 20px;
}

.modal-footer[b-pha9p4nhps] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-pha9p4nhps] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-pha9p4nhps] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-pha9p4nhps],
.preview-grid > div[b-pha9p4nhps],
.reference-grid > div[b-pha9p4nhps],
.timeline-grid > div[b-pha9p4nhps] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-pha9p4nhps] {
    padding: 13px;
}

.photo-preview[b-pha9p4nhps] {
    min-height: 200px;
}

.photo-preview img[b-pha9p4nhps] {
    height: 200px;
}

.history-item[b-pha9p4nhps] {
    padding: 12px;
}

.attachment-card[b-pha9p4nhps],
.attachment-card img[b-pha9p4nhps] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .scholarship-page[b-pha9p4nhps] {
        font-size: 15px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .90rem !important;
    }

    .summary-card[b-pha9p4nhps] {
        min-height: 122px;
    }

    .status-overview-card[b-pha9p4nhps],
    .service-overview-card[b-pha9p4nhps] {
        min-height: 82px;
    }

    .modal-body[b-pha9p4nhps],
    .view-scroll[b-pha9p4nhps] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #scholarship-profile-print-area[b-pha9p4nhps] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #scholarship-profile-print-area h1[b-pha9p4nhps] {
        font-size: 18pt !important;
    }

    #scholarship-profile-print-area h2[b-pha9p4nhps] {
        font-size: 14pt !important;
    }

    #scholarship-profile-print-area h3[b-pha9p4nhps] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.follow-up > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.referred > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.cancelled > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.month > span[b-pha9p4nhps] { background:#73569b; }

.service-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-pha9p4nhps] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-pha9p4nhps] {
    display:block;
    color:#7c8d86;
    font-size:.90rem;
}

.care-metrics strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-pha9p4nhps],
.service-unit-cell[b-pha9p4nhps],
.provider-location-cell[b-pha9p4nhps],
.result-cell[b-pha9p4nhps],
.follow-score-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-pha9p4nhps],
.result-cell[b-pha9p4nhps] {
    min-width:230px;
}

.history-date-cell strong[b-pha9p4nhps],
.service-unit-cell strong[b-pha9p4nhps],
.provider-location-cell strong[b-pha9p4nhps],
.result-cell strong[b-pha9p4nhps],
.follow-score-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-pha9p4nhps],
.service-unit-cell small[b-pha9p4nhps],
.provider-location-cell small[b-pha9p4nhps],
.result-cell small[b-pha9p4nhps],
.follow-score-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.history-date-cell em[b-pha9p4nhps],
.provider-location-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.referred[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-pha9p4nhps] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-pha9p4nhps] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-pha9p4nhps] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-pha9p4nhps] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-pha9p4nhps] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-pha9p4nhps],
.source-actions button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-pha9p4nhps] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-pha9p4nhps] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-pha9p4nhps] {
    min-height:180px;
}

.source-photo-card img[b-pha9p4nhps] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-pha9p4nhps] {
    margin-top:18px;
}

.vital-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-pha9p4nhps],
.quality-grid > div[b-pha9p4nhps],
.follow-up-grid > div[b-pha9p4nhps] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-pha9p4nhps],
.quality-grid span[b-pha9p4nhps],
.follow-up-grid span[b-pha9p4nhps] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-pha9p4nhps],
.quality-grid strong[b-pha9p4nhps],
.follow-up-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.vital-summary[b-pha9p4nhps] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.90rem;
    line-height:1.65;
}

.follow-up-grid[b-pha9p4nhps],
.quality-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.55 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:.94rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:.92rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-pha9p4nhps] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-pha9p4nhps] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-pha9p4nhps] { background:rgba(104,120,114,.89); }

.view-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-pha9p4nhps],
    .service-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-pha9p4nhps],
    .vital-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-pha9p4nhps] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-pha9p4nhps],
    .quality-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-pha9p4nhps],
    .service-overview[b-pha9p4nhps],
    .care-metrics[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .source-photo-grid[b-pha9p4nhps],
    .vital-grid[b-pha9p4nhps],
    .follow-up-grid[b-pha9p4nhps],
    .quality-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.follow-up > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.referred > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.overdue > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.inactive > span[b-pha9p4nhps] { background:#687872; }

.risk-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-pha9p4nhps],
.risk-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.risk-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-pha9p4nhps] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-pha9p4nhps],
.care-metrics strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-pha9p4nhps],
.care-metrics small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.care-metrics[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-pha9p4nhps] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-pha9p4nhps],
.risk-adl-cell[b-pha9p4nhps],
.dependency-living-cell[b-pha9p4nhps],
.caregiver-cell[b-pha9p4nhps],
.follow-up-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-pha9p4nhps] {
    min-width:190px;
}

.register-age-cell strong[b-pha9p4nhps],
.risk-adl-cell strong[b-pha9p4nhps],
.dependency-living-cell strong[b-pha9p4nhps],
.caregiver-cell strong[b-pha9p4nhps],
.follow-up-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-pha9p4nhps],
.risk-adl-cell small[b-pha9p4nhps],
.dependency-living-cell small[b-pha9p4nhps],
.caregiver-cell small[b-pha9p4nhps],
.follow-up-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.register-age-cell em[b-pha9p4nhps],
.caregiver-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-pha9p4nhps],
.dependency-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.identity-chip[b-pha9p4nhps],
.overdue-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.risk-chip.low[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.risk-chip.high[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.active[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.referred[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.overdue-chip[b-pha9p4nhps] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-pha9p4nhps] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-pha9p4nhps] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-pha9p4nhps] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-pha9p4nhps] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-pha9p4nhps] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.6;
}

.source-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-pha9p4nhps],
.source-actions button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-pha9p4nhps] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-pha9p4nhps] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.assessment-preview strong[b-pha9p4nhps] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-pha9p4nhps],
.reference-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-pha9p4nhps],
.reference-grid > div[b-pha9p4nhps],
.care-plan-grid > div[b-pha9p4nhps] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-pha9p4nhps],
.reference-grid span[b-pha9p4nhps],
.care-plan-grid span[b-pha9p4nhps] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.assessment-grid strong[b-pha9p4nhps],
.reference-grid strong[b-pha9p4nhps],
.care-plan-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.55;
}

.care-plan-main[b-pha9p4nhps] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.90rem;
    line-height:1.7;
}

.care-plan-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.58 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:.96rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:.94rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-pha9p4nhps] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-pha9p4nhps] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-pha9p4nhps] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-pha9p4nhps] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-pha9p4nhps] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-pha9p4nhps] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-pha9p4nhps],
    .assessment-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-pha9p4nhps],
    .risk-overview[b-pha9p4nhps],
    .dependency-grid[b-pha9p4nhps],
    .care-metrics[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .assessment-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .care-plan-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:16.5px;
    line-height:1.62;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-pha9p4nhps] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-pha9p4nhps] { background:#73569b; }
.status-overview-card.field > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.completed > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.follow-up > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.referred > span[b-pha9p4nhps] { background:#b55b82; }

.visit-type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-pha9p4nhps],
.visit-type-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-pha9p4nhps] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.visit-type-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-pha9p4nhps] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-pha9p4nhps],
.care-metrics strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-pha9p4nhps],
.care-metrics small[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE */

.visit-date-cell[b-pha9p4nhps],
.visit-type-cell[b-pha9p4nhps],
.team-location-cell[b-pha9p4nhps],
.result-cell[b-pha9p4nhps],
.follow-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-pha9p4nhps],
.result-cell[b-pha9p4nhps] {
    min-width:230px;
}

.visit-date-cell strong[b-pha9p4nhps],
.visit-type-cell strong[b-pha9p4nhps],
.team-location-cell strong[b-pha9p4nhps],
.result-cell strong[b-pha9p4nhps],
.follow-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-pha9p4nhps],
.visit-type-cell small[b-pha9p4nhps],
.team-location-cell small[b-pha9p4nhps],
.result-cell small[b-pha9p4nhps],
.follow-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.58;
}

.visit-date-cell em[b-pha9p4nhps],
.team-location-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.identity-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.referred[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.priority-text[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-pha9p4nhps] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-pha9p4nhps] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-pha9p4nhps] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-pha9p4nhps] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-pha9p4nhps] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.65;
}

.source-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-pha9p4nhps] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-pha9p4nhps] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-pha9p4nhps],
.reference-grid > div[b-pha9p4nhps] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-pha9p4nhps],
.reference-grid span[b-pha9p4nhps] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-pha9p4nhps],
.reference-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:.98rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-pha9p4nhps],
    .visit-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-pha9p4nhps],
    .visit-type-overview[b-pha9p4nhps],
    .target-grid[b-pha9p4nhps],
    .care-metrics[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .vital-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.65;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-pha9p4nhps] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.review > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.eligible > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.paid > span[b-pha9p4nhps] { background:#73569b; }

.type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-pha9p4nhps],
.type-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-pha9p4nhps] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-pha9p4nhps],
.target-grid button[b-pha9p4nhps] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.budget-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

/* TABLE */

.application-no-cell[b-pha9p4nhps],
.welfare-type-cell[b-pha9p4nhps],
.household-cell[b-pha9p4nhps],
.amount-cell[b-pha9p4nhps],
.officer-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-pha9p4nhps],
.officer-cell[b-pha9p4nhps] {
    min-width:210px;
}

.application-no-cell strong[b-pha9p4nhps],
.welfare-type-cell strong[b-pha9p4nhps],
.household-cell strong[b-pha9p4nhps],
.amount-cell strong[b-pha9p4nhps],
.officer-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-pha9p4nhps],
.welfare-type-cell small[b-pha9p4nhps],
.household-cell small[b-pha9p4nhps],
.amount-cell small[b-pha9p4nhps],
.officer-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.application-no-cell em[b-pha9p4nhps],
.household-cell em[b-pha9p4nhps],
.amount-cell em[b-pha9p4nhps],
.officer-cell em[b-pha9p4nhps],
.citizen-photo-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.source-group-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.source-group-chip[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-pha9p4nhps] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-pha9p4nhps],
.amount-preview[b-pha9p4nhps] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-pha9p4nhps] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-pha9p4nhps] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-pha9p4nhps],
.amount-preview > div[b-pha9p4nhps] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-pha9p4nhps],
.amount-preview small[b-pha9p4nhps] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.amount-preview small[b-pha9p4nhps] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-pha9p4nhps],
.amount-preview strong[b-pha9p4nhps] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-pha9p4nhps],
.amount-preview span[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-document-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-pha9p4nhps] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-pha9p4nhps],
.amount-document-grid small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-document-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-pha9p4nhps] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-pha9p4nhps] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-pha9p4nhps] {
    min-height:43px;
    font-size:.90rem;
}

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-pha9p4nhps] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-pha9p4nhps],
    .type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .type-overview[b-pha9p4nhps],
    .budget-grid[b-pha9p4nhps],
    .target-grid[b-pha9p4nhps],
    .care-metrics[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .assessment-preview[b-pha9p4nhps],
    .amount-preview[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.66;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-pha9p4nhps] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.payment > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.suspended > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.expiring > span[b-pha9p4nhps] { background:#73569b; }

.target-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-pha9p4nhps],
.target-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-pha9p4nhps] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.target-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-pha9p4nhps],
.follow-grid button[b-pha9p4nhps] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-metrics strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

.follow-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-pha9p4nhps] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.registry-cell[b-pha9p4nhps],
.benefit-cell[b-pha9p4nhps],
.period-cell[b-pha9p4nhps],
.amount-cell[b-pha9p4nhps],
.payment-cycle-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-pha9p4nhps] {
    min-width:225px;
}

.registry-cell strong[b-pha9p4nhps],
.benefit-cell strong[b-pha9p4nhps],
.period-cell strong[b-pha9p4nhps],
.amount-cell strong[b-pha9p4nhps],
.payment-cycle-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-pha9p4nhps],
.benefit-cell small[b-pha9p4nhps],
.period-cell small[b-pha9p4nhps],
.amount-cell small[b-pha9p4nhps],
.payment-cycle-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.registry-cell em[b-pha9p4nhps],
.period-cell em[b-pha9p4nhps],
.amount-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-pha9p4nhps],
.cycle-chip[b-pha9p4nhps],
.verify-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.source-group-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.benefit-chip.allowance[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-pha9p4nhps] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.expired[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.source-group-chip[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-pha9p4nhps] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-pha9p4nhps] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-pha9p4nhps] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-pha9p4nhps] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-pha9p4nhps] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* LARGE MUD TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-pha9p4nhps] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-pha9p4nhps] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-pha9p4nhps],
    .target-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .target-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .condition-switch-grid[b-pha9p4nhps],
    .amount-preview[b-pha9p4nhps],
    .source-data-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .patient-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.66;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-pha9p4nhps] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-pha9p4nhps] { background:#687872; }
.status-overview-card.approval > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.processing > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.paid > span[b-pha9p4nhps] { background:#34734b; }
.status-overview-card.failed > span[b-pha9p4nhps] { background:#b54d43; }

.disbursement-progress[b-pha9p4nhps] {
    margin-top:15px;
}

.disbursement-progress > div[b-pha9p4nhps] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-pha9p4nhps],
.amount-cell[b-pha9p4nhps],
.progress-cell[b-pha9p4nhps],
.date-cell[b-pha9p4nhps],
.control-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-pha9p4nhps] {
    min-width:245px;
}

.batch-cell strong[b-pha9p4nhps],
.amount-cell strong[b-pha9p4nhps],
.progress-cell strong[b-pha9p4nhps],
.date-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-pha9p4nhps],
.amount-cell small[b-pha9p4nhps],
.progress-cell small[b-pha9p4nhps],
.date-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.batch-cell em[b-pha9p4nhps],
.amount-cell em[b-pha9p4nhps],
.date-cell em[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-pha9p4nhps] {
    min-width:180px;
}

.recipient-stack[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-pha9p4nhps],
.recipient-stack span[b-pha9p4nhps] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-pha9p4nhps] {
    margin-left:0;
}

.recipient-stack img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.recipient-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.table-progress[b-pha9p4nhps] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-pha9p4nhps],
.approval-chip[b-pha9p4nhps],
.reconcile-chip[b-pha9p4nhps],
.cycle-chip[b-pha9p4nhps],
.line-status-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.approved[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.control-cell[b-pha9p4nhps] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-pha9p4nhps] {
    align-items:center;
}

.selection-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-pha9p4nhps] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-pha9p4nhps] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-pha9p4nhps] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-pha9p4nhps] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.source-selection-summary strong[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-pha9p4nhps] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-pha9p4nhps] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-pha9p4nhps],
.source-selection-table td[b-pha9p4nhps] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.90rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-pha9p4nhps] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.90rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-pha9p4nhps] {
    background:#f0faf6;
}

.source-person-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-pha9p4nhps] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-pha9p4nhps],
.source-benefit-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-person-cell small[b-pha9p4nhps],
.source-benefit-cell small[b-pha9p4nhps],
.source-date[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.source-person-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.source-benefit-cell[b-pha9p4nhps] {
    min-width:190px;
}

.source-amount[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.bank-readiness span.ready[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.source-document-buttons[b-pha9p4nhps] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-pha9p4nhps] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-pha9p4nhps] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-pha9p4nhps] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-pha9p4nhps] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* DETAIL */

.batch-overview-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-pha9p4nhps] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-pha9p4nhps] {
    font-size:3.5rem;
}

.batch-overview-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-pha9p4nhps] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.print-line-table-wrap[b-pha9p4nhps] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-pha9p4nhps] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-pha9p4nhps],
.print-line-table td[b-pha9p4nhps] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.90rem;
    vertical-align:top;
}

.print-line-table th[b-pha9p4nhps] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-pha9p4nhps],
.print-line-table td small[b-pha9p4nhps] {
    display:block;
}

.print-line-table td small[b-pha9p4nhps] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-pha9p4nhps] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-pha9p4nhps] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-pha9p4nhps] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-pha9p4nhps] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-pha9p4nhps] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid strong[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.recipient-document-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-pha9p4nhps] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-pha9p4nhps] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-pha9p4nhps] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-pha9p4nhps] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-pha9p4nhps] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-pha9p4nhps],
    .recipient-detail-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-pha9p4nhps] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-pha9p4nhps] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .source-selection-summary[b-pha9p4nhps],
    .amount-preview[b-pha9p4nhps],
    .recipient-detail-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-pha9p4nhps] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-pha9p4nhps] {
        overflow-x:auto;
    }

    .source-selection-table[b-pha9p4nhps] {
        min-width:1050px;
    }

    .batch-overview-panel[b-pha9p4nhps],
    .recipient-detail-card[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-pha9p4nhps] {
        width:100%;
        height:190px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .batch-overview-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.66;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-pha9p4nhps],
.type-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.full > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.overflow > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.maintenance > span[b-pha9p4nhps] { background:#73569b; }

.type-overview[b-pha9p4nhps] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-pha9p4nhps],
.type-overview-card.selected[b-pha9p4nhps] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-pha9p4nhps] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-pha9p4nhps] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-pha9p4nhps] {
    margin-top:15px;
}

.fill-progress > div[b-pha9p4nhps] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-pha9p4nhps] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-pha9p4nhps] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-pha9p4nhps] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-pha9p4nhps] {
    background:#987634;
}

.map-pin.full[b-pha9p4nhps] {
    background:#c56b2a;
}

.map-pin.overflow[b-pha9p4nhps] {
    background:#b54d43;
}

.map-pin.maintenance[b-pha9p4nhps] {
    background:#73569b;
}

.map-pin.inactive[b-pha9p4nhps] {
    background:#687872;
}

.map-pin span[b-pha9p4nhps] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-pha9p4nhps] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-pha9p4nhps] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-pha9p4nhps] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-pha9p4nhps] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-pha9p4nhps] { background:#987634; }
.map-board-legend i.full[b-pha9p4nhps] { background:#b54d43; }
.map-board-legend i.maintenance[b-pha9p4nhps] { background:#73569b; }

.map-board-caption[b-pha9p4nhps] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-pha9p4nhps],
.map-board-caption small[b-pha9p4nhps] {
    display:block;
}

.map-board-caption strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.point-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-pha9p4nhps] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-pha9p4nhps] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.point-photo-cell em[b-pha9p4nhps] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-pha9p4nhps],
.bin-cell[b-pha9p4nhps],
.fill-cell[b-pha9p4nhps],
.collection-cell[b-pha9p4nhps],
.sensor-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-pha9p4nhps] {
    min-width:220px;
}

.location-cell strong[b-pha9p4nhps],
.bin-cell strong[b-pha9p4nhps],
.fill-cell strong[b-pha9p4nhps],
.collection-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-pha9p4nhps],
.bin-cell small[b-pha9p4nhps],
.fill-cell small[b-pha9p4nhps],
.collection-cell small[b-pha9p4nhps],
.sensor-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.waste-type-chip[b-pha9p4nhps],
.collection-chip[b-pha9p4nhps],
.sensor-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.waste-type-chip.general[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.status-chip.active[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.full[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.table-progress[b-pha9p4nhps] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-pha9p4nhps] { background:var(--theme-primary); }
.table-progress.medium span[b-pha9p4nhps] { background:#2f789f; }
.table-progress.high span[b-pha9p4nhps] { background:#987634; }
.table-progress.critical span[b-pha9p4nhps] { background:#b54d43; }

.repair-alert[b-pha9p4nhps],
.clean-alert[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-pha9p4nhps] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-pha9p4nhps] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-pha9p4nhps] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.fill-preview-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-pha9p4nhps] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-pha9p4nhps] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-pha9p4nhps] { background:#2f789f; }
.fill-preview-bin.high span[b-pha9p4nhps] { background:#987634; }
.fill-preview-bin.critical span[b-pha9p4nhps] { background:#b54d43; }

.fill-preview-bin strong[b-pha9p4nhps] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-pha9p4nhps] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-pha9p4nhps] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.source-photo-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-pha9p4nhps] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-pha9p4nhps] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.large-fill-indicator[b-pha9p4nhps] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-pha9p4nhps] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-pha9p4nhps] { background:#2f789f; }
.large-fill-indicator.high > span[b-pha9p4nhps] { background:#987634; }
.large-fill-indicator.critical > span[b-pha9p4nhps] { background:#b54d43; }

.large-fill-indicator strong[b-pha9p4nhps],
.large-fill-indicator small[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-pha9p4nhps] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-pha9p4nhps] {
    font-size:.90rem;
}

.detail-map-preview[b-pha9p4nhps] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-pha9p4nhps] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-pha9p4nhps] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-pha9p4nhps] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-pha9p4nhps] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.collection-history-list small[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-button.collect[b-pha9p4nhps] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-pha9p4nhps] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-pha9p4nhps],
    .type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-pha9p4nhps] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-pha9p4nhps] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-pha9p4nhps] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .type-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .condition-switch-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-pha9p4nhps],
    .fill-preview-card[b-pha9p4nhps],
    .coordinate-preview[b-pha9p4nhps],
    .collection-history-list article[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-pha9p4nhps] {
        min-height:240px;
    }

    .large-fill-indicator[b-pha9p4nhps],
    .fill-preview-bin[b-pha9p4nhps],
    .coordinate-pin[b-pha9p4nhps] {
        margin:0 auto;
    }

    .map-board[b-pha9p4nhps] {
        min-height:500px;
    }

    .map-pin[b-pha9p4nhps] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .point-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.68;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.received > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.inspecting > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.in-progress > span[b-pha9p4nhps] { background:#73569b; }
.status-overview-card.resolved > span[b-pha9p4nhps] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-pha9p4nhps]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-pha9p4nhps],
.pollution-type-card.selected[b-pha9p4nhps] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.pollution-type-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-pha9p4nhps] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-pha9p4nhps] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-pha9p4nhps] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-pha9p4nhps] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-pha9p4nhps] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-pha9p4nhps] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-pha9p4nhps] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-pha9p4nhps] {
    margin-top:18px;
}

.sla-progress > div[b-pha9p4nhps] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-pha9p4nhps] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-pha9p4nhps] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-pha9p4nhps] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-pha9p4nhps] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-pha9p4nhps] { background:#2f789f; }
.pollution-map-pin.medium[b-pha9p4nhps] { background:#987634; }
.pollution-map-pin.high[b-pha9p4nhps] { background:#c56b2a; }
.pollution-map-pin.critical[b-pha9p4nhps] { background:#b54d43; }

.pollution-map-pin span[b-pha9p4nhps] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-pha9p4nhps] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-pha9p4nhps] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-pha9p4nhps] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-pha9p4nhps] { background:#2f789f; }
.map-board-legend i.medium[b-pha9p4nhps] { background:#987634; }
.map-board-legend i.high[b-pha9p4nhps] { background:#c56b2a; }
.map-board-legend i.critical[b-pha9p4nhps] { background:#b54d43; }

.map-board-caption[b-pha9p4nhps] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-pha9p4nhps],
.map-board-caption small[b-pha9p4nhps] {
    display:block;
}

.map-board-caption strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-pha9p4nhps] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.complaint-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.type-severity-cell[b-pha9p4nhps],
.reporter-cell[b-pha9p4nhps],
.location-cell[b-pha9p4nhps],
.inspection-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-pha9p4nhps],
.location-cell[b-pha9p4nhps] {
    min-width:195px;
}

.reporter-cell strong[b-pha9p4nhps],
.location-cell strong[b-pha9p4nhps],
.inspection-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-pha9p4nhps],
.location-cell small[b-pha9p4nhps],
.inspection-cell small[b-pha9p4nhps],
.status-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.reporter-cell em[b-pha9p4nhps],
.location-cell em[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.pollution-type-chip[b-pha9p4nhps],
.severity-chip[b-pha9p4nhps],
.inspection-chip[b-pha9p4nhps],
.status-chip[b-pha9p4nhps],
.overdue-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.pollution-type-chip.air[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.severity-chip.high[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-pha9p4nhps] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-pha9p4nhps] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-pha9p4nhps] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* FORM */

.anonymous-switch-card[b-pha9p4nhps] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-pha9p4nhps],
.anonymous-switch-card small[b-pha9p4nhps] {
    display:block;
}

.anonymous-switch-card strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.coordinate-preview[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-pha9p4nhps],
.map-board-grid[b-pha9p4nhps] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-pha9p4nhps] { background:#c56b2a; }
.coordinate-pin.critical[b-pha9p4nhps] { background:#b54d43; }
.coordinate-pin.medium[b-pha9p4nhps] { background:#987634; }

.coordinate-pin .mud-icon-root[b-pha9p4nhps] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-pha9p4nhps] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.source-point-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-pha9p4nhps] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-condition-row[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:750;
}

.source-condition-row span.warning[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-pha9p4nhps] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-pha9p4nhps] { color:#987634; background:#fff4df; }

.measurement-preview small[b-pha9p4nhps],
.measurement-preview strong[b-pha9p4nhps],
.measurement-preview em[b-pha9p4nhps] {
    display:block;
}

.measurement-preview small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-preview strong[b-pha9p4nhps] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.source-photo-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-pha9p4nhps] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-pha9p4nhps] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.severity-emblem[b-pha9p4nhps] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-pha9p4nhps] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-pha9p4nhps] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-pha9p4nhps] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-pha9p4nhps] {
    font-size:2.25rem;
}

.severity-emblem strong[b-pha9p4nhps] {
    font-size:1.10rem;
}

.severity-emblem small[b-pha9p4nhps] {
    font-size:.90rem;
}

.measurement-document-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-pha9p4nhps] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-pha9p4nhps],
.measurement-document-grid strong[b-pha9p4nhps] {
    display:block;
}

.measurement-document-grid span[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-pha9p4nhps] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-pha9p4nhps] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-pha9p4nhps] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-pha9p4nhps] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-pha9p4nhps] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-pha9p4nhps] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-pha9p4nhps] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-pha9p4nhps] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-pha9p4nhps] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-pha9p4nhps] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-pha9p4nhps] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-pha9p4nhps] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-pha9p4nhps] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-pha9p4nhps] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-pha9p4nhps],
    .source-photo-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-pha9p4nhps],
    .source-photo-preview button[b-pha9p4nhps] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .pollution-type-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .measurement-preview[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-pha9p4nhps],
    .coordinate-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-pha9p4nhps] {
        height:250px;
    }

    .coordinate-pin[b-pha9p4nhps] {
        margin:0 auto;
    }

    .pollution-map-board[b-pha9p4nhps] {
        min-height:500px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .complaint-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.68;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.polluted > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.critical > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.restoring > span[b-pha9p4nhps] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-pha9p4nhps]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-pha9p4nhps],
.institution-type-card.selected[b-pha9p4nhps] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-pha9p4nhps] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-pha9p4nhps] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-pha9p4nhps] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-pha9p4nhps] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-pha9p4nhps] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-pha9p4nhps] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-pha9p4nhps] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.scholarship-metric-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.scholarship-metric-grid article[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.scholarship-metric-grid article > span[b-pha9p4nhps] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.scholarship-metric-grid article.ph > span[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.scholarship-metric-grid article.do > span[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.scholarship-metric-grid article.bod > span[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.scholarship-metric-grid article.turbidity > span[b-pha9p4nhps] { color:#987634; background:#fff4df; }

.scholarship-metric-grid small[b-pha9p4nhps],
.scholarship-metric-grid strong[b-pha9p4nhps],
.scholarship-metric-grid em[b-pha9p4nhps] {
    display:block;
}

.scholarship-metric-grid small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.scholarship-metric-grid strong[b-pha9p4nhps] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.scholarship-metric-grid em[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-pha9p4nhps] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-pha9p4nhps] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-pha9p4nhps] { background:var(--theme-primary); }
.education-map-pin.watch[b-pha9p4nhps] { background:#987634; }
.education-map-pin.polluted[b-pha9p4nhps] { background:#c56b2a; }
.education-map-pin.critical[b-pha9p4nhps] { background:#b54d43; }
.education-map-pin.restoring[b-pha9p4nhps] { background:#73569b; }
.education-map-pin.closed[b-pha9p4nhps] { background:#687872; }

.education-map-pin span[b-pha9p4nhps] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-pha9p4nhps] { background:var(--theme-primary); }
.map-board-legend i.watch[b-pha9p4nhps] { background:#987634; }
.map-board-legend i.polluted[b-pha9p4nhps] { background:#c56b2a; }
.map-board-legend i.critical[b-pha9p4nhps] { background:#b54d43; }
.map-board-legend i.restoring[b-pha9p4nhps] { background:#73569b; }

/* TABLE */

.applicant-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.applicant-photo-mini[b-pha9p4nhps] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.applicant-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.applicant-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.applicant-photo-cell small[b-pha9p4nhps],
.applicant-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.applicant-photo-cell em[b-pha9p4nhps] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-pha9p4nhps],
.latest-progress-cell[b-pha9p4nhps],
.inspection-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-pha9p4nhps],
.quality-status-chip[b-pha9p4nhps],
.usage-chip[b-pha9p4nhps],
.lab-chip[b-pha9p4nhps],
.no-progress-chip[b-pha9p4nhps],
.overdue-chip[b-pha9p4nhps],
.follow-up-chip[b-pha9p4nhps],
.complaint-count-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.canal[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-pha9p4nhps] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.usage-chip[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-pha9p4nhps],
.inspection-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-pha9p4nhps],
.inspection-cell small[b-pha9p4nhps],
.type-level-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-pha9p4nhps] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.90rem;
}

.size-cell strong[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
}

.row-action.sample[b-pha9p4nhps] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-pha9p4nhps] { background:var(--theme-primary); }
.coordinate-pin.watch[b-pha9p4nhps] { background:#987634; }
.coordinate-pin.polluted[b-pha9p4nhps] { background:#c56b2a; }
.coordinate-pin.critical[b-pha9p4nhps] { background:#b54d43; }
.coordinate-pin.restoring[b-pha9p4nhps] { background:#73569b; }
.coordinate-pin.closed[b-pha9p4nhps] { background:#687872; }

.coordinate-pin .mud-icon-root[b-pha9p4nhps] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-pha9p4nhps] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-pha9p4nhps] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.linked-photo-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-pha9p4nhps] {
    color:#73569b;
    font-size:.90rem;
    font-weight:800;
}

.linked-photo-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-pha9p4nhps] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-photo-preview button[b-pha9p4nhps] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.review-form-modal[b-pha9p4nhps] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.review-score-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.review-score-preview article[b-pha9p4nhps] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.review-score-preview small[b-pha9p4nhps],
.review-score-preview strong[b-pha9p4nhps],
.review-score-preview span[b-pha9p4nhps] {
    display:block;
}

.review-score-preview small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-pha9p4nhps] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.review-score-preview span[b-pha9p4nhps] {
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.review-score-preview article.ph[b-pha9p4nhps] { border-top:4px solid #73569b; }
.review-score-preview article.do[b-pha9p4nhps] { border-top:4px solid #2f789f; }
.review-score-preview article.bod[b-pha9p4nhps] { border-top:4px solid #c56b2a; }
.review-score-preview article.cod[b-pha9p4nhps] { border-top:4px solid #b54d43; }
.review-score-preview article.turbidity[b-pha9p4nhps] { border-top:4px solid #987634; }
.review-score-preview article.coliform[b-pha9p4nhps] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-pha9p4nhps] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-pha9p4nhps] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-pha9p4nhps] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-pha9p4nhps] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-pha9p4nhps] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-pha9p4nhps] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-pha9p4nhps] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-pha9p4nhps] {
    font-size:2.25rem;
}

.education-emblem strong[b-pha9p4nhps] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-pha9p4nhps] {
    font-size:.90rem;
}

.measurement-document-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-pha9p4nhps] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-pha9p4nhps],
.measurement-document-grid strong[b-pha9p4nhps] {
    display:block;
}

.measurement-document-grid span[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-pha9p4nhps] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.payment-history-panel[b-pha9p4nhps],
.linked-complaint-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.payment-card-list[b-pha9p4nhps],
.linked-complaint-list[b-pha9p4nhps] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.payment-card[b-pha9p4nhps] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.payment-card.good[b-pha9p4nhps] { border-left-color:var(--theme-primary); }
.payment-card.watch[b-pha9p4nhps] { border-left-color:#987634; }
.payment-card.polluted[b-pha9p4nhps] { border-left-color:#c56b2a; }
.payment-card.critical[b-pha9p4nhps] { border-left-color:#b54d43; }
.payment-card.restoring[b-pha9p4nhps] { border-left-color:#73569b; }

.payment-card-head[b-pha9p4nhps] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.payment-card-head strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-card-head small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.payment-card-metrics[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.payment-card-metrics span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.90rem;
}

.payment-card-metrics strong[b-pha9p4nhps] {
    color:#2f789f;
}

.payment-card p[b-pha9p4nhps] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.assessment-photo-actions[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-pha9p4nhps] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

.linked-complaint-list article[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-pha9p4nhps] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.90rem;
}

.linked-complaint-list p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-complaint-list a[b-pha9p4nhps] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.90rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-pha9p4nhps] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-pha9p4nhps] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .institution-type-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .amount-document-grid[b-pha9p4nhps],
    .progress-photo-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-pha9p4nhps],
    .coordinate-preview[b-pha9p4nhps],
    .linked-complaint-list article[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-pha9p4nhps] {
        height:250px;
    }

    .coordinate-pin[b-pha9p4nhps] {
        margin:0 auto;
    }

    .education-map-board[b-pha9p4nhps] {
        min-height:500px;
    }

    .linked-complaint-list button[b-pha9p4nhps] {
        height:210px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .education-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.68;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-pha9p4nhps] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-pha9p4nhps] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.diseased > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-pha9p4nhps] { background:#b54d43; }
.status-overview-card.treatment > span[b-pha9p4nhps] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-pha9p4nhps]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-pha9p4nhps],
.institution-type-card.selected[b-pha9p4nhps] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-pha9p4nhps] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-pha9p4nhps] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-pha9p4nhps] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-pha9p4nhps] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-pha9p4nhps] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-pha9p4nhps] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-pha9p4nhps] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.scholarship-metric-grid article.carbon > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.scholarship-metric-grid article.photo > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.scholarship-metric-grid article.maintenance > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.scholarship-metric-grid article.treatment > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-pha9p4nhps] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-pha9p4nhps] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-pha9p4nhps] { background:var(--theme-primary); }
.education-map-pin.watch[b-pha9p4nhps] { background:#987634; }
.education-map-pin.diseased[b-pha9p4nhps] { background:#c56b2a; }
.education-map-pin.hazardous[b-pha9p4nhps] { background:#b54d43; }
.education-map-pin.treatment[b-pha9p4nhps] { background:#73569b; }
.education-map-pin.removed[b-pha9p4nhps] { background:#687872; }

.education-map-pin span[b-pha9p4nhps] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-pha9p4nhps] { background:var(--theme-primary); }
.map-board-legend i.watch[b-pha9p4nhps] { background:#987634; }
.map-board-legend i.diseased[b-pha9p4nhps] { background:#c56b2a; }
.map-board-legend i.hazardous[b-pha9p4nhps] { background:#b54d43; }
.map-board-legend i.treatment[b-pha9p4nhps] { background:#73569b; }

/* TABLE */

.applicant-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.applicant-photo-mini[b-pha9p4nhps] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.applicant-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.applicant-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.applicant-photo-cell small[b-pha9p4nhps],
.applicant-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.applicant-photo-cell em[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-pha9p4nhps],
.latest-progress-cell[b-pha9p4nhps],
.maintenance-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-pha9p4nhps],
.health-status-chip[b-pha9p4nhps],
.risk-chip[b-pha9p4nhps],
.health-score-chip[b-pha9p4nhps],
.no-progress-chip[b-pha9p4nhps],
.overdue-chip[b-pha9p4nhps],
.urgent-chip[b-pha9p4nhps],
.water-link-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-pha9p4nhps] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-pha9p4nhps] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.risk-chip.high[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-pha9p4nhps],
.urgent-chip[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-pha9p4nhps],
.latest-progress-cell strong[b-pha9p4nhps],
.maintenance-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-pha9p4nhps],
.latest-progress-cell small[b-pha9p4nhps],
.maintenance-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-pha9p4nhps] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.size-cell strong[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.size-cell em[b-pha9p4nhps] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.90rem;
    font-style:normal;
}

.row-action.inspect[b-pha9p4nhps] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-pha9p4nhps] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-pha9p4nhps] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* INSPECTION */

.review-form-modal[b-pha9p4nhps] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.good[b-pha9p4nhps] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.watch[b-pha9p4nhps] {
    border-top:4px solid #987634;
}

.review-score-preview article.diseased[b-pha9p4nhps],
.review-score-preview article.high[b-pha9p4nhps] {
    border-top:4px solid #c56b2a;
}

.review-score-preview article.hazardous[b-pha9p4nhps],
.review-score-preview article.critical[b-pha9p4nhps] {
    border-top:4px solid #b54d43;
}

.review-score-preview article.medium[b-pha9p4nhps] {
    border-top:4px solid #987634;
}

.review-score-preview article.low[b-pha9p4nhps] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-pha9p4nhps] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-pha9p4nhps] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-pha9p4nhps] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-pha9p4nhps] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-pha9p4nhps] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-pha9p4nhps] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-pha9p4nhps] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-pha9p4nhps] {
    font-size:2.25rem;
}

.education-emblem strong[b-pha9p4nhps] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-pha9p4nhps] {
    font-size:.90rem;
}

.payment-history-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.payment-card[b-pha9p4nhps] {
    border-left:5px solid var(--theme-primary);
}

.payment-card.medium[b-pha9p4nhps],
.payment-card.watch[b-pha9p4nhps] {
    border-left-color:#987634;
}

.payment-card.high[b-pha9p4nhps],
.payment-card.diseased[b-pha9p4nhps] {
    border-left-color:#c56b2a;
}

.payment-card.critical[b-pha9p4nhps],
.payment-card.hazardous[b-pha9p4nhps] {
    border-left-color:#b54d43;
}

.view-review-button[b-pha9p4nhps] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-pha9p4nhps] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-pha9p4nhps] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-pha9p4nhps],
    .source-photo-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .institution-type-overview[b-pha9p4nhps],
    .amount-metrics[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .progress-photo-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-pha9p4nhps],
    .coordinate-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-pha9p4nhps] {
        height:250px;
    }

    .coordinate-pin[b-pha9p4nhps] {
        margin:0 auto;
    }

    .education-map-board[b-pha9p4nhps] {
        min-height:500px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .education-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.72;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.full > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.maintenance > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.review > span[b-pha9p4nhps] { background:#73569b; }
.status-overview-card.temp-closed > span[b-pha9p4nhps] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-pha9p4nhps] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-pha9p4nhps]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-pha9p4nhps],
.institution-type-card.selected[b-pha9p4nhps] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-pha9p4nhps] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-pha9p4nhps] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-pha9p4nhps] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-pha9p4nhps] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-pha9p4nhps] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-pha9p4nhps] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-pha9p4nhps] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-pha9p4nhps] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-pha9p4nhps] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-pha9p4nhps] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.scholarship-metric-grid article.attendance > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.scholarship-metric-grid article.health > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.scholarship-metric-grid article.assessment > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-metric-grid article.green > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-pha9p4nhps] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-pha9p4nhps] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-pha9p4nhps] { background:var(--theme-primary); }
.education-map-pin.full[b-pha9p4nhps] { background:#987634; }
.education-map-pin.maintenance[b-pha9p4nhps] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-pha9p4nhps] { background:#73569b; }
.education-map-pin.temp-closed[b-pha9p4nhps],
.education-map-pin.inactive[b-pha9p4nhps] { background:#b54d43; }

.education-map-pin span[b-pha9p4nhps] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-pha9p4nhps] { background:var(--theme-primary); }
.map-board-legend i.full[b-pha9p4nhps] { background:#987634; }
.map-board-legend i.maintenance[b-pha9p4nhps] { background:#c56b2a; }
.map-board-legend i.review[b-pha9p4nhps] { background:#73569b; }
.map-board-legend i.closed[b-pha9p4nhps] { background:#b54d43; }

/* TABLE */

.applicant-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.applicant-photo-mini[b-pha9p4nhps] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.applicant-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.applicant-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.applicant-photo-cell small[b-pha9p4nhps],
.applicant-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.applicant-photo-cell em[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-pha9p4nhps],
.latest-progress-cell[b-pha9p4nhps],
.assessment-date-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-pha9p4nhps],
.institution-status-chip[b-pha9p4nhps],
.accreditation-chip[b-pha9p4nhps],
.assessment-result-chip[b-pha9p4nhps],
.no-progress-chip[b-pha9p4nhps],
.overdue-chip[b-pha9p4nhps],
.due-chip[b-pha9p4nhps],
.green-link-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-pha9p4nhps],
.assessment-result-chip.passed[b-pha9p4nhps],
.assessment-result-chip.excellent[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-pha9p4nhps],
.assessment-result-chip.conditional[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-pha9p4nhps],
.assessment-result-chip.review[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-pha9p4nhps],
.accreditation-chip.not-assessed[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-pha9p4nhps],
.latest-progress-cell small[b-pha9p4nhps],
.assessment-date-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.latest-progress-cell strong[b-pha9p4nhps],
.assessment-date-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-pha9p4nhps] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.occupancy-track[b-pha9p4nhps] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.personnel-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-pha9p4nhps] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.personnel-cell strong[b-pha9p4nhps] {
    color:var(--theme-primary);
}

.personnel-cell em[b-pha9p4nhps] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.90rem;
    font-style:normal;
}

.row-action.assess[b-pha9p4nhps] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-pha9p4nhps] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-pha9p4nhps],
.capacity-preview strong[b-pha9p4nhps] {
    display:block;
}

.capacity-preview small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.capacity-preview strong[b-pha9p4nhps] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-pha9p4nhps] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.review-form-modal[b-pha9p4nhps] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.excellent[b-pha9p4nhps],
.review-score-preview article.passed[b-pha9p4nhps] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.conditional[b-pha9p4nhps] {
    border-top:4px solid #987634;
}

.review-score-preview article.review[b-pha9p4nhps] {
    border-top:4px solid #b54d43;
}

.payment-card.excellent[b-pha9p4nhps],
.payment-card.passed[b-pha9p4nhps] {
    border-left-color:var(--theme-primary);
}

.payment-card.conditional[b-pha9p4nhps] {
    border-left-color:#987634;
}

.payment-card.review[b-pha9p4nhps] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-pha9p4nhps] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-pha9p4nhps] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-pha9p4nhps] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-pha9p4nhps] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-pha9p4nhps] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-pha9p4nhps] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-pha9p4nhps] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-pha9p4nhps] {
    font-size:2.25rem;
}

.education-emblem strong[b-pha9p4nhps] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-pha9p4nhps] {
    font-size:.90rem;
}

.payment-history-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-review-button[b-pha9p4nhps] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-pha9p4nhps] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-pha9p4nhps] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-pha9p4nhps] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.04rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-pha9p4nhps],
    .source-photo-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .institution-type-overview[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .progress-photo-grid[b-pha9p4nhps],
    .capacity-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-pha9p4nhps] {
        height:250px;
    }

    .education-map-board[b-pha9p4nhps] {
        min-height:500px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .education-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.74;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-pha9p4nhps] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-pha9p4nhps] { background:var(--theme-primary); }
.status-overview-card.new > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.watch > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.transferred > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.graduated > span[b-pha9p4nhps] { background:#73569b; }

.scholarship-metric-grid article.new > span[b-pha9p4nhps] {
    color:#c56b2a;
    background:#fff0df;
}

.scholarship-metric-grid article.health > span[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.scholarship-metric-grid article.scholarship > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.scholarship-metric-grid article.photo > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.applicant-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.applicant-photo-mini[b-pha9p4nhps] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.applicant-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.applicant-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.applicant-photo-cell small[b-pha9p4nhps],
.applicant-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.applicant-photo-cell em[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-pha9p4nhps],
.latest-progress-cell[b-pha9p4nhps],
.care-cell[b-pha9p4nhps] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-pha9p4nhps],
.student-status-chip[b-pha9p4nhps],
.health-chip[b-pha9p4nhps],
.special-care-chip[b-pha9p4nhps],
.scholarship-chip[b-pha9p4nhps],
.learning-chip[b-pha9p4nhps],
.no-progress-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.school-chip[b-pha9p4nhps] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-pha9p4nhps] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.health-chip.referred[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-pha9p4nhps],
.learning-chip.good[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-pha9p4nhps] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-pha9p4nhps] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-pha9p4nhps],
.latest-progress-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-pha9p4nhps],
.latest-progress-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-cell[b-pha9p4nhps] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.progress-track[b-pha9p4nhps] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-pha9p4nhps] { background:var(--theme-primary); }
.progress-track i.watch[b-pha9p4nhps] { background:#987634; }
.progress-track i.risk[b-pha9p4nhps] { background:#b54d43; }

.teacher-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-pha9p4nhps] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-pha9p4nhps],
.teacher-cell small[b-pha9p4nhps] {
    display:block;
}

.teacher-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.progress[b-pha9p4nhps] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-pha9p4nhps] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-pha9p4nhps] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-pha9p4nhps] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.review-form-modal[b-pha9p4nhps] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.review-score-preview article[b-pha9p4nhps] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.watch[b-pha9p4nhps],
.review-score-preview article.pass[b-pha9p4nhps] {
    border-top-color:#987634;
}

.review-score-preview article.risk[b-pha9p4nhps],
.review-score-preview article.support[b-pha9p4nhps] {
    border-top-color:#b54d43;
}

.review-score-preview small[b-pha9p4nhps],
.review-score-preview strong[b-pha9p4nhps],
.review-score-preview span[b-pha9p4nhps] {
    display:block;
}

.review-score-preview small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-pha9p4nhps] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.review-score-preview span[b-pha9p4nhps] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.payment-history-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.payment-card[b-pha9p4nhps] {
    border-left:5px solid var(--theme-primary);
}

.payment-card.pass[b-pha9p4nhps] {
    border-left-color:#2f789f;
}

.payment-card.support[b-pha9p4nhps] {
    border-left-color:#b54d43;
}

.view-review-button[b-pha9p4nhps] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.scholarship-student-photo[b-pha9p4nhps] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.scholarship-student-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-pha9p4nhps] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.05rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .scholarship-metric-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .progress-photo-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .scholarship-form-modal[b-pha9p4nhps],
    .review-form-modal[b-pha9p4nhps],
    .scholarship-view-modal[b-pha9p4nhps] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}


/* =========================================================
   SCHOLARSHIP MANAGEMENT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.scholarship-page[b-pha9p4nhps] {
    font-size:17px;
    line-height:1.75;
}

.scholarship-hero[b-pha9p4nhps] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.applications[b-pha9p4nhps] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.approved[b-pha9p4nhps] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.paid[b-pha9p4nhps] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.balance[b-pha9p4nhps] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-pha9p4nhps] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.submitted > span[b-pha9p4nhps] { background:#c56b2a; }
.status-overview-card.under-review > span[b-pha9p4nhps] { background:#73569b; }
.status-overview-card.waiting-payment > span[b-pha9p4nhps] { background:#987634; }
.status-overview-card.partial > span[b-pha9p4nhps] { background:#2f789f; }
.status-overview-card.paid > span[b-pha9p4nhps] { background:var(--theme-primary); }

.scholarship-metric-grid article.review > span[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-metric-grid article.waiting > span[b-pha9p4nhps] {
    color:#987634;
    background:#fff4df;
}

.scholarship-metric-grid article.partial > span[b-pha9p4nhps] {
    color:#2f789f;
    background:#e8f3f8;
}

.scholarship-metric-grid article.average > span[b-pha9p4nhps] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* TABLE */

.applicant-photo-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.applicant-photo-mini[b-pha9p4nhps] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.applicant-photo-mini img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.applicant-photo-cell strong[b-pha9p4nhps] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.applicant-photo-cell small[b-pha9p4nhps],
.applicant-photo-cell em[b-pha9p4nhps] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.applicant-photo-cell em[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-style:normal;
}

.application-program-cell[b-pha9p4nhps],
.status-cell[b-pha9p4nhps] {
    display:flex;
    min-width:180px;
    flex-direction:column;
    gap:7px;
}

.application-program-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.99rem;
}

.application-program-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.scholarship-type-chip[b-pha9p4nhps],
.scholarship-status-chip[b-pha9p4nhps],
.priority-chip[b-pha9p4nhps],
.special-care-chip[b-pha9p4nhps] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.scholarship-type-chip.need[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-type-chip.merit[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.scholarship-type-chip.disability[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.scholarship-type-chip.sport[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.scholarship-type-chip.culture[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.scholarship-type-chip.emergency[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.scholarship-status-chip.draft[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.scholarship-status-chip.submitted[b-pha9p4nhps] { color:#c56b2a; background:#fff0df; }
.scholarship-status-chip.under-review[b-pha9p4nhps] { color:#73569b; background:#f0eafb; }
.scholarship-status-chip.approved[b-pha9p4nhps],
.scholarship-status-chip.paid[b-pha9p4nhps] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-status-chip.waiting-payment[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.scholarship-status-chip.partial[b-pha9p4nhps] { color:#2f789f; background:#e8f3f8; }
.scholarship-status-chip.rejected[b-pha9p4nhps],
.scholarship-status-chip.cancelled[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-pha9p4nhps] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-pha9p4nhps] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-pha9p4nhps] { color:#b54d43; background:#fff0ee; }

.special-care-chip[b-pha9p4nhps] {
    color:#73569b;
    background:#f0eafb;
}

.eligibility-cell[b-pha9p4nhps],
.amount-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:205px;
}

.eligibility-cell span[b-pha9p4nhps],
.amount-cell span[b-pha9p4nhps] {
    display:flex;
    min-height:39px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.eligibility-cell strong[b-pha9p4nhps],
.amount-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.eligibility-cell em[b-pha9p4nhps] {
    grid-column:1 / -1;
}

.amount-cell span:nth-child(3)[b-pha9p4nhps] {
    grid-column:1 / -1;
    color:#987634;
    background:#fffaf0;
}

.payment-progress-cell[b-pha9p4nhps] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:9px;
}

.payment-progress-cell > div:first-child[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.payment-progress-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-progress-cell span[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.payment-track[b-pha9p4nhps] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.payment-track i[b-pha9p4nhps] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.payment-progress-cell small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

.officer-cell[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-pha9p4nhps] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-pha9p4nhps],
.officer-cell small[b-pha9p4nhps] {
    display:block;
}

.officer-cell strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.officer-cell small[b-pha9p4nhps] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.review[b-pha9p4nhps] {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-action.pay[b-pha9p4nhps] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* APPLICATION FORM */

.linked-student-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-student-preview > button[b-pha9p4nhps] {
    height:190px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:20px;
    cursor:zoom-in;
}

.linked-student-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-student-preview small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-student-preview h3[b-pha9p4nhps] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.linked-student-preview p[b-pha9p4nhps] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.93rem;
}

.linked-student-preview > div > div[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-student-preview > div > div span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.document-upload-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.document-upload-card[b-pha9p4nhps] {
    overflow:hidden;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.document-upload-heading[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-pha9p4nhps] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.document-upload-heading strong[b-pha9p4nhps],
.document-upload-heading small[b-pha9p4nhps] {
    display:block;
}

.document-upload-heading strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.document-upload-heading small[b-pha9p4nhps] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-pha9p4nhps] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-pha9p4nhps] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty .mud-icon-root[b-pha9p4nhps] {
    font-size:2rem;
}

.document-empty strong[b-pha9p4nhps] {
    font-size:.91rem;
}

.document-empty small[b-pha9p4nhps] {
    font-size:.90rem;
}

.officer-grid[b-pha9p4nhps] {
    margin-top:10px;
}

.privacy-warning[b-pha9p4nhps] {
    margin-top:20px;
    font-size:.96rem !important;
}

/* REVIEW */

.review-form-modal[b-pha9p4nhps],
.payment-form-modal[b-pha9p4nhps] {
    width:min(1120px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-source-summary[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.review-source-summary > div[b-pha9p4nhps] {
    min-height:105px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.review-student[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.review-student img[b-pha9p4nhps] {
    width:78px;
    height:78px;
    border-radius:19px;
    object-fit:cover;
}

.review-source-summary small[b-pha9p4nhps],
.review-source-summary strong[b-pha9p4nhps],
.review-source-summary span[b-pha9p4nhps] {
    display:block;
}

.review-source-summary small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.review-source-summary strong[b-pha9p4nhps] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1rem;
}

.review-source-summary span[b-pha9p4nhps] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-score-preview[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.review-score-preview article[b-pha9p4nhps] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.conditional[b-pha9p4nhps],
.review-score-preview article.requested[b-pha9p4nhps] {
    border-top-color:#987634;
}

.review-score-preview article.review[b-pha9p4nhps] {
    border-top-color:#b54d43;
}

.review-score-preview article.approved[b-pha9p4nhps] {
    border-top-color:#73569b;
}

.review-score-preview small[b-pha9p4nhps],
.review-score-preview strong[b-pha9p4nhps],
.review-score-preview span[b-pha9p4nhps] {
    display:block;
}

.review-score-preview small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-pha9p4nhps] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.34rem;
}

.review-score-preview span[b-pha9p4nhps] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-document-card[b-pha9p4nhps],
.payment-document-card[b-pha9p4nhps] {
    max-width:520px;
    margin:18px auto 0;
}

.review-save-button[b-pha9p4nhps] {
    background:linear-gradient(135deg,#73569b,#584078) !important;
    color:#fff !important;
}

/* PAYMENT */

.payment-summary-grid[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.payment-summary-grid article[b-pha9p4nhps] {
    min-height:105px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.payment-summary-grid small[b-pha9p4nhps],
.payment-summary-grid strong[b-pha9p4nhps],
.payment-summary-grid span[b-pha9p4nhps] {
    display:block;
}

.payment-summary-grid small[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.payment-summary-grid strong[b-pha9p4nhps] {
    margin-top:6px;
    color:var(--theme-primary);
    font-size:1.30rem;
}

.payment-summary-grid span[b-pha9p4nhps] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.payment-save-button[b-pha9p4nhps] {
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
    color:#fff !important;
}

/* VIEW */

.scholarship-cover-panel[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.scholarship-cover-photo[b-pha9p4nhps] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.scholarship-cover-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.scholarship-cover-content small[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.scholarship-cover-content h2[b-pha9p4nhps] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.40rem;
}

.scholarship-cover-content p[b-pha9p4nhps] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.94rem;
}

.scholarship-cover-meta[b-pha9p4nhps] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.scholarship-cover-meta span[b-pha9p4nhps] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.scholarship-emblem[b-pha9p4nhps] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.scholarship-emblem.submitted[b-pha9p4nhps] { color:#c56b2a; border-color:#f8ddc7; }
.scholarship-emblem.under-review[b-pha9p4nhps] { color:#73569b; border-color:#e8def4; }
.scholarship-emblem.waiting-payment[b-pha9p4nhps] { color:#987634; border-color:#f2e6c9; }
.scholarship-emblem.partial[b-pha9p4nhps] { color:#2f789f; border-color:#d8eaf2; }
.scholarship-emblem.rejected[b-pha9p4nhps],
.scholarship-emblem.cancelled[b-pha9p4nhps] { color:#b54d43; border-color:#f4d7d3; }

.scholarship-emblem .mud-icon-root[b-pha9p4nhps] {
    font-size:2.3rem;
}

.scholarship-emblem strong[b-pha9p4nhps] {
    font-size:1.05rem;
    text-align:center;
}

.scholarship-emblem small[b-pha9p4nhps] {
    font-size:.90rem;
}

.scholarship-student-photo[b-pha9p4nhps] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.scholarship-student-photo img[b-pha9p4nhps] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-review-button[b-pha9p4nhps] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.view-payment-button[b-pha9p4nhps] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.payment-history-panel[b-pha9p4nhps] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.payment-card[b-pha9p4nhps] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    gap:12px;
    padding:15px;
    border-left:5px solid var(--theme-primary);
    border-radius:13px;
    background:#f7fbf8;
}

.payment-card > span[b-pha9p4nhps] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.payment-card > div > div[b-pha9p4nhps] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.payment-card strong[b-pha9p4nhps] {
    color:var(--theme-ink);
    font-size:1rem;
}

.payment-card small[b-pha9p4nhps],
.payment-card p[b-pha9p4nhps],
.payment-card em[b-pha9p4nhps] {
    color:#71837a;
    font-size:.90rem;
}

.payment-card p[b-pha9p4nhps] {
    margin:5px 0;
}

.payment-card em[b-pha9p4nhps] {
    color:var(--theme-primary);
    font-style:normal;
}

.history-empty[b-pha9p4nhps] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.student > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.application > span[b-pha9p4nhps] { background:rgba(10,114,87,.90); }
.attachment-card.income > span[b-pha9p4nhps] { background:rgba(152,118,52,.90); }
.attachment-card.support > span[b-pha9p4nhps] { background:rgba(115,86,155,.90); }
.attachment-card.approval > span[b-pha9p4nhps] { background:rgba(52,115,75,.90); }
.attachment-card.payment > span[b-pha9p4nhps] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.96rem !important;
    line-height:1.74 !important;
}

.scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-head .mud-table-cell {
    min-height:67px;
    color:#26463c;
    font-size:.98rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.scholarship-page[b-pha9p4nhps]  .mud-input,
.scholarship-page[b-pha9p4nhps]  .mud-select-input {
    font-size:1.06rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-input-label {
    font-size:1.02rem !important;
    font-weight:650 !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-list-item-text {
    font-size:1.04rem !important;
}

.scholarship-page[b-pha9p4nhps]  .mud-button-label {
    font-size:1rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-pha9p4nhps] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .scholarship-metric-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scholarship-cover-panel[b-pha9p4nhps] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1100px) {
    .document-upload-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-source-summary[b-pha9p4nhps] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-student-preview[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-pha9p4nhps] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .scholarship-emblem[b-pha9p4nhps] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-pha9p4nhps],
    .follow-grid[b-pha9p4nhps],
    .scholarship-metric-grid[b-pha9p4nhps],
    .reference-grid[b-pha9p4nhps],
    .measurement-document-grid[b-pha9p4nhps],
    .review-source-summary[b-pha9p4nhps],
    .review-score-preview[b-pha9p4nhps],
    .payment-summary-grid[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-pha9p4nhps] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-photo[b-pha9p4nhps] {
        height:250px;
    }

    .scholarship-page[b-pha9p4nhps]  .scholarship-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.92rem !important;
    }

    .scholarship-form-modal[b-pha9p4nhps],
    .review-form-modal[b-pha9p4nhps],
    .payment-form-modal[b-pha9p4nhps],
    .scholarship-view-modal[b-pha9p4nhps] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #scholarship-profile-print-area[b-pha9p4nhps],
    #scholarship-profile-print-area *[b-pha9p4nhps] {
        visibility:visible !important;
    }

    #scholarship-profile-print-area[b-pha9p4nhps] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .scholarship-view-modal[b-pha9p4nhps] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-pha9p4nhps],
    .document-status-strip[b-pha9p4nhps],
    .scholarship-cover-panel[b-pha9p4nhps],
    .document-section[b-pha9p4nhps],
    .document-footer[b-pha9p4nhps] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/06EducationandActivities/EducationSchools.razor.rz.scp.css */
:root[b-46lkohm54y] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.education-page[b-46lkohm54y] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.education-page[b-46lkohm54y]  .education-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.education-hero[b-46lkohm54y] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-46lkohm54y] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-46lkohm54y] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-46lkohm54y],
.hero-action-panel[b-46lkohm54y] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-46lkohm54y] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-46lkohm54y] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-46lkohm54y] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-46lkohm54y] {
    color: #d8ede6;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-46lkohm54y] {
    margin-top: 3px;
    font-size: .94rem;
}

.education-hero h1[b-46lkohm54y] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.education-hero p[b-46lkohm54y] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-46lkohm54y] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-46lkohm54y] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .86rem;
    font-weight: 650;
}

.hero-action-panel[b-46lkohm54y] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-46lkohm54y] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-46lkohm54y] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-46lkohm54y] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-46lkohm54y] {
    font-size: .86rem;
}

.hero-status small[b-46lkohm54y] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .86rem;
}

.education-page[b-46lkohm54y]  .hero-add-button,
.education-page[b-46lkohm54y]  .toolbar-add-button,
.education-page[b-46lkohm54y]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .86rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.education-page[b-46lkohm54y]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-46lkohm54y],
.hero-refresh-button[b-46lkohm54y] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .86rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-46lkohm54y] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-46lkohm54y] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-46lkohm54y] {
    opacity: .55;
    cursor: wait;
}

.education-page[b-46lkohm54y]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.education-page[b-46lkohm54y]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-46lkohm54y] {
    margin-top: 2px !important;
}

.summary-card[b-46lkohm54y] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-46lkohm54y] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-46lkohm54y] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-46lkohm54y] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-46lkohm54y] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-46lkohm54y] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-46lkohm54y] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-46lkohm54y] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-46lkohm54y] {
    color: #788982;
    font-size: .86rem;
    font-weight: 650;
}

.summary-card p[b-46lkohm54y] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-46lkohm54y] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-46lkohm54y] {
    color: #798a83;
    font-size: .86rem;
}

.summary-card em[b-46lkohm54y] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .86rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-46lkohm54y] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-46lkohm54y] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-46lkohm54y],
.status-overview-card.selected[b-46lkohm54y] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-46lkohm54y] {
    background: #f5faf7;
}

.status-overview-card > span[b-46lkohm54y] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-46lkohm54y] { background:#687872; }
.status-overview-card.reviewing > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.difference > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.approved > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.closed > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.voided > span[b-46lkohm54y] { background:#687872; }
.status-overview-card.today > span[b-46lkohm54y] { background:#73569b; }

.status-overview-card div[b-46lkohm54y] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-46lkohm54y] {
    color: var(--theme-muted);
    font-size: .86rem;
}

.status-overview-card strong[b-46lkohm54y] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-46lkohm54y] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-46lkohm54y] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-46lkohm54y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-46lkohm54y] {
    color: #987634;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-46lkohm54y] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-46lkohm54y] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .86rem;
    font-weight: 700;
}

.variance-grid[b-46lkohm54y] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-46lkohm54y] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-46lkohm54y] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-46lkohm54y] {
    display: block;
    color: #3c5047;
    font-size: .86rem;
}

.variance-card small[b-46lkohm54y] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .86rem;
}

.closing-progress[b-46lkohm54y] {
    margin-top: 13px;
}

.progress-track[b-46lkohm54y] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-46lkohm54y] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-46lkohm54y] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-46lkohm54y] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-46lkohm54y] {
    display: block;
    color: #87958f;
    font-size: .86rem;
}

.progress-metrics strong[b-46lkohm54y] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-46lkohm54y],
.education-list-panel[b-46lkohm54y] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-46lkohm54y] {
    padding: 15px;
}

.filter-heading[b-46lkohm54y],
.list-toolbar[b-46lkohm54y] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-46lkohm54y],
.panel-kicker[b-46lkohm54y] {
    color: #987634;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-46lkohm54y],
.list-toolbar h2[b-46lkohm54y] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-46lkohm54y],
.list-toolbar p[b-46lkohm54y] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .86rem;
    line-height: 1.65;
}

.clear-filter-button[b-46lkohm54y] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .86rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-46lkohm54y] {
    margin-top: 8px !important;
}

.education-page[b-46lkohm54y]  .premium-field,
.education-page[b-46lkohm54y]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.education-page[b-46lkohm54y]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .86rem !important;
    text-transform: none !important;
}

.filter-summary[b-46lkohm54y] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-46lkohm54y] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .86rem;
}

.filter-summary strong[b-46lkohm54y] {
    color: var(--theme-primary);
}

.education-list-panel[b-46lkohm54y] {
    overflow: hidden;
}

.list-toolbar[b-46lkohm54y] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.education-page[b-46lkohm54y]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-46lkohm54y] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-46lkohm54y] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-46lkohm54y] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-46lkohm54y] {
    margin: 0;
    font-size: .86rem;
}

.education-page[b-46lkohm54y]  .education-table {
    font-family: 'Kanit',sans-serif;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head {
    background: #f1f7f4;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .86rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-46lkohm54y] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-46lkohm54y] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-46lkohm54y] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-46lkohm54y] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-46lkohm54y] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .86rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-46lkohm54y] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .86rem;
}

.date-shift-cell[b-46lkohm54y],
.counter-cashier-cell[b-46lkohm54y],
.money-cell[b-46lkohm54y],
.difference-cell[b-46lkohm54y],
.transaction-status-cell[b-46lkohm54y] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-46lkohm54y] {
    min-width: 175px;
}

.date-shift-cell strong[b-46lkohm54y],
.counter-cashier-cell strong[b-46lkohm54y],
.money-cell strong[b-46lkohm54y],
.difference-cell strong[b-46lkohm54y],
.transaction-status-cell strong[b-46lkohm54y] {
    color: #3c5047;
    font-size: .86rem;
    line-height: 1.48;
}

.date-shift-cell small[b-46lkohm54y],
.counter-cashier-cell small[b-46lkohm54y],
.money-cell small[b-46lkohm54y],
.difference-cell small[b-46lkohm54y] {
    margin-top: 3px;
    color: #84928d;
    font-size: .86rem;
}

.date-shift-cell em[b-46lkohm54y],
.counter-cashier-cell em[b-46lkohm54y] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .86rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-46lkohm54y] { color:var(--theme-primary); }
.money-cell.actual strong[b-46lkohm54y] { color:#2f789f; }

.difference-cell.matched strong[b-46lkohm54y] { color:#34734b; }
.difference-cell.over strong[b-46lkohm54y] { color:#987634; }
.difference-cell.short strong[b-46lkohm54y] { color:#b54d43; }

.status-chip[b-46lkohm54y],
.match-chip[b-46lkohm54y] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 700;
}

.status-chip i[b-46lkohm54y] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.difference[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-46lkohm54y] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-46lkohm54y] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.education-page[b-46lkohm54y]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.education-page[b-46lkohm54y]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.education-page[b-46lkohm54y]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.education-page[b-46lkohm54y]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.education-page[b-46lkohm54y]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-46lkohm54y] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-46lkohm54y] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .86rem;
}

/* MODALS */

.modal-backdrop[b-46lkohm54y],
.image-preview-backdrop[b-46lkohm54y] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.education-form-modal[b-46lkohm54y],
.education-view-modal[b-46lkohm54y],
.delete-modal[b-46lkohm54y],
.image-preview-modal[b-46lkohm54y] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-46lkohm54y],
.view-toolbar[b-46lkohm54y],
.image-preview-header[b-46lkohm54y] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-46lkohm54y] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-46lkohm54y] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-46lkohm54y],
.view-toolbar small[b-46lkohm54y],
.image-preview-header small[b-46lkohm54y] {
    color:#987634;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-46lkohm54y],
.view-toolbar h2[b-46lkohm54y],
.image-preview-header h3[b-46lkohm54y] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-46lkohm54y] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.86rem;
}

.modal-body[b-46lkohm54y],
.view-scroll[b-46lkohm54y] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-46lkohm54y] {
    background: #e9efec;
}

.modal-footer[b-46lkohm54y] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.education-page[b-46lkohm54y]  .cancel-button,
.education-page[b-46lkohm54y]  .save-button,
.education-page[b-46lkohm54y]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.86rem !important;
    text-transform:none !important;
}

.form-section-title[b-46lkohm54y] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-46lkohm54y] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-46lkohm54y] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-46lkohm54y] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.form-section-title small[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.86rem;
}

.open-transactions-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-46lkohm54y] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-46lkohm54y],
.calculation-heading[b-46lkohm54y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-46lkohm54y],
.calculation-heading small[b-46lkohm54y] {
    color: #987634;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-46lkohm54y],
.calculation-heading h3[b-46lkohm54y] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-46lkohm54y],
.calculation-heading > span[b-46lkohm54y] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .86rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-46lkohm54y] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-46lkohm54y] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-46lkohm54y] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.source-summary-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-46lkohm54y] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-46lkohm54y] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-46lkohm54y] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-46lkohm54y] {
    display:block;
    color:#84928d;
    font-size:.86rem;
}

.system-amount-card strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.86rem;
}

.reconciliation-calculation-preview[b-46lkohm54y] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-46lkohm54y] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-46lkohm54y] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-46lkohm54y] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-46lkohm54y] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-46lkohm54y] {
    display:block;
    color:#8b7b74;
    font-size:.86rem;
}

.calculation-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-46lkohm54y] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.86rem;
}

.calculation-grid .short span[b-46lkohm54y],
.calculation-grid .short strong[b-46lkohm54y],
.calculation-grid .short small[b-46lkohm54y] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-46lkohm54y] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-46lkohm54y] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-46lkohm54y] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-46lkohm54y] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.photo-upload-heading small[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.86rem;
}

.photo-preview[b-46lkohm54y] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-46lkohm54y] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-46lkohm54y] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-46lkohm54y] {
    color:#40544b;
    font-size:.86rem;
}

.photo-empty small[b-46lkohm54y] {
    font-size:.86rem;
}

.photo-upload-actions[b-46lkohm54y] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-46lkohm54y],
.remove-photo-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-46lkohm54y] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-46lkohm54y] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-46lkohm54y] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-46lkohm54y],
.detail-transaction-table[b-46lkohm54y] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-46lkohm54y],
.source-transaction-row[b-46lkohm54y] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-46lkohm54y] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-46lkohm54y],
.source-transaction-row > span[b-46lkohm54y] {
    padding:7px;
    font-size:.86rem;
}

.source-transaction-row[b-46lkohm54y] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-46lkohm54y] {
    border-bottom:0;
}

.mini-photo-button[b-46lkohm54y] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-46lkohm54y],
.source-transaction-more[b-46lkohm54y] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.86rem;
    text-align:center;
}

.mock-rule-warning[b-46lkohm54y] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.86rem !important;
}

/* VIEW & PRINT */

.education-view-modal[b-46lkohm54y] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
}

.education-page[b-46lkohm54y]  .view-edit-button,
.education-page[b-46lkohm54y]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.86rem !important;
    text-transform:none !important;
}

.education-page[b-46lkohm54y]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-education-profile[b-46lkohm54y] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-46lkohm54y] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-46lkohm54y] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-46lkohm54y] {
    text-align:center;
}

.document-organization small[b-46lkohm54y] {
    color:#987634;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-46lkohm54y] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-46lkohm54y] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.86rem;
}

.document-number-box[b-46lkohm54y] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-46lkohm54y],
.document-number-box small[b-46lkohm54y] {
    display:block;
    color:#778980;
    font-size:.86rem;
}

.document-number-box strong[b-46lkohm54y] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.86rem;
    word-break:break-word;
}

.document-status-strip[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-46lkohm54y] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-46lkohm54y] {
    display:block;
    color:#83918b;
    font-size:.86rem;
}

.document-status-strip > div strong[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.86rem;
}

.scope-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-46lkohm54y] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-46lkohm54y] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.86rem;
}

.scope-reference-box[b-46lkohm54y] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.scope-reference-box strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.86rem;
}

.scope-reference-box small[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-46lkohm54y],
.transaction-summary-section[b-46lkohm54y],
.source-transaction-section[b-46lkohm54y],
.review-section[b-46lkohm54y] {
    margin-top:16px;
}

.section-title[b-46lkohm54y] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-46lkohm54y] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.86rem;
    font-weight:800;
}

.section-title small[b-46lkohm54y] {
    color:#987634;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-46lkohm54y] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-46lkohm54y] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-46lkohm54y],
.comparison-row[b-46lkohm54y],
.comparison-total[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-46lkohm54y] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-46lkohm54y],
.comparison-row span[b-46lkohm54y],
.comparison-total span[b-46lkohm54y] {
    padding:8px 9px;
    font-size:.86rem;
}

.comparison-row[b-46lkohm54y] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-46lkohm54y],
.comparison-total span:not(:first-child)[b-46lkohm54y] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-46lkohm54y] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-46lkohm54y] { color:#34734b; }
.difference-text.over[b-46lkohm54y] { color:#987634; }
.difference-text.short[b-46lkohm54y] { color:#b54d43; }

.transaction-summary-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-46lkohm54y] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-46lkohm54y] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-46lkohm54y] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-46lkohm54y] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-46lkohm54y] { background:#f4fafc; }

.transaction-summary-grid span[b-46lkohm54y] {
    display:block;
    color:#84928c;
    font-size:.86rem;
}

.transaction-summary-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-46lkohm54y] {
    display:block;
    color:#798a83;
    font-size:.86rem;
}

.detail-transaction-header[b-46lkohm54y],
.detail-transaction-row[b-46lkohm54y] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-46lkohm54y] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-46lkohm54y],
.detail-transaction-row span[b-46lkohm54y] {
    padding:8px 7px;
    font-size:.86rem;
}

.detail-transaction-row[b-46lkohm54y] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-46lkohm54y] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.review-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.86rem;
}

.review-note-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-46lkohm54y] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
}

.review-note-grid p[b-46lkohm54y] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.86rem;
    line-height:1.6;
}

.document-footer[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
}

.document-footer p[b-46lkohm54y] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.86rem;
    line-height:1.6;
}

.qr-placeholder[b-46lkohm54y] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-46lkohm54y] {
    font-size:.86rem;
    font-weight:700;
}

.mock-document-label[b-46lkohm54y] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.86rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-46lkohm54y],
.attachment-panel[b-46lkohm54y] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-46lkohm54y] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-46lkohm54y] {
    color:#987634;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-46lkohm54y] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-46lkohm54y] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-weight:700;
}

.history-list[b-46lkohm54y] {
    display:grid;
    gap:7px;
}

.history-item[b-46lkohm54y] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-46lkohm54y] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-46lkohm54y] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-46lkohm54y] {
    color:#3c5047;
    font-size:.86rem;
}

.history-item small[b-46lkohm54y],
.history-item em[b-46lkohm54y] {
    color:#84928d;
    font-size:.86rem;
    font-style:normal;
}

.history-item p[b-46lkohm54y] {
    margin:4px 0;
    color:#5e7068;
    font-size:.86rem;
    line-height:1.55;
}

.attachment-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-46lkohm54y] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-46lkohm54y] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-46lkohm54y] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-46lkohm54y] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-46lkohm54y] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-46lkohm54y] { background:rgba(52,115,75,.89); }

.attachment-empty[b-46lkohm54y] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-46lkohm54y] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-46lkohm54y] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-46lkohm54y] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-46lkohm54y] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-46lkohm54y] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-46lkohm54y] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-46lkohm54y] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.86rem;
    line-height:1.7;
}

.delete-modal p strong[b-46lkohm54y] {
    color:#b54d43;
}

.delete-warning[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.86rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-46lkohm54y] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.education-page[b-46lkohm54y]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-46lkohm54y] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .education-hero[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-46lkohm54y] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-46lkohm54y] {
        grid-column:1 / -1;
    }

    .document-header[b-46lkohm54y] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-46lkohm54y] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .education-page[b-46lkohm54y] {
        padding-top:10px;
    }

    .education-page[b-46lkohm54y]  .education-container {
        padding-inline:10px !important;
    }

    .education-hero[b-46lkohm54y] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-46lkohm54y],
    .list-toolbar[b-46lkohm54y],
    .source-summary-heading[b-46lkohm54y],
    .calculation-heading[b-46lkohm54y],
    .view-toolbar[b-46lkohm54y],
    .section-heading[b-46lkohm54y] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-46lkohm54y],
    .variance-grid[b-46lkohm54y],
    .progress-metrics[b-46lkohm54y],
    .source-summary-grid[b-46lkohm54y],
    .system-amount-grid[b-46lkohm54y],
    .calculation-grid[b-46lkohm54y],
    .photo-upload-grid[b-46lkohm54y],
    .transaction-summary-grid[b-46lkohm54y],
    .review-grid[b-46lkohm54y],
    .review-note-grid[b-46lkohm54y],
    .attachment-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-46lkohm54y] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-46lkohm54y] {
        width:100%;
    }

    .print-education-profile[b-46lkohm54y] {
        padding:22px 18px;
    }

    .document-footer[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-46lkohm54y] {
        grid-column:auto;
    }

    .status-overview[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-46lkohm54y] {
        width:100%;
    }

    .document-header[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-46lkohm54y] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-46lkohm54y] {
        visibility:hidden !important;
    }

    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-46lkohm54y] {
        display:none !important;
    }

    .modal-backdrop[b-46lkohm54y],
    .education-view-modal[b-46lkohm54y],
    .view-scroll[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .scope-panel[b-46lkohm54y],
    .amount-comparison-section[b-46lkohm54y],
    .transaction-summary-section[b-46lkohm54y],
    .source-transaction-section[b-46lkohm54y],
    .review-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }

    .mock-document-label[b-46lkohm54y] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-46lkohm54y] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.education-page[b-46lkohm54y]  .hero-add-button,
.education-page[b-46lkohm54y]  .toolbar-add-button,
.education-page[b-46lkohm54y]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.86rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.confirmed > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.checked-in > span[b-46lkohm54y] { background:#73569b; }
.status-overview-card.in-service > span[b-46lkohm54y] { background:#c46a2b; }
.status-overview-card.completed > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.cancelled > span[b-46lkohm54y] { background:#b54d43; }

.service-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-46lkohm54y],
.service-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-46lkohm54y] {
    background:#f4faf7;
}

.service-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-46lkohm54y] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-46lkohm54y] {
    display:block;
    color:var(--theme-muted);
    font-size:.86rem;
}

.service-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-46lkohm54y] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-46lkohm54y] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-46lkohm54y] {
    display:block;
    color:#3c5047;
    font-size:.86rem;
}

.focus-grid small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.86rem;
}

/* TABLE */

.citizen-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-46lkohm54y] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.86rem;
}

.citizen-photo-cell small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.86rem;
}

.appointment-time-cell[b-46lkohm54y],
.service-unit-cell[b-46lkohm54y],
.provider-location-cell[b-46lkohm54y],
.queue-priority-cell[b-46lkohm54y],
.reason-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-46lkohm54y],
.reason-cell[b-46lkohm54y] {
    min-width:180px;
}

.appointment-time-cell strong[b-46lkohm54y],
.service-unit-cell strong[b-46lkohm54y],
.provider-location-cell strong[b-46lkohm54y],
.queue-priority-cell strong[b-46lkohm54y],
.reason-cell strong[b-46lkohm54y] {
    color:#3c5047;
    font-size:.86rem;
    line-height:1.5;
}

.appointment-time-cell small[b-46lkohm54y],
.service-unit-cell small[b-46lkohm54y],
.provider-location-cell small[b-46lkohm54y],
.queue-priority-cell small[b-46lkohm54y],
.reason-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:3px;
    color:#84928d;
    font-size:.86rem;
    line-height:1.5;
}

.appointment-time-cell em[b-46lkohm54y],
.provider-location-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-46lkohm54y],
.priority-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-46lkohm54y] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-46lkohm54y] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-46lkohm54y] { color:#987634; background:#fff4df; }

.priority-chip[b-46lkohm54y] {
    margin-top:5px;
}

.priority-chip.normal[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-46lkohm54y] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-46lkohm54y] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-46lkohm54y] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-46lkohm54y] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-46lkohm54y] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.86rem;
}

.identity-chip[b-46lkohm54y] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:700;
}

.identity-chip.verified[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-46lkohm54y] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-46lkohm54y],
.identity-chip.not-found[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-46lkohm54y] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.citizen-source-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.86rem;
    word-break:break-word;
}

.citizen-address[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.86rem;
}

.citizen-source-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-46lkohm54y],
.citizen-source-actions a[b-46lkohm54y] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-46lkohm54y] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-46lkohm54y] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-46lkohm54y] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-46lkohm54y] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.preview-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.86rem;
}

.consent-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-46lkohm54y] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-46lkohm54y] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.86rem;
    font-weight:700;
}

.source-photo-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-46lkohm54y] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-46lkohm54y] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-46lkohm54y] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
}

.source-photo-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-46lkohm54y] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-46lkohm54y] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-46lkohm54y] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.86rem;
    line-height:1.5;
}

.identity-box[b-46lkohm54y] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-46lkohm54y],
.identity-box small[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.identity-box strong[b-46lkohm54y] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.86rem;
}

.service-section[b-46lkohm54y],
.reason-section[b-46lkohm54y],
.reminder-section[b-46lkohm54y] {
    margin-top:16px;
}

.reference-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-46lkohm54y] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-46lkohm54y],
.timeline-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.reference-grid strong[b-46lkohm54y],
.timeline-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.86rem;
    word-break:break-word;
}

.note-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-46lkohm54y] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-46lkohm54y] {
    display:block;
    color:#87958f;
    font-size:.86rem;
}

.note-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.86rem;
}

.note-grid p[b-46lkohm54y] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.86rem;
    line-height:1.6;
}

.timeline-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-46lkohm54y] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.86rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-46lkohm54y] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-46lkohm54y] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-46lkohm54y],
    .preview-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-46lkohm54y] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-46lkohm54y] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-46lkohm54y] {
        grid-column:1 / -1;
    }

    .reference-grid[b-46lkohm54y],
    .timeline-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-46lkohm54y],
    .focus-grid[b-46lkohm54y],
    .citizen-source-grid[b-46lkohm54y],
    .preview-grid[b-46lkohm54y],
    .consent-grid[b-46lkohm54y],
    .source-photo-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .note-grid[b-46lkohm54y],
    .timeline-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-46lkohm54y] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-46lkohm54y] {
        margin:0 auto;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .service-section[b-46lkohm54y],
    .reason-section[b-46lkohm54y],
    .reminder-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size: 16px;
    line-height: 1.55;
}

.education-page[b-46lkohm54y]  .mud-typography,
.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-input-label,
.education-page[b-46lkohm54y]  .mud-select,
.education-page[b-46lkohm54y]  .mud-list-item-text,
.education-page[b-46lkohm54y]  .mud-button-label,
.education-page[b-46lkohm54y]  .mud-table-cell,
.education-page[b-46lkohm54y]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size: .92rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size: .90rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size: .86rem !important;
    font-weight: 700 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .86rem !important;
    line-height: 1.55 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .86rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-46lkohm54y] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-46lkohm54y] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-46lkohm54y] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-46lkohm54y] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-46lkohm54y] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-46lkohm54y] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-46lkohm54y] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-46lkohm54y] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-46lkohm54y],
.education-list-panel[b-46lkohm54y],
.insight-panel[b-46lkohm54y] {
    border-radius: 20px;
}

.filter-panel[b-46lkohm54y] {
    padding: 20px;
}

.list-toolbar[b-46lkohm54y] {
    padding: 19px 20px;
}

.filter-heading p[b-46lkohm54y],
.list-toolbar p[b-46lkohm54y] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-46lkohm54y] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-46lkohm54y] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-46lkohm54y],
.service-unit-cell[b-46lkohm54y],
.provider-location-cell[b-46lkohm54y],
.queue-priority-cell[b-46lkohm54y],
.reason-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    min-width: 155px;
}

.provider-location-cell[b-46lkohm54y],
.reason-cell[b-46lkohm54y] {
    min-width: 215px;
}

.service-chip[b-46lkohm54y],
.priority-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.identity-chip[b-46lkohm54y] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-46lkohm54y] {
    min-width: 205px;
    gap: 7px;
}

.education-page[b-46lkohm54y]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-46lkohm54y] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-46lkohm54y],
.view-toolbar[b-46lkohm54y],
.image-preview-header[b-46lkohm54y] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-46lkohm54y],
.view-scroll[b-46lkohm54y] {
    padding: 20px;
}

.modal-footer[b-46lkohm54y] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-46lkohm54y] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-46lkohm54y] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-46lkohm54y],
.preview-grid > div[b-46lkohm54y],
.reference-grid > div[b-46lkohm54y],
.timeline-grid > div[b-46lkohm54y] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-46lkohm54y] {
    padding: 13px;
}

.photo-preview[b-46lkohm54y] {
    min-height: 200px;
}

.photo-preview img[b-46lkohm54y] {
    height: 200px;
}

.history-item[b-46lkohm54y] {
    padding: 12px;
}

.attachment-card[b-46lkohm54y],
.attachment-card img[b-46lkohm54y] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .education-page[b-46lkohm54y] {
        font-size: 15px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .86rem !important;
    }

    .summary-card[b-46lkohm54y] {
        min-height: 122px;
    }

    .status-overview-card[b-46lkohm54y],
    .service-overview-card[b-46lkohm54y] {
        min-height: 82px;
    }

    .modal-body[b-46lkohm54y],
    .view-scroll[b-46lkohm54y] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #education-profile-print-area[b-46lkohm54y] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #education-profile-print-area h1[b-46lkohm54y] {
        font-size: 18pt !important;
    }

    #education-profile-print-area h2[b-46lkohm54y] {
        font-size: 14pt !important;
    }

    #education-profile-print-area h3[b-46lkohm54y] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.follow-up > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.referred > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.cancelled > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.month > span[b-46lkohm54y] { background:#73569b; }

.service-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-46lkohm54y] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-46lkohm54y] {
    display:block;
    color:#7c8d86;
    font-size:.86rem;
}

.care-metrics strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-46lkohm54y],
.service-unit-cell[b-46lkohm54y],
.provider-location-cell[b-46lkohm54y],
.result-cell[b-46lkohm54y],
.follow-score-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-46lkohm54y],
.result-cell[b-46lkohm54y] {
    min-width:230px;
}

.history-date-cell strong[b-46lkohm54y],
.service-unit-cell strong[b-46lkohm54y],
.provider-location-cell strong[b-46lkohm54y],
.result-cell strong[b-46lkohm54y],
.follow-score-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-46lkohm54y],
.service-unit-cell small[b-46lkohm54y],
.provider-location-cell small[b-46lkohm54y],
.result-cell small[b-46lkohm54y],
.follow-score-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:5px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.55;
}

.history-date-cell em[b-46lkohm54y],
.provider-location-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.86rem;
    font-weight:800;
}

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.referred[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-46lkohm54y] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-46lkohm54y] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-46lkohm54y] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.86rem;
}

.source-data-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-46lkohm54y] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-46lkohm54y] {
    display:block;
    color:var(--theme-muted);
    font-size:.86rem;
}

.source-data-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-46lkohm54y],
.source-actions button[b-46lkohm54y] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-46lkohm54y] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-46lkohm54y] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-46lkohm54y] {
    min-height:180px;
}

.source-photo-card img[b-46lkohm54y] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-46lkohm54y] {
    margin-top:18px;
}

.vital-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-46lkohm54y],
.quality-grid > div[b-46lkohm54y],
.follow-up-grid > div[b-46lkohm54y] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-46lkohm54y],
.quality-grid span[b-46lkohm54y],
.follow-up-grid span[b-46lkohm54y] {
    display:block;
    color:#7e8f87;
    font-size:.86rem;
}

.vital-grid strong[b-46lkohm54y],
.quality-grid strong[b-46lkohm54y],
.follow-up-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.vital-summary[b-46lkohm54y] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.86rem;
    line-height:1.65;
}

.follow-up-grid[b-46lkohm54y],
.quality-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.86rem !important;
    line-height:1.55 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:.94rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:.92rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-46lkohm54y] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-46lkohm54y] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-46lkohm54y] { background:rgba(104,120,114,.89); }

.view-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-46lkohm54y],
    .service-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-46lkohm54y],
    .vital-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-46lkohm54y] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-46lkohm54y],
    .quality-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-46lkohm54y],
    .service-overview[b-46lkohm54y],
    .care-metrics[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .source-photo-grid[b-46lkohm54y],
    .vital-grid[b-46lkohm54y],
    .follow-up-grid[b-46lkohm54y],
    .quality-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.follow-up > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.referred > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.overdue > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.inactive > span[b-46lkohm54y] { background:#687872; }

.risk-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-46lkohm54y],
.risk-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-46lkohm54y] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.risk-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-46lkohm54y] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-46lkohm54y] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-46lkohm54y],
.care-metrics strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-46lkohm54y],
.care-metrics small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.care-metrics[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-46lkohm54y] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-46lkohm54y],
.risk-adl-cell[b-46lkohm54y],
.dependency-living-cell[b-46lkohm54y],
.caregiver-cell[b-46lkohm54y],
.follow-up-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-46lkohm54y] {
    min-width:190px;
}

.register-age-cell strong[b-46lkohm54y],
.risk-adl-cell strong[b-46lkohm54y],
.dependency-living-cell strong[b-46lkohm54y],
.caregiver-cell strong[b-46lkohm54y],
.follow-up-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.86rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-46lkohm54y],
.risk-adl-cell small[b-46lkohm54y],
.dependency-living-cell small[b-46lkohm54y],
.caregiver-cell small[b-46lkohm54y],
.follow-up-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:5px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.55;
}

.register-age-cell em[b-46lkohm54y],
.caregiver-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-46lkohm54y],
.dependency-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.identity-chip[b-46lkohm54y],
.overdue-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.risk-chip.low[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-46lkohm54y] { color:#987634; background:#fff4df; }
.risk-chip.high[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-46lkohm54y] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.active[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.referred[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.overdue-chip[b-46lkohm54y] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-46lkohm54y] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-46lkohm54y] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-46lkohm54y] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.86rem;
}

.source-data-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-46lkohm54y] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-46lkohm54y] {
    display:block;
    color:var(--theme-muted);
    font-size:.86rem;
}

.source-data-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
}

.source-address[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.86rem;
    line-height:1.6;
}

.source-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-46lkohm54y],
.source-actions button[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-46lkohm54y] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-46lkohm54y] {
    display:block;
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
}

.assessment-preview strong[b-46lkohm54y] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.86rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-46lkohm54y],
.reference-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-46lkohm54y],
.reference-grid > div[b-46lkohm54y],
.care-plan-grid > div[b-46lkohm54y] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-46lkohm54y],
.reference-grid span[b-46lkohm54y],
.care-plan-grid span[b-46lkohm54y] {
    display:block;
    color:#7e8f87;
    font-size:.86rem;
}

.assessment-grid strong[b-46lkohm54y],
.reference-grid strong[b-46lkohm54y],
.care-plan-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.86rem;
    line-height:1.55;
}

.care-plan-main[b-46lkohm54y] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.86rem !important;
    line-height:1.58 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.86rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:.96rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:.94rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-46lkohm54y] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-46lkohm54y] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-46lkohm54y] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-46lkohm54y] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-46lkohm54y] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-46lkohm54y] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-46lkohm54y],
    .assessment-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-46lkohm54y],
    .risk-overview[b-46lkohm54y],
    .dependency-grid[b-46lkohm54y],
    .care-metrics[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .assessment-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .care-plan-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:16.5px;
    line-height:1.62;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-46lkohm54y] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-46lkohm54y] { background:#73569b; }
.status-overview-card.field > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.completed > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.follow-up > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.referred > span[b-46lkohm54y] { background:#b55b82; }

.visit-type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-46lkohm54y],
.visit-type-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-46lkohm54y] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.visit-type-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-46lkohm54y] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-46lkohm54y] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-46lkohm54y],
.care-metrics strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-46lkohm54y],
.care-metrics small[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
}

/* TABLE */

.visit-date-cell[b-46lkohm54y],
.visit-type-cell[b-46lkohm54y],
.team-location-cell[b-46lkohm54y],
.result-cell[b-46lkohm54y],
.follow-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-46lkohm54y],
.result-cell[b-46lkohm54y] {
    min-width:230px;
}

.visit-date-cell strong[b-46lkohm54y],
.visit-type-cell strong[b-46lkohm54y],
.team-location-cell strong[b-46lkohm54y],
.result-cell strong[b-46lkohm54y],
.follow-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-46lkohm54y],
.visit-type-cell small[b-46lkohm54y],
.team-location-cell small[b-46lkohm54y],
.result-cell small[b-46lkohm54y],
.follow-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:6px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.58;
}

.visit-date-cell em[b-46lkohm54y],
.team-location-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.identity-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-46lkohm54y] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.referred[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.priority-text[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-46lkohm54y] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-46lkohm54y] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-46lkohm54y] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-46lkohm54y] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-46lkohm54y] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-46lkohm54y] {
    display:block;
    color:var(--theme-muted);
    font-size:.86rem;
}

.source-data-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-46lkohm54y] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-46lkohm54y] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-46lkohm54y],
.reference-grid > div[b-46lkohm54y] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-46lkohm54y],
.reference-grid span[b-46lkohm54y] {
    display:block;
    color:#7e8f87;
    font-size:.86rem;
}

.vital-grid strong[b-46lkohm54y],
.reference-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:.98rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-46lkohm54y],
    .visit-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-46lkohm54y],
    .visit-type-overview[b-46lkohm54y],
    .target-grid[b-46lkohm54y],
    .care-metrics[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .vital-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.86rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.65;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-46lkohm54y] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.review > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.eligible > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.paid > span[b-46lkohm54y] { background:#73569b; }

.type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-46lkohm54y],
.type-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-46lkohm54y] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-46lkohm54y],
.target-grid button[b-46lkohm54y] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.budget-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.86rem;
}

/* TABLE */

.application-no-cell[b-46lkohm54y],
.welfare-type-cell[b-46lkohm54y],
.household-cell[b-46lkohm54y],
.amount-cell[b-46lkohm54y],
.officer-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-46lkohm54y],
.officer-cell[b-46lkohm54y] {
    min-width:210px;
}

.application-no-cell strong[b-46lkohm54y],
.welfare-type-cell strong[b-46lkohm54y],
.household-cell strong[b-46lkohm54y],
.amount-cell strong[b-46lkohm54y],
.officer-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-46lkohm54y],
.welfare-type-cell small[b-46lkohm54y],
.household-cell small[b-46lkohm54y],
.amount-cell small[b-46lkohm54y],
.officer-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:6px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.62;
}

.application-no-cell em[b-46lkohm54y],
.household-cell em[b-46lkohm54y],
.amount-cell em[b-46lkohm54y],
.officer-cell em[b-46lkohm54y],
.citizen-photo-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.source-group-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-46lkohm54y] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.source-group-chip[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-46lkohm54y] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-46lkohm54y],
.amount-preview[b-46lkohm54y] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-46lkohm54y] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-46lkohm54y] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-46lkohm54y],
.amount-preview > div[b-46lkohm54y] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-46lkohm54y],
.amount-preview small[b-46lkohm54y] {
    display:block;
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
}

.amount-preview small[b-46lkohm54y] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-46lkohm54y],
.amount-preview strong[b-46lkohm54y] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-46lkohm54y],
.amount-preview span[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.86rem;
    line-height:1.55;
}

.amount-document-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-46lkohm54y] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-46lkohm54y],
.amount-document-grid small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-document-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-46lkohm54y] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-46lkohm54y] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-46lkohm54y] {
    min-height:43px;
    font-size:.86rem;
}

/* LARGE TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-46lkohm54y] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-46lkohm54y],
    .type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .type-overview[b-46lkohm54y],
    .budget-grid[b-46lkohm54y],
    .target-grid[b-46lkohm54y],
    .care-metrics[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .assessment-preview[b-46lkohm54y],
    .amount-preview[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.66;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-46lkohm54y] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.payment > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.suspended > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.expiring > span[b-46lkohm54y] { background:#73569b; }

.target-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-46lkohm54y],
.target-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-46lkohm54y] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.target-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-46lkohm54y],
.follow-grid button[b-46lkohm54y] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.amount-metrics strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.86rem;
}

.follow-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-46lkohm54y] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-46lkohm54y] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
}

/* TABLE CELLS */

.registry-cell[b-46lkohm54y],
.benefit-cell[b-46lkohm54y],
.period-cell[b-46lkohm54y],
.amount-cell[b-46lkohm54y],
.payment-cycle-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-46lkohm54y] {
    min-width:225px;
}

.registry-cell strong[b-46lkohm54y],
.benefit-cell strong[b-46lkohm54y],
.period-cell strong[b-46lkohm54y],
.amount-cell strong[b-46lkohm54y],
.payment-cycle-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-46lkohm54y],
.benefit-cell small[b-46lkohm54y],
.period-cell small[b-46lkohm54y],
.amount-cell small[b-46lkohm54y],
.payment-cycle-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:6px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.62;
}

.registry-cell em[b-46lkohm54y],
.period-cell em[b-46lkohm54y],
.amount-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-46lkohm54y],
.cycle-chip[b-46lkohm54y],
.verify-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.source-group-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.benefit-chip.allowance[b-46lkohm54y] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-46lkohm54y] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-46lkohm54y] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-46lkohm54y] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-46lkohm54y] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.expired[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.source-group-chip[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-46lkohm54y] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-46lkohm54y] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
    line-height:1.55;
}

.amount-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-46lkohm54y] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-46lkohm54y] {
    display:block;
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
}

.amount-preview strong[b-46lkohm54y] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.86rem;
}

/* LARGE MUD TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-46lkohm54y] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-46lkohm54y] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-46lkohm54y],
    .target-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .target-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .condition-switch-grid[b-46lkohm54y],
    .amount-preview[b-46lkohm54y],
    .source-data-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .patient-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.66;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-46lkohm54y] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-46lkohm54y] { background:#687872; }
.status-overview-card.approval > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.processing > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.paid > span[b-46lkohm54y] { background:#34734b; }
.status-overview-card.failed > span[b-46lkohm54y] { background:#b54d43; }

.disbursement-progress[b-46lkohm54y] {
    margin-top:15px;
}

.disbursement-progress > div[b-46lkohm54y] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-46lkohm54y],
.amount-cell[b-46lkohm54y],
.progress-cell[b-46lkohm54y],
.date-cell[b-46lkohm54y],
.control-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-46lkohm54y] {
    min-width:245px;
}

.batch-cell strong[b-46lkohm54y],
.amount-cell strong[b-46lkohm54y],
.progress-cell strong[b-46lkohm54y],
.date-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-46lkohm54y],
.amount-cell small[b-46lkohm54y],
.progress-cell small[b-46lkohm54y],
.date-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:6px;
    color:#72847b;
    font-size:.86rem;
    line-height:1.62;
}

.batch-cell em[b-46lkohm54y],
.amount-cell em[b-46lkohm54y],
.date-cell em[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-46lkohm54y] {
    min-width:180px;
}

.recipient-stack[b-46lkohm54y] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-46lkohm54y],
.recipient-stack span[b-46lkohm54y] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-46lkohm54y] {
    margin-left:0;
}

.recipient-stack img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
}

.recipient-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.table-progress[b-46lkohm54y] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-46lkohm54y],
.approval-chip[b-46lkohm54y],
.reconcile-chip[b-46lkohm54y],
.cycle-chip[b-46lkohm54y],
.line-status-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.status-chip.draft[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.approved[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-46lkohm54y] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-46lkohm54y] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-46lkohm54y] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-46lkohm54y] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.control-cell[b-46lkohm54y] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-46lkohm54y] {
    align-items:center;
}

.selection-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-46lkohm54y] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-46lkohm54y] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-46lkohm54y] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-46lkohm54y] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.source-selection-summary strong[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-46lkohm54y] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-46lkohm54y] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-46lkohm54y],
.source-selection-table td[b-46lkohm54y] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.86rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-46lkohm54y] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.87rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-46lkohm54y] {
    background:#f0faf6;
}

.source-person-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-46lkohm54y] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-46lkohm54y],
.source-benefit-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-46lkohm54y],
.source-benefit-cell small[b-46lkohm54y],
.source-date[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.86rem;
}

.source-person-cell em[b-46lkohm54y] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.86rem;
    font-style:normal;
}

.source-benefit-cell[b-46lkohm54y] {
    min-width:190px;
}

.source-amount[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-46lkohm54y] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:750;
}

.bank-readiness span.ready[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.source-document-buttons[b-46lkohm54y] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-46lkohm54y] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-46lkohm54y] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-46lkohm54y] {
    display:block;
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
}

.amount-preview strong[b-46lkohm54y] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.86rem;
}

/* DETAIL */

.batch-overview-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-46lkohm54y] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-46lkohm54y] {
    font-size:3.5rem;
}

.batch-overview-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-46lkohm54y] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.print-line-table-wrap[b-46lkohm54y] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-46lkohm54y] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-46lkohm54y],
.print-line-table td[b-46lkohm54y] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.86rem;
    vertical-align:top;
}

.print-line-table th[b-46lkohm54y] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-46lkohm54y],
.print-line-table td small[b-46lkohm54y] {
    display:block;
}

.print-line-table td small[b-46lkohm54y] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-46lkohm54y] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-46lkohm54y] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-46lkohm54y] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-46lkohm54y] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.recipient-detail-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-46lkohm54y] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.recipient-detail-grid strong[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-46lkohm54y] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-46lkohm54y] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-46lkohm54y] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-46lkohm54y] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-46lkohm54y] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-46lkohm54y] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-46lkohm54y],
    .recipient-detail-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-46lkohm54y] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-46lkohm54y] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .source-selection-summary[b-46lkohm54y],
    .amount-preview[b-46lkohm54y],
    .recipient-detail-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-46lkohm54y] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-46lkohm54y] {
        overflow-x:auto;
    }

    .source-selection-table[b-46lkohm54y] {
        min-width:1050px;
    }

    .batch-overview-panel[b-46lkohm54y],
    .recipient-detail-card[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-46lkohm54y] {
        width:100%;
        height:190px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .batch-overview-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.66;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-46lkohm54y],
.type-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.full > span[b-46lkohm54y] { background:#c56b2a; }
.status-overview-card.overflow > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.maintenance > span[b-46lkohm54y] { background:#73569b; }

.type-overview[b-46lkohm54y] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-46lkohm54y],
.type-overview-card.selected[b-46lkohm54y] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-46lkohm54y] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-46lkohm54y] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-46lkohm54y] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
}

.type-overview-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-46lkohm54y] {
    margin-top:15px;
}

.fill-progress > div[b-46lkohm54y] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-46lkohm54y] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-46lkohm54y] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-46lkohm54y] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-46lkohm54y] {
    background:#987634;
}

.map-pin.full[b-46lkohm54y] {
    background:#c56b2a;
}

.map-pin.overflow[b-46lkohm54y] {
    background:#b54d43;
}

.map-pin.maintenance[b-46lkohm54y] {
    background:#73569b;
}

.map-pin.inactive[b-46lkohm54y] {
    background:#687872;
}

.map-pin span[b-46lkohm54y] {
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-46lkohm54y] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-46lkohm54y] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.86rem;
}

.map-board-legend i[b-46lkohm54y] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-46lkohm54y] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-46lkohm54y] { background:#987634; }
.map-board-legend i.full[b-46lkohm54y] { background:#b54d43; }
.map-board-legend i.maintenance[b-46lkohm54y] { background:#73569b; }

.map-board-caption[b-46lkohm54y] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-46lkohm54y],
.map-board-caption small[b-46lkohm54y] {
    display:block;
}

.map-board-caption strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-46lkohm54y] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

/* TABLE CELLS */

.point-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-46lkohm54y] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-46lkohm54y] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.point-photo-cell em[b-46lkohm54y] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-46lkohm54y],
.bin-cell[b-46lkohm54y],
.fill-cell[b-46lkohm54y],
.collection-cell[b-46lkohm54y],
.sensor-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-46lkohm54y] {
    min-width:220px;
}

.location-cell strong[b-46lkohm54y],
.bin-cell strong[b-46lkohm54y],
.fill-cell strong[b-46lkohm54y],
.collection-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-46lkohm54y],
.bin-cell small[b-46lkohm54y],
.fill-cell small[b-46lkohm54y],
.collection-cell small[b-46lkohm54y],
.sensor-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
    line-height:1.55;
}

.location-cell em[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.86rem;
    font-style:normal;
}

.waste-type-chip[b-46lkohm54y],
.collection-chip[b-46lkohm54y],
.sensor-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.waste-type-chip.general[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-46lkohm54y] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-46lkohm54y] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-46lkohm54y] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.status-chip.active[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.full[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.table-progress[b-46lkohm54y] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-46lkohm54y] { background:var(--theme-primary); }
.table-progress.medium span[b-46lkohm54y] { background:#2f789f; }
.table-progress.high span[b-46lkohm54y] { background:#987634; }
.table-progress.critical span[b-46lkohm54y] { background:#b54d43; }

.repair-alert[b-46lkohm54y],
.clean-alert[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.86rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-46lkohm54y] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-46lkohm54y] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-46lkohm54y] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-46lkohm54y] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-46lkohm54y] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-46lkohm54y] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-46lkohm54y] { background:#2f789f; }
.fill-preview-bin.high span[b-46lkohm54y] { background:#987634; }
.fill-preview-bin.critical span[b-46lkohm54y] { background:#b54d43; }

.fill-preview-bin strong[b-46lkohm54y] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-46lkohm54y] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-46lkohm54y] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
    line-height:1.55;
}

.source-photo-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
}

.source-photo-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-46lkohm54y] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-46lkohm54y] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-46lkohm54y] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.large-fill-indicator[b-46lkohm54y] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-46lkohm54y] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-46lkohm54y] { background:#2f789f; }
.large-fill-indicator.high > span[b-46lkohm54y] { background:#987634; }
.large-fill-indicator.critical > span[b-46lkohm54y] { background:#b54d43; }

.large-fill-indicator strong[b-46lkohm54y],
.large-fill-indicator small[b-46lkohm54y] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-46lkohm54y] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-46lkohm54y] {
    font-size:.86rem;
}

.detail-map-preview[b-46lkohm54y] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-46lkohm54y] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-46lkohm54y] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-46lkohm54y] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-46lkohm54y] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-46lkohm54y] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.86rem;
}

.workflow-button.collect[b-46lkohm54y] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-46lkohm54y] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-46lkohm54y],
    .type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-46lkohm54y] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-46lkohm54y] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-46lkohm54y] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .type-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .condition-switch-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-46lkohm54y],
    .fill-preview-card[b-46lkohm54y],
    .coordinate-preview[b-46lkohm54y],
    .collection-history-list article[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-46lkohm54y] {
        min-height:240px;
    }

    .large-fill-indicator[b-46lkohm54y],
    .fill-preview-bin[b-46lkohm54y],
    .coordinate-pin[b-46lkohm54y] {
        margin:0 auto;
    }

    .map-board[b-46lkohm54y] {
        min-height:500px;
    }

    .map-pin[b-46lkohm54y] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .point-cover-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.68;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.received > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.inspecting > span[b-46lkohm54y] { background:#2f789f; }
.status-overview-card.in-progress > span[b-46lkohm54y] { background:#73569b; }
.status-overview-card.resolved > span[b-46lkohm54y] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-46lkohm54y]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-46lkohm54y],
.pollution-type-card.selected[b-46lkohm54y] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.pollution-type-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-46lkohm54y] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-46lkohm54y] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-46lkohm54y] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-46lkohm54y] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-46lkohm54y] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-46lkohm54y] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-46lkohm54y] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-46lkohm54y] {
    margin-top:18px;
}

.sla-progress > div[b-46lkohm54y] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-46lkohm54y] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-46lkohm54y] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-46lkohm54y] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-46lkohm54y] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-46lkohm54y] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-46lkohm54y] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-46lkohm54y] { background:#2f789f; }
.pollution-map-pin.medium[b-46lkohm54y] { background:#987634; }
.pollution-map-pin.high[b-46lkohm54y] { background:#c56b2a; }
.pollution-map-pin.critical[b-46lkohm54y] { background:#b54d43; }

.pollution-map-pin span[b-46lkohm54y] {
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-46lkohm54y] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-46lkohm54y] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.86rem;
}

.map-board-legend i[b-46lkohm54y] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-46lkohm54y] { background:#2f789f; }
.map-board-legend i.medium[b-46lkohm54y] { background:#987634; }
.map-board-legend i.high[b-46lkohm54y] { background:#c56b2a; }
.map-board-legend i.critical[b-46lkohm54y] { background:#b54d43; }

.map-board-caption[b-46lkohm54y] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-46lkohm54y],
.map-board-caption small[b-46lkohm54y] {
    display:block;
}

.map-board-caption strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-46lkohm54y] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-46lkohm54y] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.complaint-photo-cell em[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.86rem;
    font-style:normal;
}

.type-severity-cell[b-46lkohm54y],
.reporter-cell[b-46lkohm54y],
.location-cell[b-46lkohm54y],
.inspection-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-46lkohm54y],
.location-cell[b-46lkohm54y] {
    min-width:195px;
}

.reporter-cell strong[b-46lkohm54y],
.location-cell strong[b-46lkohm54y],
.inspection-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-46lkohm54y],
.location-cell small[b-46lkohm54y],
.inspection-cell small[b-46lkohm54y],
.status-cell small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.reporter-cell em[b-46lkohm54y],
.location-cell em[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-style:normal;
}

.pollution-type-chip[b-46lkohm54y],
.severity-chip[b-46lkohm54y],
.inspection-chip[b-46lkohm54y],
.status-chip[b-46lkohm54y],
.overdue-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.pollution-type-chip.air[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-46lkohm54y] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-46lkohm54y] { color:#987634; background:#fff4df; }
.severity-chip.high[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-46lkohm54y] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-46lkohm54y] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-46lkohm54y] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-46lkohm54y] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-46lkohm54y] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

/* FORM */

.anonymous-switch-card[b-46lkohm54y] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-46lkohm54y],
.anonymous-switch-card small[b-46lkohm54y] {
    display:block;
}

.anonymous-switch-card strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-46lkohm54y] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.coordinate-preview[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-46lkohm54y],
.map-board-grid[b-46lkohm54y] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-46lkohm54y] { background:#c56b2a; }
.coordinate-pin.critical[b-46lkohm54y] { background:#b54d43; }
.coordinate-pin.medium[b-46lkohm54y] { background:#987634; }

.coordinate-pin .mud-icon-root[b-46lkohm54y] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-46lkohm54y] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.source-point-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-46lkohm54y] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-condition-row[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-46lkohm54y] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.86rem;
    font-weight:750;
}

.source-condition-row span.warning[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-46lkohm54y] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-46lkohm54y] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-46lkohm54y] { color:#987634; background:#fff4df; }

.measurement-preview small[b-46lkohm54y],
.measurement-preview strong[b-46lkohm54y],
.measurement-preview em[b-46lkohm54y] {
    display:block;
}

.measurement-preview small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.measurement-preview strong[b-46lkohm54y] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-46lkohm54y] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
    font-style:normal;
}

.source-photo-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
}

.source-photo-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-46lkohm54y] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-46lkohm54y] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-46lkohm54y] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.severity-emblem[b-46lkohm54y] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-46lkohm54y] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-46lkohm54y] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-46lkohm54y] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-46lkohm54y] {
    font-size:2.25rem;
}

.severity-emblem strong[b-46lkohm54y] {
    font-size:1.10rem;
}

.severity-emblem small[b-46lkohm54y] {
    font-size:.86rem;
}

.measurement-document-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-46lkohm54y] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-46lkohm54y],
.measurement-document-grid strong[b-46lkohm54y] {
    display:block;
}

.measurement-document-grid span[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.measurement-document-grid strong[b-46lkohm54y] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-46lkohm54y] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-46lkohm54y] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-46lkohm54y] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-46lkohm54y] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-46lkohm54y] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-46lkohm54y] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-46lkohm54y] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-46lkohm54y] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-46lkohm54y] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-46lkohm54y] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-46lkohm54y] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-46lkohm54y] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-46lkohm54y] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-46lkohm54y],
    .source-photo-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-46lkohm54y],
    .source-photo-preview button[b-46lkohm54y] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .pollution-type-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .measurement-preview[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-46lkohm54y],
    .coordinate-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-46lkohm54y] {
        height:250px;
    }

    .coordinate-pin[b-46lkohm54y] {
        margin:0 auto;
    }

    .pollution-map-board[b-46lkohm54y] {
        min-height:500px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .complaint-cover-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.68;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.polluted > span[b-46lkohm54y] { background:#c56b2a; }
.status-overview-card.critical > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.restoring > span[b-46lkohm54y] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-46lkohm54y]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-46lkohm54y],
.institution-type-card.selected[b-46lkohm54y] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.institution-type-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-46lkohm54y] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-46lkohm54y] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-46lkohm54y] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-46lkohm54y] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-46lkohm54y] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-46lkohm54y] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-46lkohm54y] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.education-metric-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.education-metric-grid article[b-46lkohm54y] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.education-metric-grid article > span[b-46lkohm54y] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.education-metric-grid article.ph > span[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.education-metric-grid article.do > span[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.education-metric-grid article.bod > span[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.education-metric-grid article.turbidity > span[b-46lkohm54y] { color:#987634; background:#fff4df; }

.education-metric-grid small[b-46lkohm54y],
.education-metric-grid strong[b-46lkohm54y],
.education-metric-grid em[b-46lkohm54y] {
    display:block;
}

.education-metric-grid small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.education-metric-grid strong[b-46lkohm54y] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.education-metric-grid em[b-46lkohm54y] {
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-46lkohm54y] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-46lkohm54y] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-46lkohm54y] { background:var(--theme-primary); }
.education-map-pin.watch[b-46lkohm54y] { background:#987634; }
.education-map-pin.polluted[b-46lkohm54y] { background:#c56b2a; }
.education-map-pin.critical[b-46lkohm54y] { background:#b54d43; }
.education-map-pin.restoring[b-46lkohm54y] { background:#73569b; }
.education-map-pin.closed[b-46lkohm54y] { background:#687872; }

.education-map-pin span[b-46lkohm54y] {
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-46lkohm54y] { background:var(--theme-primary); }
.map-board-legend i.watch[b-46lkohm54y] { background:#987634; }
.map-board-legend i.polluted[b-46lkohm54y] { background:#c56b2a; }
.map-board-legend i.critical[b-46lkohm54y] { background:#b54d43; }
.map-board-legend i.restoring[b-46lkohm54y] { background:#73569b; }

/* TABLE */

.institution-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.institution-photo-mini[b-46lkohm54y] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.institution-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.institution-photo-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.institution-photo-cell small[b-46lkohm54y],
.institution-photo-cell em[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.institution-photo-cell em[b-46lkohm54y] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-46lkohm54y],
.latest-assessment-cell[b-46lkohm54y],
.inspection-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-46lkohm54y],
.quality-status-chip[b-46lkohm54y],
.usage-chip[b-46lkohm54y],
.lab-chip[b-46lkohm54y],
.no-assessment-chip[b-46lkohm54y],
.overdue-chip[b-46lkohm54y],
.follow-up-chip[b-46lkohm54y],
.complaint-count-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.institution-type-chip.canal[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-46lkohm54y] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-46lkohm54y] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-46lkohm54y] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-46lkohm54y] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.usage-chip[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.no-assessment-chip[b-46lkohm54y] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.latest-assessment-cell strong[b-46lkohm54y],
.inspection-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-assessment-cell small[b-46lkohm54y],
.inspection-cell small[b-46lkohm54y],
.type-level-cell small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.size-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-46lkohm54y] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.86rem;
}

.size-cell strong[b-46lkohm54y] {
    color:#2f789f;
    font-size:.88rem;
}

.row-action.sample[b-46lkohm54y] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-46lkohm54y] { background:var(--theme-primary); }
.coordinate-pin.watch[b-46lkohm54y] { background:#987634; }
.coordinate-pin.polluted[b-46lkohm54y] { background:#c56b2a; }
.coordinate-pin.critical[b-46lkohm54y] { background:#b54d43; }
.coordinate-pin.restoring[b-46lkohm54y] { background:#73569b; }
.coordinate-pin.closed[b-46lkohm54y] { background:#687872; }

.coordinate-pin .mud-icon-root[b-46lkohm54y] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-46lkohm54y] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-46lkohm54y] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.linked-photo-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-46lkohm54y] {
    color:#73569b;
    font-size:.86rem;
    font-weight:800;
}

.linked-photo-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-46lkohm54y] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.linked-photo-preview button[b-46lkohm54y] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.assessment-form-modal[b-46lkohm54y] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.assessment-score-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.assessment-score-grid article[b-46lkohm54y] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.assessment-score-grid small[b-46lkohm54y],
.assessment-score-grid strong[b-46lkohm54y],
.assessment-score-grid span[b-46lkohm54y] {
    display:block;
}

.assessment-score-grid small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.assessment-score-grid strong[b-46lkohm54y] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.assessment-score-grid span[b-46lkohm54y] {
    margin-top:5px;
    color:#2f789f;
    font-size:.86rem;
}

.assessment-score-grid article.ph[b-46lkohm54y] { border-top:4px solid #73569b; }
.assessment-score-grid article.do[b-46lkohm54y] { border-top:4px solid #2f789f; }
.assessment-score-grid article.bod[b-46lkohm54y] { border-top:4px solid #c56b2a; }
.assessment-score-grid article.cod[b-46lkohm54y] { border-top:4px solid #b54d43; }
.assessment-score-grid article.turbidity[b-46lkohm54y] { border-top:4px solid #987634; }
.assessment-score-grid article.coliform[b-46lkohm54y] { border-top:4px solid var(--theme-primary); }

.assessment-photo-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-46lkohm54y] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-46lkohm54y] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.education-emblem[b-46lkohm54y] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-46lkohm54y] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-46lkohm54y] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-46lkohm54y] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-46lkohm54y] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-46lkohm54y] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-46lkohm54y] {
    font-size:2.25rem;
}

.education-emblem strong[b-46lkohm54y] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-46lkohm54y] {
    font-size:.86rem;
}

.measurement-document-grid[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-46lkohm54y] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-46lkohm54y],
.measurement-document-grid strong[b-46lkohm54y] {
    display:block;
}

.measurement-document-grid span[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.measurement-document-grid strong[b-46lkohm54y] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.assessment-history-panel[b-46lkohm54y],
.linked-complaint-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.assessment-card-list[b-46lkohm54y],
.linked-complaint-list[b-46lkohm54y] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.assessment-card[b-46lkohm54y] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.assessment-card.good[b-46lkohm54y] { border-left-color:var(--theme-primary); }
.assessment-card.watch[b-46lkohm54y] { border-left-color:#987634; }
.assessment-card.polluted[b-46lkohm54y] { border-left-color:#c56b2a; }
.assessment-card.critical[b-46lkohm54y] { border-left-color:#b54d43; }
.assessment-card.restoring[b-46lkohm54y] { border-left-color:#73569b; }

.assessment-card-head[b-46lkohm54y] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.assessment-card-head strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.assessment-card-head small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.assessment-card-metrics[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-card-metrics span[b-46lkohm54y] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.86rem;
}

.assessment-card-metrics strong[b-46lkohm54y] {
    color:#2f789f;
}

.assessment-card p[b-46lkohm54y] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.assessment-photo-actions[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-46lkohm54y] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    cursor:pointer;
}

.linked-complaint-list article[b-46lkohm54y] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-46lkohm54y] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.86rem;
}

.linked-complaint-list p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.86rem;
}

.linked-complaint-list a[b-46lkohm54y] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.86rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-46lkohm54y] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-46lkohm54y] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .institution-type-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .amount-document-grid[b-46lkohm54y],
    .assessment-photo-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-46lkohm54y],
    .coordinate-preview[b-46lkohm54y],
    .linked-complaint-list article[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-46lkohm54y] {
        height:250px;
    }

    .coordinate-pin[b-46lkohm54y] {
        margin:0 auto;
    }

    .education-map-board[b-46lkohm54y] {
        min-height:500px;
    }

    .linked-complaint-list button[b-46lkohm54y] {
        height:210px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .education-cover-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.68;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-46lkohm54y] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-46lkohm54y] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.diseased > span[b-46lkohm54y] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-46lkohm54y] { background:#b54d43; }
.status-overview-card.treatment > span[b-46lkohm54y] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-46lkohm54y]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-46lkohm54y],
.institution-type-card.selected[b-46lkohm54y] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.86rem;
    font-weight:700;
}

.institution-type-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-46lkohm54y] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-46lkohm54y] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-46lkohm54y] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-46lkohm54y] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-46lkohm54y] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-46lkohm54y] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-46lkohm54y] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.education-metric-grid article.carbon > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.education-metric-grid article.photo > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.education-metric-grid article.maintenance > span[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.education-metric-grid article.treatment > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-46lkohm54y] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-46lkohm54y] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-46lkohm54y] { background:var(--theme-primary); }
.education-map-pin.watch[b-46lkohm54y] { background:#987634; }
.education-map-pin.diseased[b-46lkohm54y] { background:#c56b2a; }
.education-map-pin.hazardous[b-46lkohm54y] { background:#b54d43; }
.education-map-pin.treatment[b-46lkohm54y] { background:#73569b; }
.education-map-pin.removed[b-46lkohm54y] { background:#687872; }

.education-map-pin span[b-46lkohm54y] {
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-46lkohm54y] { background:var(--theme-primary); }
.map-board-legend i.watch[b-46lkohm54y] { background:#987634; }
.map-board-legend i.diseased[b-46lkohm54y] { background:#c56b2a; }
.map-board-legend i.hazardous[b-46lkohm54y] { background:#b54d43; }
.map-board-legend i.treatment[b-46lkohm54y] { background:#73569b; }

/* TABLE */

.institution-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.institution-photo-mini[b-46lkohm54y] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.institution-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.institution-photo-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.institution-photo-cell small[b-46lkohm54y],
.institution-photo-cell em[b-46lkohm54y] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.86rem;
}

.institution-photo-cell em[b-46lkohm54y] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-46lkohm54y],
.latest-assessment-cell[b-46lkohm54y],
.maintenance-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-46lkohm54y],
.health-status-chip[b-46lkohm54y],
.risk-chip[b-46lkohm54y],
.health-score-chip[b-46lkohm54y],
.no-assessment-chip[b-46lkohm54y],
.overdue-chip[b-46lkohm54y],
.urgent-chip[b-46lkohm54y],
.water-link-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-46lkohm54y] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-46lkohm54y] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-46lkohm54y] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-46lkohm54y] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-46lkohm54y] { color:#987634; background:#fff4df; }
.risk-chip.high[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-46lkohm54y] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.no-assessment-chip[b-46lkohm54y] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-46lkohm54y],
.urgent-chip[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-46lkohm54y],
.latest-assessment-cell strong[b-46lkohm54y],
.maintenance-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-46lkohm54y],
.latest-assessment-cell small[b-46lkohm54y],
.maintenance-cell small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.size-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-46lkohm54y] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.86rem;
}

.size-cell strong[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.88rem;
}

.size-cell em[b-46lkohm54y] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.86rem;
    font-style:normal;
}

.row-action.inspect[b-46lkohm54y] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-46lkohm54y] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-46lkohm54y] {
    color:#2f789f;
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

/* INSPECTION */

.assessment-form-modal[b-46lkohm54y] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.assessment-score-grid article.good[b-46lkohm54y] {
    border-top:4px solid var(--theme-primary);
}

.assessment-score-grid article.watch[b-46lkohm54y] {
    border-top:4px solid #987634;
}

.assessment-score-grid article.diseased[b-46lkohm54y],
.assessment-score-grid article.high[b-46lkohm54y] {
    border-top:4px solid #c56b2a;
}

.assessment-score-grid article.hazardous[b-46lkohm54y],
.assessment-score-grid article.critical[b-46lkohm54y] {
    border-top:4px solid #b54d43;
}

.assessment-score-grid article.medium[b-46lkohm54y] {
    border-top:4px solid #987634;
}

.assessment-score-grid article.low[b-46lkohm54y] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-46lkohm54y] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-46lkohm54y] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.education-emblem[b-46lkohm54y] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-46lkohm54y] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-46lkohm54y] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-46lkohm54y] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-46lkohm54y] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-46lkohm54y] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-46lkohm54y] {
    font-size:2.25rem;
}

.education-emblem strong[b-46lkohm54y] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-46lkohm54y] {
    font-size:.86rem;
}

.assessment-history-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.assessment-card[b-46lkohm54y] {
    border-left:5px solid var(--theme-primary);
}

.assessment-card.medium[b-46lkohm54y],
.assessment-card.watch[b-46lkohm54y] {
    border-left-color:#987634;
}

.assessment-card.high[b-46lkohm54y],
.assessment-card.diseased[b-46lkohm54y] {
    border-left-color:#c56b2a;
}

.assessment-card.critical[b-46lkohm54y],
.assessment-card.hazardous[b-46lkohm54y] {
    border-left-color:#b54d43;
}

.view-assess-button[b-46lkohm54y] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-46lkohm54y] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-46lkohm54y] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-46lkohm54y] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-46lkohm54y],
    .source-photo-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .institution-type-overview[b-46lkohm54y],
    .amount-metrics[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .assessment-photo-grid[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-46lkohm54y],
    .coordinate-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-46lkohm54y] {
        height:250px;
    }

    .coordinate-pin[b-46lkohm54y] {
        margin:0 auto;
    }

    .education-map-board[b-46lkohm54y] {
        min-height:500px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .education-cover-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.education-page[b-46lkohm54y] {
    font-size:17px;
    line-height:1.72;
}

.education-hero[b-46lkohm54y] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-46lkohm54y] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-46lkohm54y] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-46lkohm54y] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-46lkohm54y] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-46lkohm54y] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-46lkohm54y] { background:var(--theme-primary); }
.status-overview-card.full > span[b-46lkohm54y] { background:#987634; }
.status-overview-card.maintenance > span[b-46lkohm54y] { background:#c56b2a; }
.status-overview-card.review > span[b-46lkohm54y] { background:#73569b; }
.status-overview-card.temp-closed > span[b-46lkohm54y] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-46lkohm54y] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-46lkohm54y]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-46lkohm54y],
.institution-type-card.selected[b-46lkohm54y] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-46lkohm54y] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-46lkohm54y] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-46lkohm54y] {
    display:block;
    color:#71837a;
    font-size:.88rem;
    font-weight:700;
}

.institution-type-card strong[b-46lkohm54y] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-46lkohm54y] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-46lkohm54y] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-46lkohm54y] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-46lkohm54y] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-46lkohm54y] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-46lkohm54y] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.education-metric-grid article.attendance > span[b-46lkohm54y] {
    color:#2f789f;
    background:#e8f3f8;
}

.education-metric-grid article.health > span[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.education-metric-grid article.assessment > span[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.education-metric-grid article.green > span[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-46lkohm54y] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-46lkohm54y] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-46lkohm54y] { background:var(--theme-primary); }
.education-map-pin.full[b-46lkohm54y] { background:#987634; }
.education-map-pin.maintenance[b-46lkohm54y] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-46lkohm54y] { background:#73569b; }
.education-map-pin.temp-closed[b-46lkohm54y],
.education-map-pin.inactive[b-46lkohm54y] { background:#b54d43; }

.education-map-pin span[b-46lkohm54y] {
    font-family:'Kanit',sans-serif;
    font-size:.86rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-46lkohm54y] { background:var(--theme-primary); }
.map-board-legend i.full[b-46lkohm54y] { background:#987634; }
.map-board-legend i.maintenance[b-46lkohm54y] { background:#c56b2a; }
.map-board-legend i.review[b-46lkohm54y] { background:#73569b; }
.map-board-legend i.closed[b-46lkohm54y] { background:#b54d43; }

/* TABLE */

.institution-photo-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.institution-photo-mini[b-46lkohm54y] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.institution-photo-mini img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.institution-photo-cell strong[b-46lkohm54y] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.institution-photo-cell small[b-46lkohm54y],
.institution-photo-cell em[b-46lkohm54y] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.86rem;
}

.institution-photo-cell em[b-46lkohm54y] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-46lkohm54y],
.latest-assessment-cell[b-46lkohm54y],
.assessment-date-cell[b-46lkohm54y],
.status-cell[b-46lkohm54y] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-46lkohm54y],
.institution-status-chip[b-46lkohm54y],
.accreditation-chip[b-46lkohm54y],
.assessment-result-chip[b-46lkohm54y],
.no-assessment-chip[b-46lkohm54y],
.overdue-chip[b-46lkohm54y],
.due-chip[b-46lkohm54y],
.green-link-chip[b-46lkohm54y] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.86rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-46lkohm54y] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-46lkohm54y] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-46lkohm54y] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-46lkohm54y] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-46lkohm54y] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-46lkohm54y] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-46lkohm54y] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-46lkohm54y] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-46lkohm54y],
.assessment-result-chip.passed[b-46lkohm54y],
.assessment-result-chip.excellent[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-46lkohm54y],
.assessment-result-chip.conditional[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-46lkohm54y],
.assessment-result-chip.review[b-46lkohm54y] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-46lkohm54y],
.accreditation-chip.not-assessed[b-46lkohm54y] {
    color:#687872;
    background:#edf1ef;
}

.no-assessment-chip[b-46lkohm54y] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-46lkohm54y] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-46lkohm54y] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-46lkohm54y] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-46lkohm54y],
.latest-assessment-cell small[b-46lkohm54y],
.assessment-date-cell small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.latest-assessment-cell strong[b-46lkohm54y],
.assessment-date-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-46lkohm54y] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-46lkohm54y] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-46lkohm54y] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
}

.occupancy-track[b-46lkohm54y] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-46lkohm54y] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
    line-height:1.55;
}

.personnel-cell[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-46lkohm54y] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.86rem;
}

.personnel-cell strong[b-46lkohm54y] {
    color:var(--theme-primary);
}

.personnel-cell em[b-46lkohm54y] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.86rem;
    font-style:normal;
}

.row-action.assess[b-46lkohm54y] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-46lkohm54y] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-46lkohm54y],
.capacity-preview strong[b-46lkohm54y] {
    display:block;
}

.capacity-preview small[b-46lkohm54y] {
    color:#71837a;
    font-size:.86rem;
}

.capacity-preview strong[b-46lkohm54y] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-46lkohm54y] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-46lkohm54y] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-46lkohm54y] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-46lkohm54y] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.assessment-form-modal[b-46lkohm54y] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.assessment-score-grid article.excellent[b-46lkohm54y],
.assessment-score-grid article.passed[b-46lkohm54y] {
    border-top:4px solid var(--theme-primary);
}

.assessment-score-grid article.conditional[b-46lkohm54y] {
    border-top:4px solid #987634;
}

.assessment-score-grid article.review[b-46lkohm54y] {
    border-top:4px solid #b54d43;
}

.assessment-card.excellent[b-46lkohm54y],
.assessment-card.passed[b-46lkohm54y] {
    border-left-color:var(--theme-primary);
}

.assessment-card.conditional[b-46lkohm54y] {
    border-left-color:#987634;
}

.assessment-card.review[b-46lkohm54y] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-46lkohm54y] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-46lkohm54y] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-46lkohm54y] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-46lkohm54y] {
    color:var(--theme-primary);
    font-size:.86rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-46lkohm54y] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-46lkohm54y] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-46lkohm54y] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-46lkohm54y] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.86rem;
    font-weight:750;
}

.education-emblem[b-46lkohm54y] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-46lkohm54y] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-46lkohm54y] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-46lkohm54y] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-46lkohm54y] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-46lkohm54y] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-46lkohm54y] {
    font-size:2.25rem;
}

.education-emblem strong[b-46lkohm54y] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-46lkohm54y] {
    font-size:.86rem;
}

.assessment-history-panel[b-46lkohm54y] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-assess-button[b-46lkohm54y] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-46lkohm54y] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-46lkohm54y] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-46lkohm54y] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-46lkohm54y] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-46lkohm54y] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-46lkohm54y] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-46lkohm54y] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.education-page[b-46lkohm54y]  .education-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.education-page[b-46lkohm54y]  .education-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.education-page[b-46lkohm54y]  .mud-input,
.education-page[b-46lkohm54y]  .mud-select-input {
    font-size:1.04rem !important;
}

.education-page[b-46lkohm54y]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.education-page[b-46lkohm54y]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.education-page[b-46lkohm54y]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-46lkohm54y] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-46lkohm54y] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-46lkohm54y] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-46lkohm54y],
    .source-photo-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-46lkohm54y],
    .institution-type-overview[b-46lkohm54y],
    .follow-grid[b-46lkohm54y],
    .education-metric-grid[b-46lkohm54y],
    .measurement-document-grid[b-46lkohm54y],
    .assessment-score-grid[b-46lkohm54y],
    .reference-grid[b-46lkohm54y],
    .assessment-photo-grid[b-46lkohm54y],
    .capacity-preview[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-46lkohm54y] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-46lkohm54y] {
        height:250px;
    }

    .education-map-board[b-46lkohm54y] {
        min-height:500px;
    }

    .education-page[b-46lkohm54y]  .education-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #education-profile-print-area[b-46lkohm54y],
    #education-profile-print-area *[b-46lkohm54y] {
        visibility:visible !important;
    }

    #education-profile-print-area[b-46lkohm54y] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .education-view-modal[b-46lkohm54y] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-46lkohm54y],
    .document-status-strip[b-46lkohm54y],
    .education-cover-panel[b-46lkohm54y],
    .document-section[b-46lkohm54y],
    .document-footer[b-46lkohm54y] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/06EducationandActivities/EducationStudents.razor.rz.scp.css */
:root[b-h10z1zruq4] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.student-page[b-h10z1zruq4] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.student-page[b-h10z1zruq4]  .student-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.student-hero[b-h10z1zruq4] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-h10z1zruq4] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-h10z1zruq4] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-h10z1zruq4],
.hero-action-panel[b-h10z1zruq4] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-h10z1zruq4] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-h10z1zruq4] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-h10z1zruq4] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-h10z1zruq4] {
    color: #d8ede6;
    font-size: .88rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-h10z1zruq4] {
    margin-top: 3px;
    font-size: .94rem;
}

.student-hero h1[b-h10z1zruq4] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.student-hero p[b-h10z1zruq4] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-h10z1zruq4] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .88rem;
    font-weight: 650;
}

.hero-action-panel[b-h10z1zruq4] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-h10z1zruq4] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-h10z1zruq4] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-h10z1zruq4] {
    font-size: .88rem;
}

.hero-status small[b-h10z1zruq4] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.student-page[b-h10z1zruq4]  .hero-add-button,
.student-page[b-h10z1zruq4]  .toolbar-add-button,
.student-page[b-h10z1zruq4]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .88rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.student-page[b-h10z1zruq4]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-h10z1zruq4],
.hero-refresh-button[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-h10z1zruq4] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-h10z1zruq4] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-h10z1zruq4] {
    opacity: .55;
    cursor: wait;
}

.student-page[b-h10z1zruq4]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.student-page[b-h10z1zruq4]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-h10z1zruq4] {
    margin-top: 2px !important;
}

.summary-card[b-h10z1zruq4] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-h10z1zruq4] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-h10z1zruq4] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-h10z1zruq4] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-h10z1zruq4] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-h10z1zruq4] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-h10z1zruq4] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-h10z1zruq4] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-h10z1zruq4] {
    color: #788982;
    font-size: .88rem;
    font-weight: 650;
}

.summary-card p[b-h10z1zruq4] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-h10z1zruq4] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-h10z1zruq4] {
    color: #798a83;
    font-size: .88rem;
}

.summary-card em[b-h10z1zruq4] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .88rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-h10z1zruq4],
.status-overview-card.selected[b-h10z1zruq4] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-h10z1zruq4] {
    background: #f5faf7;
}

.status-overview-card > span[b-h10z1zruq4] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-h10z1zruq4] { background:#687872; }
.status-overview-card.reviewing > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.difference > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.approved > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.closed > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.voided > span[b-h10z1zruq4] { background:#687872; }
.status-overview-card.today > span[b-h10z1zruq4] { background:#73569b; }

.status-overview-card div[b-h10z1zruq4] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-h10z1zruq4] {
    color: var(--theme-muted);
    font-size: .88rem;
}

.status-overview-card strong[b-h10z1zruq4] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-h10z1zruq4] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-h10z1zruq4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-h10z1zruq4] {
    color: #987634;
    font-size: .88rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-h10z1zruq4] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .88rem;
    font-weight: 700;
}

.variance-grid[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-h10z1zruq4] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-h10z1zruq4] {
    display: block;
    color: #3c5047;
    font-size: .88rem;
}

.variance-card small[b-h10z1zruq4] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .88rem;
}

.closing-progress[b-h10z1zruq4] {
    margin-top: 13px;
}

.progress-track[b-h10z1zruq4] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-h10z1zruq4] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-h10z1zruq4] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-h10z1zruq4] {
    display: block;
    color: #87958f;
    font-size: .88rem;
}

.progress-metrics strong[b-h10z1zruq4] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-h10z1zruq4],
.student-list-panel[b-h10z1zruq4] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-h10z1zruq4] {
    padding: 15px;
}

.filter-heading[b-h10z1zruq4],
.list-toolbar[b-h10z1zruq4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-h10z1zruq4],
.panel-kicker[b-h10z1zruq4] {
    color: #987634;
    font-size: .88rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-h10z1zruq4],
.list-toolbar h2[b-h10z1zruq4] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-h10z1zruq4],
.list-toolbar p[b-h10z1zruq4] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .88rem;
    line-height: 1.65;
}

.clear-filter-button[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .88rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-h10z1zruq4] {
    margin-top: 8px !important;
}

.student-page[b-h10z1zruq4]  .premium-field,
.student-page[b-h10z1zruq4]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.student-page[b-h10z1zruq4]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .88rem !important;
    text-transform: none !important;
}

.filter-summary[b-h10z1zruq4] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .88rem;
}

.filter-summary strong[b-h10z1zruq4] {
    color: var(--theme-primary);
}

.student-list-panel[b-h10z1zruq4] {
    overflow: hidden;
}

.list-toolbar[b-h10z1zruq4] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.student-page[b-h10z1zruq4]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-h10z1zruq4] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-h10z1zruq4] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-h10z1zruq4] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-h10z1zruq4] {
    margin: 0;
    font-size: .88rem;
}

.student-page[b-h10z1zruq4]  .student-table {
    font-family: 'Kanit',sans-serif;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head {
    background: #f1f7f4;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .88rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-h10z1zruq4] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-h10z1zruq4] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-h10z1zruq4] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .88rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-h10z1zruq4] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .88rem;
}

.date-shift-cell[b-h10z1zruq4],
.counter-cashier-cell[b-h10z1zruq4],
.money-cell[b-h10z1zruq4],
.difference-cell[b-h10z1zruq4],
.transaction-status-cell[b-h10z1zruq4] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-h10z1zruq4] {
    min-width: 175px;
}

.date-shift-cell strong[b-h10z1zruq4],
.counter-cashier-cell strong[b-h10z1zruq4],
.money-cell strong[b-h10z1zruq4],
.difference-cell strong[b-h10z1zruq4],
.transaction-status-cell strong[b-h10z1zruq4] {
    color: #3c5047;
    font-size: .88rem;
    line-height: 1.48;
}

.date-shift-cell small[b-h10z1zruq4],
.counter-cashier-cell small[b-h10z1zruq4],
.money-cell small[b-h10z1zruq4],
.difference-cell small[b-h10z1zruq4] {
    margin-top: 3px;
    color: #84928d;
    font-size: .88rem;
}

.date-shift-cell em[b-h10z1zruq4],
.counter-cashier-cell em[b-h10z1zruq4] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .88rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-h10z1zruq4] { color:var(--theme-primary); }
.money-cell.actual strong[b-h10z1zruq4] { color:#2f789f; }

.difference-cell.matched strong[b-h10z1zruq4] { color:#34734b; }
.difference-cell.over strong[b-h10z1zruq4] { color:#987634; }
.difference-cell.short strong[b-h10z1zruq4] { color:#b54d43; }

.status-chip[b-h10z1zruq4],
.match-chip[b-h10z1zruq4] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .88rem;
    font-weight: 700;
}

.status-chip i[b-h10z1zruq4] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.difference[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-h10z1zruq4] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-h10z1zruq4] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.student-page[b-h10z1zruq4]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.student-page[b-h10z1zruq4]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.student-page[b-h10z1zruq4]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.student-page[b-h10z1zruq4]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.student-page[b-h10z1zruq4]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-h10z1zruq4] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-h10z1zruq4] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .88rem;
}

/* MODALS */

.modal-backdrop[b-h10z1zruq4],
.image-preview-backdrop[b-h10z1zruq4] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.student-form-modal[b-h10z1zruq4],
.student-view-modal[b-h10z1zruq4],
.delete-modal[b-h10z1zruq4],
.image-preview-modal[b-h10z1zruq4] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-h10z1zruq4],
.view-toolbar[b-h10z1zruq4],
.image-preview-header[b-h10z1zruq4] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-h10z1zruq4] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-h10z1zruq4] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-h10z1zruq4],
.view-toolbar small[b-h10z1zruq4],
.image-preview-header small[b-h10z1zruq4] {
    color:#987634;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-h10z1zruq4],
.view-toolbar h2[b-h10z1zruq4],
.image-preview-header h3[b-h10z1zruq4] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-h10z1zruq4] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.88rem;
}

.modal-body[b-h10z1zruq4],
.view-scroll[b-h10z1zruq4] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-h10z1zruq4] {
    background: #e9efec;
}

.modal-footer[b-h10z1zruq4] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.student-page[b-h10z1zruq4]  .cancel-button,
.student-page[b-h10z1zruq4]  .save-button,
.student-page[b-h10z1zruq4]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.88rem !important;
    text-transform:none !important;
}

.form-section-title[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-h10z1zruq4] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-h10z1zruq4] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-h10z1zruq4] {
    display:block;
    color:#3c5047;
    font-size:.88rem;
}

.form-section-title small[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.88rem;
}

.open-transactions-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-h10z1zruq4] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-h10z1zruq4],
.calculation-heading[b-h10z1zruq4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-h10z1zruq4],
.calculation-heading small[b-h10z1zruq4] {
    color: #987634;
    font-size: .88rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-h10z1zruq4],
.calculation-heading h3[b-h10z1zruq4] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-h10z1zruq4],
.calculation-heading > span[b-h10z1zruq4] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .88rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-h10z1zruq4] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-h10z1zruq4] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.source-summary-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.system-amount-grid[b-h10z1zruq4] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-h10z1zruq4] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-h10z1zruq4] {
    display:block;
    color:#84928d;
    font-size:.88rem;
}

.system-amount-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.88rem;
}

.reconciliation-calculation-preview[b-h10z1zruq4] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-h10z1zruq4] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-h10z1zruq4] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-h10z1zruq4] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-h10z1zruq4] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-h10z1zruq4] {
    display:block;
    color:#8b7b74;
    font-size:.88rem;
}

.calculation-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.88rem;
}

.calculation-grid .short span[b-h10z1zruq4],
.calculation-grid .short strong[b-h10z1zruq4],
.calculation-grid .short small[b-h10z1zruq4] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-h10z1zruq4] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-h10z1zruq4] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-h10z1zruq4] {
    display:block;
    color:#3c5047;
    font-size:.88rem;
}

.photo-upload-heading small[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.88rem;
}

.photo-preview[b-h10z1zruq4] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-h10z1zruq4] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-h10z1zruq4] {
    color:#40544b;
    font-size:.88rem;
}

.photo-empty small[b-h10z1zruq4] {
    font-size:.88rem;
}

.photo-upload-actions[b-h10z1zruq4] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-h10z1zruq4],
.remove-photo-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-h10z1zruq4] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-h10z1zruq4] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-h10z1zruq4] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-h10z1zruq4],
.detail-transaction-table[b-h10z1zruq4] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-h10z1zruq4],
.source-transaction-row[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-h10z1zruq4] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-h10z1zruq4],
.source-transaction-row > span[b-h10z1zruq4] {
    padding:7px;
    font-size:.88rem;
}

.source-transaction-row[b-h10z1zruq4] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-h10z1zruq4] {
    border-bottom:0;
}

.mini-photo-button[b-h10z1zruq4] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-h10z1zruq4],
.source-transaction-more[b-h10z1zruq4] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.88rem;
    text-align:center;
}

.mock-rule-warning[b-h10z1zruq4] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.88rem !important;
}

/* VIEW & PRINT */

.student-view-modal[b-h10z1zruq4] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
}

.student-page[b-h10z1zruq4]  .view-edit-button,
.student-page[b-h10z1zruq4]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.88rem !important;
    text-transform:none !important;
}

.student-page[b-h10z1zruq4]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-student-profile[b-h10z1zruq4] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-h10z1zruq4] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-h10z1zruq4] {
    text-align:center;
}

.document-organization small[b-h10z1zruq4] {
    color:#987634;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-h10z1zruq4] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-h10z1zruq4] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.88rem;
}

.document-number-box[b-h10z1zruq4] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-h10z1zruq4],
.document-number-box small[b-h10z1zruq4] {
    display:block;
    color:#778980;
    font-size:.88rem;
}

.document-number-box strong[b-h10z1zruq4] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.88rem;
    word-break:break-word;
}

.document-status-strip[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-h10z1zruq4] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-h10z1zruq4] {
    display:block;
    color:#83918b;
    font-size:.88rem;
}

.document-status-strip > div strong[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.88rem;
}

.scope-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-h10z1zruq4] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-h10z1zruq4] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.88rem;
}

.scope-reference-box[b-h10z1zruq4] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.scope-reference-box strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.88rem;
}

.scope-reference-box small[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-h10z1zruq4],
.transaction-summary-section[b-h10z1zruq4],
.source-transaction-section[b-h10z1zruq4],
.review-section[b-h10z1zruq4] {
    margin-top:16px;
}

.section-title[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-h10z1zruq4] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.88rem;
    font-weight:800;
}

.section-title small[b-h10z1zruq4] {
    color:#987634;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-h10z1zruq4] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-h10z1zruq4] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-h10z1zruq4],
.comparison-row[b-h10z1zruq4],
.comparison-total[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-h10z1zruq4] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-h10z1zruq4],
.comparison-row span[b-h10z1zruq4],
.comparison-total span[b-h10z1zruq4] {
    padding:8px 9px;
    font-size:.88rem;
}

.comparison-row[b-h10z1zruq4] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-h10z1zruq4],
.comparison-total span:not(:first-child)[b-h10z1zruq4] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-h10z1zruq4] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-h10z1zruq4] { color:#34734b; }
.difference-text.over[b-h10z1zruq4] { color:#987634; }
.difference-text.short[b-h10z1zruq4] { color:#b54d43; }

.transaction-summary-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-h10z1zruq4] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-h10z1zruq4] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-h10z1zruq4] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-h10z1zruq4] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-h10z1zruq4] { background:#f4fafc; }

.transaction-summary-grid span[b-h10z1zruq4] {
    display:block;
    color:#84928c;
    font-size:.88rem;
}

.transaction-summary-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-h10z1zruq4] {
    display:block;
    color:#798a83;
    font-size:.88rem;
}

.detail-transaction-header[b-h10z1zruq4],
.detail-transaction-row[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-h10z1zruq4] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-h10z1zruq4],
.detail-transaction-row span[b-h10z1zruq4] {
    padding:8px 7px;
    font-size:.88rem;
}

.detail-transaction-row[b-h10z1zruq4] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-h10z1zruq4] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.review-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.88rem;
}

.review-note-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-h10z1zruq4] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
}

.review-note-grid p[b-h10z1zruq4] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.88rem;
    line-height:1.6;
}

.document-footer[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
}

.document-footer p[b-h10z1zruq4] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.88rem;
    line-height:1.6;
}

.qr-placeholder[b-h10z1zruq4] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-h10z1zruq4] {
    font-size:.88rem;
    font-weight:700;
}

.mock-document-label[b-h10z1zruq4] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.88rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-h10z1zruq4],
.attachment-panel[b-h10z1zruq4] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-h10z1zruq4] {
    color:#987634;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-h10z1zruq4] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-weight:700;
}

.history-list[b-h10z1zruq4] {
    display:grid;
    gap:7px;
}

.history-item[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-h10z1zruq4] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-h10z1zruq4] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-h10z1zruq4] {
    color:#3c5047;
    font-size:.88rem;
}

.history-item small[b-h10z1zruq4],
.history-item em[b-h10z1zruq4] {
    color:#84928d;
    font-size:.88rem;
    font-style:normal;
}

.history-item p[b-h10z1zruq4] {
    margin:4px 0;
    color:#5e7068;
    font-size:.88rem;
    line-height:1.55;
}

.attachment-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-h10z1zruq4] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-h10z1zruq4] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-h10z1zruq4] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-h10z1zruq4] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-h10z1zruq4] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-h10z1zruq4] { background:rgba(52,115,75,.89); }

.attachment-empty[b-h10z1zruq4] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-h10z1zruq4] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-h10z1zruq4] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-h10z1zruq4] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-h10z1zruq4] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-h10z1zruq4] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-h10z1zruq4] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-h10z1zruq4] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.88rem;
    line-height:1.7;
}

.delete-modal p strong[b-h10z1zruq4] {
    color:#b54d43;
}

.delete-warning[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.88rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-h10z1zruq4] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.student-page[b-h10z1zruq4]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .student-hero[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-h10z1zruq4] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-h10z1zruq4] {
        grid-column:1 / -1;
    }

    .document-header[b-h10z1zruq4] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-h10z1zruq4] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .student-page[b-h10z1zruq4] {
        padding-top:10px;
    }

    .student-page[b-h10z1zruq4]  .student-container {
        padding-inline:10px !important;
    }

    .student-hero[b-h10z1zruq4] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-h10z1zruq4],
    .list-toolbar[b-h10z1zruq4],
    .source-summary-heading[b-h10z1zruq4],
    .calculation-heading[b-h10z1zruq4],
    .view-toolbar[b-h10z1zruq4],
    .section-heading[b-h10z1zruq4] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-h10z1zruq4],
    .variance-grid[b-h10z1zruq4],
    .progress-metrics[b-h10z1zruq4],
    .source-summary-grid[b-h10z1zruq4],
    .system-amount-grid[b-h10z1zruq4],
    .calculation-grid[b-h10z1zruq4],
    .photo-upload-grid[b-h10z1zruq4],
    .transaction-summary-grid[b-h10z1zruq4],
    .review-grid[b-h10z1zruq4],
    .review-note-grid[b-h10z1zruq4],
    .attachment-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-h10z1zruq4] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-h10z1zruq4] {
        width:100%;
    }

    .print-student-profile[b-h10z1zruq4] {
        padding:22px 18px;
    }

    .document-footer[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-h10z1zruq4] {
        grid-column:auto;
    }

    .status-overview[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-h10z1zruq4] {
        width:100%;
    }

    .document-header[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-h10z1zruq4] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-h10z1zruq4] {
        visibility:hidden !important;
    }

    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-h10z1zruq4] {
        display:none !important;
    }

    .modal-backdrop[b-h10z1zruq4],
    .student-view-modal[b-h10z1zruq4],
    .view-scroll[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .scope-panel[b-h10z1zruq4],
    .amount-comparison-section[b-h10z1zruq4],
    .transaction-summary-section[b-h10z1zruq4],
    .source-transaction-section[b-h10z1zruq4],
    .review-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }

    .mock-document-label[b-h10z1zruq4] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-h10z1zruq4] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.student-page[b-h10z1zruq4]  .hero-add-button,
.student-page[b-h10z1zruq4]  .toolbar-add-button,
.student-page[b-h10z1zruq4]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.88rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.confirmed > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.checked-in > span[b-h10z1zruq4] { background:#73569b; }
.status-overview-card.in-service > span[b-h10z1zruq4] { background:#c46a2b; }
.status-overview-card.completed > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.cancelled > span[b-h10z1zruq4] { background:#b54d43; }

.service-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-h10z1zruq4],
.service-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-h10z1zruq4] {
    background:#f4faf7;
}

.service-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-h10z1zruq4] {
    display:block;
    color:var(--theme-muted);
    font-size:.88rem;
}

.service-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-h10z1zruq4] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-h10z1zruq4] {
    display:block;
    color:#3c5047;
    font-size:.88rem;
}

.focus-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.88rem;
}

/* TABLE */

.citizen-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-h10z1zruq4] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.88rem;
}

.citizen-photo-cell small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.88rem;
}

.appointment-time-cell[b-h10z1zruq4],
.service-unit-cell[b-h10z1zruq4],
.provider-location-cell[b-h10z1zruq4],
.queue-priority-cell[b-h10z1zruq4],
.reason-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-h10z1zruq4],
.reason-cell[b-h10z1zruq4] {
    min-width:180px;
}

.appointment-time-cell strong[b-h10z1zruq4],
.service-unit-cell strong[b-h10z1zruq4],
.provider-location-cell strong[b-h10z1zruq4],
.queue-priority-cell strong[b-h10z1zruq4],
.reason-cell strong[b-h10z1zruq4] {
    color:#3c5047;
    font-size:.88rem;
    line-height:1.5;
}

.appointment-time-cell small[b-h10z1zruq4],
.service-unit-cell small[b-h10z1zruq4],
.provider-location-cell small[b-h10z1zruq4],
.queue-priority-cell small[b-h10z1zruq4],
.reason-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:3px;
    color:#84928d;
    font-size:.88rem;
    line-height:1.5;
}

.appointment-time-cell em[b-h10z1zruq4],
.provider-location-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-h10z1zruq4],
.priority-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-h10z1zruq4] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-h10z1zruq4] { color:#987634; background:#fff4df; }

.priority-chip[b-h10z1zruq4] {
    margin-top:5px;
}

.priority-chip.normal[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-h10z1zruq4] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-h10z1zruq4] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-h10z1zruq4] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-h10z1zruq4] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.88rem;
}

.identity-chip[b-h10z1zruq4] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:700;
}

.identity-chip.verified[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-h10z1zruq4],
.identity-chip.not-found[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-h10z1zruq4] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.citizen-source-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.88rem;
    word-break:break-word;
}

.citizen-address[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.88rem;
}

.citizen-source-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-h10z1zruq4],
.citizen-source-actions a[b-h10z1zruq4] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-h10z1zruq4] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-h10z1zruq4] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-h10z1zruq4] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.preview-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.88rem;
}

.consent-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-h10z1zruq4] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-h10z1zruq4] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.88rem;
    font-weight:700;
}

.source-photo-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-h10z1zruq4] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-h10z1zruq4] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-h10z1zruq4] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
}

.source-photo-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-h10z1zruq4] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-h10z1zruq4] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-h10z1zruq4] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.88rem;
    line-height:1.5;
}

.identity-box[b-h10z1zruq4] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-h10z1zruq4],
.identity-box small[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.identity-box strong[b-h10z1zruq4] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.88rem;
}

.service-section[b-h10z1zruq4],
.reason-section[b-h10z1zruq4],
.reminder-section[b-h10z1zruq4] {
    margin-top:16px;
}

.reference-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-h10z1zruq4] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-h10z1zruq4],
.timeline-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.reference-grid strong[b-h10z1zruq4],
.timeline-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.88rem;
    word-break:break-word;
}

.note-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-h10z1zruq4] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-h10z1zruq4] {
    display:block;
    color:#87958f;
    font-size:.88rem;
}

.note-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.88rem;
}

.note-grid p[b-h10z1zruq4] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.88rem;
    line-height:1.6;
}

.timeline-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-h10z1zruq4] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.88rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-h10z1zruq4] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-h10z1zruq4] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-h10z1zruq4],
    .preview-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-h10z1zruq4] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-h10z1zruq4] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-h10z1zruq4] {
        grid-column:1 / -1;
    }

    .reference-grid[b-h10z1zruq4],
    .timeline-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-h10z1zruq4],
    .focus-grid[b-h10z1zruq4],
    .citizen-source-grid[b-h10z1zruq4],
    .preview-grid[b-h10z1zruq4],
    .consent-grid[b-h10z1zruq4],
    .source-photo-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .note-grid[b-h10z1zruq4],
    .timeline-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-h10z1zruq4] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-h10z1zruq4] {
        margin:0 auto;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .service-section[b-h10z1zruq4],
    .reason-section[b-h10z1zruq4],
    .reminder-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size: 16px;
    line-height: 1.55;
}

.student-page[b-h10z1zruq4]  .mud-typography,
.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-input-label,
.student-page[b-h10z1zruq4]  .mud-select,
.student-page[b-h10z1zruq4]  .mud-list-item-text,
.student-page[b-h10z1zruq4]  .mud-button-label,
.student-page[b-h10z1zruq4]  .mud-table-cell,
.student-page[b-h10z1zruq4]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size: .92rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size: .90rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size: .88rem !important;
    font-weight: 700 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .88rem !important;
    line-height: 1.55 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .88rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-h10z1zruq4] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-h10z1zruq4] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-h10z1zruq4] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-h10z1zruq4] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-h10z1zruq4] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-h10z1zruq4] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-h10z1zruq4] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-h10z1zruq4] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-h10z1zruq4],
.student-list-panel[b-h10z1zruq4],
.insight-panel[b-h10z1zruq4] {
    border-radius: 20px;
}

.filter-panel[b-h10z1zruq4] {
    padding: 20px;
}

.list-toolbar[b-h10z1zruq4] {
    padding: 19px 20px;
}

.filter-heading p[b-h10z1zruq4],
.list-toolbar p[b-h10z1zruq4] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-h10z1zruq4] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-h10z1zruq4] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-h10z1zruq4],
.service-unit-cell[b-h10z1zruq4],
.provider-location-cell[b-h10z1zruq4],
.queue-priority-cell[b-h10z1zruq4],
.reason-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    min-width: 155px;
}

.provider-location-cell[b-h10z1zruq4],
.reason-cell[b-h10z1zruq4] {
    min-width: 215px;
}

.service-chip[b-h10z1zruq4],
.priority-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.identity-chip[b-h10z1zruq4] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-h10z1zruq4] {
    min-width: 205px;
    gap: 7px;
}

.student-page[b-h10z1zruq4]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-h10z1zruq4] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-h10z1zruq4],
.view-toolbar[b-h10z1zruq4],
.image-preview-header[b-h10z1zruq4] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-h10z1zruq4],
.view-scroll[b-h10z1zruq4] {
    padding: 20px;
}

.modal-footer[b-h10z1zruq4] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-h10z1zruq4] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-h10z1zruq4] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-h10z1zruq4],
.preview-grid > div[b-h10z1zruq4],
.reference-grid > div[b-h10z1zruq4],
.timeline-grid > div[b-h10z1zruq4] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-h10z1zruq4] {
    padding: 13px;
}

.photo-preview[b-h10z1zruq4] {
    min-height: 200px;
}

.photo-preview img[b-h10z1zruq4] {
    height: 200px;
}

.history-item[b-h10z1zruq4] {
    padding: 12px;
}

.attachment-card[b-h10z1zruq4],
.attachment-card img[b-h10z1zruq4] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .student-page[b-h10z1zruq4] {
        font-size: 15px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .88rem !important;
    }

    .summary-card[b-h10z1zruq4] {
        min-height: 122px;
    }

    .status-overview-card[b-h10z1zruq4],
    .service-overview-card[b-h10z1zruq4] {
        min-height: 82px;
    }

    .modal-body[b-h10z1zruq4],
    .view-scroll[b-h10z1zruq4] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #student-profile-print-area[b-h10z1zruq4] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #student-profile-print-area h1[b-h10z1zruq4] {
        font-size: 18pt !important;
    }

    #student-profile-print-area h2[b-h10z1zruq4] {
        font-size: 14pt !important;
    }

    #student-profile-print-area h3[b-h10z1zruq4] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.follow-up > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.referred > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.cancelled > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.month > span[b-h10z1zruq4] { background:#73569b; }

.service-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-h10z1zruq4] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-h10z1zruq4] {
    display:block;
    color:#7c8d86;
    font-size:.88rem;
}

.care-metrics strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-h10z1zruq4],
.service-unit-cell[b-h10z1zruq4],
.provider-location-cell[b-h10z1zruq4],
.result-cell[b-h10z1zruq4],
.follow-score-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-h10z1zruq4],
.result-cell[b-h10z1zruq4] {
    min-width:230px;
}

.history-date-cell strong[b-h10z1zruq4],
.service-unit-cell strong[b-h10z1zruq4],
.provider-location-cell strong[b-h10z1zruq4],
.result-cell strong[b-h10z1zruq4],
.follow-score-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.88rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-h10z1zruq4],
.service-unit-cell small[b-h10z1zruq4],
.provider-location-cell small[b-h10z1zruq4],
.result-cell small[b-h10z1zruq4],
.follow-score-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:5px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.55;
}

.history-date-cell em[b-h10z1zruq4],
.provider-location-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.88rem;
    font-weight:800;
}

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.referred[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-h10z1zruq4] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-h10z1zruq4] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-h10z1zruq4] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-data-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-h10z1zruq4] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-h10z1zruq4] {
    display:block;
    color:var(--theme-muted);
    font-size:.88rem;
}

.source-data-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-h10z1zruq4],
.source-actions button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-h10z1zruq4] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-h10z1zruq4] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-h10z1zruq4] {
    min-height:180px;
}

.source-photo-card img[b-h10z1zruq4] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-h10z1zruq4] {
    margin-top:18px;
}

.vital-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-h10z1zruq4],
.quality-grid > div[b-h10z1zruq4],
.follow-up-grid > div[b-h10z1zruq4] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-h10z1zruq4],
.quality-grid span[b-h10z1zruq4],
.follow-up-grid span[b-h10z1zruq4] {
    display:block;
    color:#7e8f87;
    font-size:.88rem;
}

.vital-grid strong[b-h10z1zruq4],
.quality-grid strong[b-h10z1zruq4],
.follow-up-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.vital-summary[b-h10z1zruq4] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.88rem;
    line-height:1.65;
}

.follow-up-grid[b-h10z1zruq4],
.quality-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.88rem !important;
    line-height:1.55 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.88rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:.94rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:.92rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.88rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-h10z1zruq4] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-h10z1zruq4] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-h10z1zruq4] { background:rgba(104,120,114,.89); }

.view-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-h10z1zruq4],
    .service-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-h10z1zruq4],
    .vital-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-h10z1zruq4] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-h10z1zruq4],
    .quality-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-h10z1zruq4],
    .service-overview[b-h10z1zruq4],
    .care-metrics[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .source-photo-grid[b-h10z1zruq4],
    .vital-grid[b-h10z1zruq4],
    .follow-up-grid[b-h10z1zruq4],
    .quality-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.follow-up > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.referred > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.overdue > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.inactive > span[b-h10z1zruq4] { background:#687872; }

.risk-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-h10z1zruq4],
.risk-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.risk-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-h10z1zruq4] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-h10z1zruq4],
.care-metrics strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-h10z1zruq4],
.care-metrics small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.care-metrics[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-h10z1zruq4] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-h10z1zruq4],
.risk-adl-cell[b-h10z1zruq4],
.dependency-living-cell[b-h10z1zruq4],
.caregiver-cell[b-h10z1zruq4],
.follow-up-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-h10z1zruq4] {
    min-width:190px;
}

.register-age-cell strong[b-h10z1zruq4],
.risk-adl-cell strong[b-h10z1zruq4],
.dependency-living-cell strong[b-h10z1zruq4],
.caregiver-cell strong[b-h10z1zruq4],
.follow-up-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.88rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-h10z1zruq4],
.risk-adl-cell small[b-h10z1zruq4],
.dependency-living-cell small[b-h10z1zruq4],
.caregiver-cell small[b-h10z1zruq4],
.follow-up-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:5px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.55;
}

.register-age-cell em[b-h10z1zruq4],
.caregiver-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-h10z1zruq4],
.dependency-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.identity-chip[b-h10z1zruq4],
.overdue-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.risk-chip.low[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.risk-chip.high[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.active[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.referred[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.overdue-chip[b-h10z1zruq4] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-h10z1zruq4] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-h10z1zruq4] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-h10z1zruq4] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-data-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-h10z1zruq4] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-h10z1zruq4] {
    display:block;
    color:var(--theme-muted);
    font-size:.88rem;
}

.source-data-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-address[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.6;
}

.source-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-h10z1zruq4],
.source-actions button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-h10z1zruq4] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-h10z1zruq4] {
    display:block;
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
}

.assessment-preview strong[b-h10z1zruq4] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.88rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-h10z1zruq4],
.reference-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-h10z1zruq4],
.reference-grid > div[b-h10z1zruq4],
.care-plan-grid > div[b-h10z1zruq4] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-h10z1zruq4],
.reference-grid span[b-h10z1zruq4],
.care-plan-grid span[b-h10z1zruq4] {
    display:block;
    color:#7e8f87;
    font-size:.88rem;
}

.assessment-grid strong[b-h10z1zruq4],
.reference-grid strong[b-h10z1zruq4],
.care-plan-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.88rem;
    line-height:1.55;
}

.care-plan-main[b-h10z1zruq4] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.88rem;
    line-height:1.7;
}

.care-plan-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.88rem !important;
    line-height:1.58 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.88rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:.96rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:.94rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-h10z1zruq4] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-h10z1zruq4] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-h10z1zruq4] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-h10z1zruq4] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-h10z1zruq4] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-h10z1zruq4] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-h10z1zruq4],
    .assessment-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-h10z1zruq4],
    .risk-overview[b-h10z1zruq4],
    .dependency-grid[b-h10z1zruq4],
    .care-metrics[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .assessment-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .care-plan-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:16.5px;
    line-height:1.62;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-h10z1zruq4] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-h10z1zruq4] { background:#73569b; }
.status-overview-card.field > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.completed > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.follow-up > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.referred > span[b-h10z1zruq4] { background:#b55b82; }

.visit-type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-h10z1zruq4],
.visit-type-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-h10z1zruq4] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.visit-type-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-h10z1zruq4] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-h10z1zruq4],
.care-metrics strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-h10z1zruq4],
.care-metrics small[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
}

/* TABLE */

.visit-date-cell[b-h10z1zruq4],
.visit-type-cell[b-h10z1zruq4],
.team-location-cell[b-h10z1zruq4],
.result-cell[b-h10z1zruq4],
.follow-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-h10z1zruq4],
.result-cell[b-h10z1zruq4] {
    min-width:230px;
}

.visit-date-cell strong[b-h10z1zruq4],
.visit-type-cell strong[b-h10z1zruq4],
.team-location-cell strong[b-h10z1zruq4],
.result-cell strong[b-h10z1zruq4],
.follow-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-h10z1zruq4],
.visit-type-cell small[b-h10z1zruq4],
.team-location-cell small[b-h10z1zruq4],
.result-cell small[b-h10z1zruq4],
.follow-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:6px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.58;
}

.visit-date-cell em[b-h10z1zruq4],
.team-location-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.identity-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.referred[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.priority-text[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-h10z1zruq4] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-h10z1zruq4] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-h10z1zruq4] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.89rem;
}

.source-data-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-h10z1zruq4] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-h10z1zruq4] {
    display:block;
    color:var(--theme-muted);
    font-size:.88rem;
}

.source-data-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.88rem;
    line-height:1.65;
}

.source-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-h10z1zruq4] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-h10z1zruq4] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-h10z1zruq4],
.reference-grid > div[b-h10z1zruq4] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-h10z1zruq4],
.reference-grid span[b-h10z1zruq4] {
    display:block;
    color:#7e8f87;
    font-size:.88rem;
}

.vital-grid strong[b-h10z1zruq4],
.reference-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:.98rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-h10z1zruq4],
    .visit-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-h10z1zruq4],
    .visit-type-overview[b-h10z1zruq4],
    .target-grid[b-h10z1zruq4],
    .care-metrics[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .vital-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.65;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-h10z1zruq4] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.review > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.eligible > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.paid > span[b-h10z1zruq4] { background:#73569b; }

.type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-h10z1zruq4],
.type-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-h10z1zruq4] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.type-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-h10z1zruq4],
.target-grid button[b-h10z1zruq4] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.budget-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.88rem;
}

/* TABLE */

.application-no-cell[b-h10z1zruq4],
.welfare-type-cell[b-h10z1zruq4],
.household-cell[b-h10z1zruq4],
.amount-cell[b-h10z1zruq4],
.officer-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-h10z1zruq4],
.officer-cell[b-h10z1zruq4] {
    min-width:210px;
}

.application-no-cell strong[b-h10z1zruq4],
.welfare-type-cell strong[b-h10z1zruq4],
.household-cell strong[b-h10z1zruq4],
.amount-cell strong[b-h10z1zruq4],
.officer-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-h10z1zruq4],
.welfare-type-cell small[b-h10z1zruq4],
.household-cell small[b-h10z1zruq4],
.amount-cell small[b-h10z1zruq4],
.officer-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:6px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.62;
}

.application-no-cell em[b-h10z1zruq4],
.household-cell em[b-h10z1zruq4],
.amount-cell em[b-h10z1zruq4],
.officer-cell em[b-h10z1zruq4],
.citizen-photo-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.source-group-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.source-group-chip[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-h10z1zruq4] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-h10z1zruq4],
.amount-preview[b-h10z1zruq4] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-h10z1zruq4] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-h10z1zruq4] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-h10z1zruq4],
.amount-preview > div[b-h10z1zruq4] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-h10z1zruq4],
.amount-preview small[b-h10z1zruq4] {
    display:block;
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
}

.amount-preview small[b-h10z1zruq4] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-h10z1zruq4],
.amount-preview strong[b-h10z1zruq4] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-h10z1zruq4],
.amount-preview span[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.88rem;
    line-height:1.55;
}

.amount-document-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-h10z1zruq4] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-h10z1zruq4],
.amount-document-grid small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.amount-document-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-h10z1zruq4] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-h10z1zruq4] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-h10z1zruq4] {
    min-height:43px;
    font-size:.88rem;
}

/* LARGE TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-h10z1zruq4] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-h10z1zruq4],
    .type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .type-overview[b-h10z1zruq4],
    .budget-grid[b-h10z1zruq4],
    .target-grid[b-h10z1zruq4],
    .care-metrics[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .assessment-preview[b-h10z1zruq4],
    .amount-preview[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.66;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-h10z1zruq4] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.payment > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.suspended > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.expiring > span[b-h10z1zruq4] { background:#73569b; }

.target-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-h10z1zruq4],
.target-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-h10z1zruq4] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.target-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-h10z1zruq4],
.follow-grid button[b-h10z1zruq4] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.amount-metrics strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.88rem;
}

.follow-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-h10z1zruq4] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
}

/* TABLE CELLS */

.registry-cell[b-h10z1zruq4],
.benefit-cell[b-h10z1zruq4],
.period-cell[b-h10z1zruq4],
.amount-cell[b-h10z1zruq4],
.payment-cycle-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-h10z1zruq4] {
    min-width:225px;
}

.registry-cell strong[b-h10z1zruq4],
.benefit-cell strong[b-h10z1zruq4],
.period-cell strong[b-h10z1zruq4],
.amount-cell strong[b-h10z1zruq4],
.payment-cycle-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-h10z1zruq4],
.benefit-cell small[b-h10z1zruq4],
.period-cell small[b-h10z1zruq4],
.amount-cell small[b-h10z1zruq4],
.payment-cycle-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:6px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.62;
}

.registry-cell em[b-h10z1zruq4],
.period-cell em[b-h10z1zruq4],
.amount-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-h10z1zruq4],
.cycle-chip[b-h10z1zruq4],
.verify-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.source-group-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.benefit-chip.allowance[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-h10z1zruq4] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.expired[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.source-group-chip[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-h10z1zruq4] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-h10z1zruq4] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
    line-height:1.55;
}

.amount-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-h10z1zruq4] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-h10z1zruq4] {
    display:block;
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
}

.amount-preview strong[b-h10z1zruq4] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.88rem;
}

/* LARGE MUD TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-h10z1zruq4] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-h10z1zruq4] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-h10z1zruq4],
    .target-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .target-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .condition-switch-grid[b-h10z1zruq4],
    .amount-preview[b-h10z1zruq4],
    .source-data-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .patient-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.66;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-h10z1zruq4] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-h10z1zruq4] { background:#687872; }
.status-overview-card.approval > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.processing > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.paid > span[b-h10z1zruq4] { background:#34734b; }
.status-overview-card.failed > span[b-h10z1zruq4] { background:#b54d43; }

.disbursement-progress[b-h10z1zruq4] {
    margin-top:15px;
}

.disbursement-progress > div[b-h10z1zruq4] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-h10z1zruq4],
.amount-cell[b-h10z1zruq4],
.progress-cell[b-h10z1zruq4],
.date-cell[b-h10z1zruq4],
.control-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-h10z1zruq4] {
    min-width:245px;
}

.batch-cell strong[b-h10z1zruq4],
.amount-cell strong[b-h10z1zruq4],
.progress-cell strong[b-h10z1zruq4],
.date-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-h10z1zruq4],
.amount-cell small[b-h10z1zruq4],
.progress-cell small[b-h10z1zruq4],
.date-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:6px;
    color:#72847b;
    font-size:.88rem;
    line-height:1.62;
}

.batch-cell em[b-h10z1zruq4],
.amount-cell em[b-h10z1zruq4],
.date-cell em[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-h10z1zruq4] {
    min-width:180px;
}

.recipient-stack[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-h10z1zruq4],
.recipient-stack span[b-h10z1zruq4] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-h10z1zruq4] {
    margin-left:0;
}

.recipient-stack img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
}

.recipient-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.table-progress[b-h10z1zruq4] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-h10z1zruq4],
.approval-chip[b-h10z1zruq4],
.reconcile-chip[b-h10z1zruq4],
.cycle-chip[b-h10z1zruq4],
.line-status-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.status-chip.draft[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.approved[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.control-cell[b-h10z1zruq4] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-h10z1zruq4] {
    align-items:center;
}

.selection-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-h10z1zruq4] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-h10z1zruq4] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-h10z1zruq4] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-h10z1zruq4] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.source-selection-summary strong[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-h10z1zruq4] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-h10z1zruq4] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-h10z1zruq4],
.source-selection-table td[b-h10z1zruq4] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.88rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-h10z1zruq4] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.88rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-h10z1zruq4] {
    background:#f0faf6;
}

.source-person-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-h10z1zruq4] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-h10z1zruq4],
.source-benefit-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.88rem;
}

.source-person-cell small[b-h10z1zruq4],
.source-benefit-cell small[b-h10z1zruq4],
.source-date[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.88rem;
}

.source-person-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.88rem;
    font-style:normal;
}

.source-benefit-cell[b-h10z1zruq4] {
    min-width:190px;
}

.source-amount[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:750;
}

.bank-readiness span.ready[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.source-document-buttons[b-h10z1zruq4] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-h10z1zruq4] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-h10z1zruq4] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-h10z1zruq4] {
    display:block;
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
}

.amount-preview strong[b-h10z1zruq4] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.88rem;
}

/* DETAIL */

.batch-overview-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-h10z1zruq4] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-h10z1zruq4] {
    font-size:3.5rem;
}

.batch-overview-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-h10z1zruq4] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.print-line-table-wrap[b-h10z1zruq4] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-h10z1zruq4] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-h10z1zruq4],
.print-line-table td[b-h10z1zruq4] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.88rem;
    vertical-align:top;
}

.print-line-table th[b-h10z1zruq4] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-h10z1zruq4],
.print-line-table td small[b-h10z1zruq4] {
    display:block;
}

.print-line-table td small[b-h10z1zruq4] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-h10z1zruq4] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-h10z1zruq4] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-h10z1zruq4] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-h10z1zruq4] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.recipient-detail-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-h10z1zruq4] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.recipient-detail-grid strong[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.88rem;
}

.recipient-document-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-h10z1zruq4] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-h10z1zruq4] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-h10z1zruq4] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-h10z1zruq4] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-h10z1zruq4] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-h10z1zruq4],
    .recipient-detail-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-h10z1zruq4] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-h10z1zruq4] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .source-selection-summary[b-h10z1zruq4],
    .amount-preview[b-h10z1zruq4],
    .recipient-detail-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-h10z1zruq4] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-h10z1zruq4] {
        overflow-x:auto;
    }

    .source-selection-table[b-h10z1zruq4] {
        min-width:1050px;
    }

    .batch-overview-panel[b-h10z1zruq4],
    .recipient-detail-card[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-h10z1zruq4] {
        width:100%;
        height:190px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .batch-overview-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.66;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-h10z1zruq4],
.type-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.full > span[b-h10z1zruq4] { background:#c56b2a; }
.status-overview-card.overflow > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.maintenance > span[b-h10z1zruq4] { background:#73569b; }

.type-overview[b-h10z1zruq4] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-h10z1zruq4],
.type-overview-card.selected[b-h10z1zruq4] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-h10z1zruq4] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-h10z1zruq4] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
}

.type-overview-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-h10z1zruq4] {
    margin-top:15px;
}

.fill-progress > div[b-h10z1zruq4] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-h10z1zruq4] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-h10z1zruq4] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-h10z1zruq4] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-h10z1zruq4] {
    background:#987634;
}

.map-pin.full[b-h10z1zruq4] {
    background:#c56b2a;
}

.map-pin.overflow[b-h10z1zruq4] {
    background:#b54d43;
}

.map-pin.maintenance[b-h10z1zruq4] {
    background:#73569b;
}

.map-pin.inactive[b-h10z1zruq4] {
    background:#687872;
}

.map-pin span[b-h10z1zruq4] {
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-h10z1zruq4] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-h10z1zruq4] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.88rem;
}

.map-board-legend i[b-h10z1zruq4] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-h10z1zruq4] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-h10z1zruq4] { background:#987634; }
.map-board-legend i.full[b-h10z1zruq4] { background:#b54d43; }
.map-board-legend i.maintenance[b-h10z1zruq4] { background:#73569b; }

.map-board-caption[b-h10z1zruq4] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-h10z1zruq4],
.map-board-caption small[b-h10z1zruq4] {
    display:block;
}

.map-board-caption strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TABLE CELLS */

.point-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-h10z1zruq4] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-h10z1zruq4] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.point-photo-cell em[b-h10z1zruq4] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-h10z1zruq4],
.bin-cell[b-h10z1zruq4],
.fill-cell[b-h10z1zruq4],
.collection-cell[b-h10z1zruq4],
.sensor-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-h10z1zruq4] {
    min-width:220px;
}

.location-cell strong[b-h10z1zruq4],
.bin-cell strong[b-h10z1zruq4],
.fill-cell strong[b-h10z1zruq4],
.collection-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-h10z1zruq4],
.bin-cell small[b-h10z1zruq4],
.fill-cell small[b-h10z1zruq4],
.collection-cell small[b-h10z1zruq4],
.sensor-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
    line-height:1.55;
}

.location-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.88rem;
    font-style:normal;
}

.waste-type-chip[b-h10z1zruq4],
.collection-chip[b-h10z1zruq4],
.sensor-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.waste-type-chip.general[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.status-chip.active[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.full[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.table-progress[b-h10z1zruq4] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-h10z1zruq4] { background:var(--theme-primary); }
.table-progress.medium span[b-h10z1zruq4] { background:#2f789f; }
.table-progress.high span[b-h10z1zruq4] { background:#987634; }
.table-progress.critical span[b-h10z1zruq4] { background:#b54d43; }

.repair-alert[b-h10z1zruq4],
.clean-alert[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.88rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-h10z1zruq4] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-h10z1zruq4] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-h10z1zruq4] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.fill-preview-card[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-h10z1zruq4] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-h10z1zruq4] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-h10z1zruq4] { background:#2f789f; }
.fill-preview-bin.high span[b-h10z1zruq4] { background:#987634; }
.fill-preview-bin.critical span[b-h10z1zruq4] { background:#b54d43; }

.fill-preview-bin strong[b-h10z1zruq4] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-h10z1zruq4] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-h10z1zruq4] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
    line-height:1.55;
}

.source-photo-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
}

.source-photo-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-h10z1zruq4] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-h10z1zruq4] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-h10z1zruq4] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.large-fill-indicator[b-h10z1zruq4] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-h10z1zruq4] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-h10z1zruq4] { background:#2f789f; }
.large-fill-indicator.high > span[b-h10z1zruq4] { background:#987634; }
.large-fill-indicator.critical > span[b-h10z1zruq4] { background:#b54d43; }

.large-fill-indicator strong[b-h10z1zruq4],
.large-fill-indicator small[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-h10z1zruq4] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-h10z1zruq4] {
    font-size:.88rem;
}

.detail-map-preview[b-h10z1zruq4] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-h10z1zruq4] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-h10z1zruq4] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-h10z1zruq4] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-h10z1zruq4] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.collection-history-list small[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.88rem;
}

.workflow-button.collect[b-h10z1zruq4] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-h10z1zruq4] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-h10z1zruq4],
    .type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-h10z1zruq4] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-h10z1zruq4] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-h10z1zruq4] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .type-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .condition-switch-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-h10z1zruq4],
    .fill-preview-card[b-h10z1zruq4],
    .coordinate-preview[b-h10z1zruq4],
    .collection-history-list article[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-h10z1zruq4] {
        min-height:240px;
    }

    .large-fill-indicator[b-h10z1zruq4],
    .fill-preview-bin[b-h10z1zruq4],
    .coordinate-pin[b-h10z1zruq4] {
        margin:0 auto;
    }

    .map-board[b-h10z1zruq4] {
        min-height:500px;
    }

    .map-pin[b-h10z1zruq4] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .point-cover-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.68;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.received > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.inspecting > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.in-progress > span[b-h10z1zruq4] { background:#73569b; }
.status-overview-card.resolved > span[b-h10z1zruq4] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-h10z1zruq4]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-h10z1zruq4],
.pollution-type-card.selected[b-h10z1zruq4] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
    font-weight:700;
}

.pollution-type-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-h10z1zruq4] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-h10z1zruq4] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-h10z1zruq4] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-h10z1zruq4] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-h10z1zruq4] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-h10z1zruq4] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-h10z1zruq4] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-h10z1zruq4] {
    margin-top:18px;
}

.sla-progress > div[b-h10z1zruq4] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-h10z1zruq4] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-h10z1zruq4] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-h10z1zruq4] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-h10z1zruq4] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-h10z1zruq4] { background:#2f789f; }
.pollution-map-pin.medium[b-h10z1zruq4] { background:#987634; }
.pollution-map-pin.high[b-h10z1zruq4] { background:#c56b2a; }
.pollution-map-pin.critical[b-h10z1zruq4] { background:#b54d43; }

.pollution-map-pin span[b-h10z1zruq4] {
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-h10z1zruq4] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-h10z1zruq4] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.88rem;
}

.map-board-legend i[b-h10z1zruq4] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-h10z1zruq4] { background:#2f789f; }
.map-board-legend i.medium[b-h10z1zruq4] { background:#987634; }
.map-board-legend i.high[b-h10z1zruq4] { background:#c56b2a; }
.map-board-legend i.critical[b-h10z1zruq4] { background:#b54d43; }

.map-board-caption[b-h10z1zruq4] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-h10z1zruq4],
.map-board-caption small[b-h10z1zruq4] {
    display:block;
}

.map-board-caption strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-h10z1zruq4] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.complaint-photo-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.88rem;
    font-style:normal;
}

.type-severity-cell[b-h10z1zruq4],
.reporter-cell[b-h10z1zruq4],
.location-cell[b-h10z1zruq4],
.inspection-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-h10z1zruq4],
.location-cell[b-h10z1zruq4] {
    min-width:195px;
}

.reporter-cell strong[b-h10z1zruq4],
.location-cell strong[b-h10z1zruq4],
.inspection-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-h10z1zruq4],
.location-cell small[b-h10z1zruq4],
.inspection-cell small[b-h10z1zruq4],
.status-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.reporter-cell em[b-h10z1zruq4],
.location-cell em[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-style:normal;
}

.pollution-type-chip[b-h10z1zruq4],
.severity-chip[b-h10z1zruq4],
.inspection-chip[b-h10z1zruq4],
.status-chip[b-h10z1zruq4],
.overdue-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.pollution-type-chip.air[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.severity-chip.high[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-h10z1zruq4] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-h10z1zruq4] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-h10z1zruq4] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

/* FORM */

.anonymous-switch-card[b-h10z1zruq4] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-h10z1zruq4],
.anonymous-switch-card small[b-h10z1zruq4] {
    display:block;
}

.anonymous-switch-card strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.coordinate-preview[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-h10z1zruq4],
.map-board-grid[b-h10z1zruq4] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-h10z1zruq4] { background:#c56b2a; }
.coordinate-pin.critical[b-h10z1zruq4] { background:#b54d43; }
.coordinate-pin.medium[b-h10z1zruq4] { background:#987634; }

.coordinate-pin .mud-icon-root[b-h10z1zruq4] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-h10z1zruq4] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.source-point-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-h10z1zruq4] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-condition-row[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.88rem;
    font-weight:750;
}

.source-condition-row span.warning[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-h10z1zruq4] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-h10z1zruq4] { color:#987634; background:#fff4df; }

.measurement-preview small[b-h10z1zruq4],
.measurement-preview strong[b-h10z1zruq4],
.measurement-preview em[b-h10z1zruq4] {
    display:block;
}

.measurement-preview small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.measurement-preview strong[b-h10z1zruq4] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
    font-style:normal;
}

.source-photo-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
}

.source-photo-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.source-photo-preview button[b-h10z1zruq4] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-h10z1zruq4] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-h10z1zruq4] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.severity-emblem[b-h10z1zruq4] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-h10z1zruq4] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-h10z1zruq4] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-h10z1zruq4] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-h10z1zruq4] {
    font-size:2.25rem;
}

.severity-emblem strong[b-h10z1zruq4] {
    font-size:1.10rem;
}

.severity-emblem small[b-h10z1zruq4] {
    font-size:.88rem;
}

.measurement-document-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-h10z1zruq4] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-h10z1zruq4],
.measurement-document-grid strong[b-h10z1zruq4] {
    display:block;
}

.measurement-document-grid span[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.measurement-document-grid strong[b-h10z1zruq4] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-h10z1zruq4] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-h10z1zruq4] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-h10z1zruq4] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-h10z1zruq4] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-h10z1zruq4] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-h10z1zruq4] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-h10z1zruq4] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-h10z1zruq4] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-h10z1zruq4] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-h10z1zruq4] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-h10z1zruq4] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-h10z1zruq4] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-h10z1zruq4] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-h10z1zruq4],
    .source-photo-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-h10z1zruq4],
    .source-photo-preview button[b-h10z1zruq4] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .pollution-type-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .measurement-preview[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-h10z1zruq4],
    .coordinate-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-h10z1zruq4] {
        height:250px;
    }

    .coordinate-pin[b-h10z1zruq4] {
        margin:0 auto;
    }

    .pollution-map-board[b-h10z1zruq4] {
        min-height:500px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .complaint-cover-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.68;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.polluted > span[b-h10z1zruq4] { background:#c56b2a; }
.status-overview-card.critical > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.restoring > span[b-h10z1zruq4] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-h10z1zruq4]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-h10z1zruq4],
.institution-type-card.selected[b-h10z1zruq4] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
    font-weight:700;
}

.institution-type-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-h10z1zruq4] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-h10z1zruq4] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-h10z1zruq4] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-h10z1zruq4] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-h10z1zruq4] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-h10z1zruq4] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-h10z1zruq4] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.student-metric-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.student-metric-grid article[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.student-metric-grid article > span[b-h10z1zruq4] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.student-metric-grid article.ph > span[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.student-metric-grid article.do > span[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.student-metric-grid article.bod > span[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.student-metric-grid article.turbidity > span[b-h10z1zruq4] { color:#987634; background:#fff4df; }

.student-metric-grid small[b-h10z1zruq4],
.student-metric-grid strong[b-h10z1zruq4],
.student-metric-grid em[b-h10z1zruq4] {
    display:block;
}

.student-metric-grid small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.student-metric-grid strong[b-h10z1zruq4] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.student-metric-grid em[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-h10z1zruq4] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-h10z1zruq4] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-h10z1zruq4] { background:var(--theme-primary); }
.education-map-pin.watch[b-h10z1zruq4] { background:#987634; }
.education-map-pin.polluted[b-h10z1zruq4] { background:#c56b2a; }
.education-map-pin.critical[b-h10z1zruq4] { background:#b54d43; }
.education-map-pin.restoring[b-h10z1zruq4] { background:#73569b; }
.education-map-pin.closed[b-h10z1zruq4] { background:#687872; }

.education-map-pin span[b-h10z1zruq4] {
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-h10z1zruq4] { background:var(--theme-primary); }
.map-board-legend i.watch[b-h10z1zruq4] { background:#987634; }
.map-board-legend i.polluted[b-h10z1zruq4] { background:#c56b2a; }
.map-board-legend i.critical[b-h10z1zruq4] { background:#b54d43; }
.map-board-legend i.restoring[b-h10z1zruq4] { background:#73569b; }

/* TABLE */

.student-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.student-photo-mini[b-h10z1zruq4] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.student-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.student-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.student-photo-cell small[b-h10z1zruq4],
.student-photo-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.student-photo-cell em[b-h10z1zruq4] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-h10z1zruq4],
.latest-progress-cell[b-h10z1zruq4],
.inspection-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-h10z1zruq4],
.quality-status-chip[b-h10z1zruq4],
.usage-chip[b-h10z1zruq4],
.lab-chip[b-h10z1zruq4],
.no-progress-chip[b-h10z1zruq4],
.overdue-chip[b-h10z1zruq4],
.follow-up-chip[b-h10z1zruq4],
.complaint-count-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.institution-type-chip.canal[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-h10z1zruq4] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-h10z1zruq4] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.usage-chip[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-h10z1zruq4],
.inspection-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-h10z1zruq4],
.inspection-cell small[b-h10z1zruq4],
.type-level-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.size-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-h10z1zruq4] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.88rem;
}

.size-cell strong[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
}

.row-action.sample[b-h10z1zruq4] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-h10z1zruq4] { background:var(--theme-primary); }
.coordinate-pin.watch[b-h10z1zruq4] { background:#987634; }
.coordinate-pin.polluted[b-h10z1zruq4] { background:#c56b2a; }
.coordinate-pin.critical[b-h10z1zruq4] { background:#b54d43; }
.coordinate-pin.restoring[b-h10z1zruq4] { background:#73569b; }
.coordinate-pin.closed[b-h10z1zruq4] { background:#687872; }

.coordinate-pin .mud-icon-root[b-h10z1zruq4] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-h10z1zruq4] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-h10z1zruq4] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.88rem;
}

.linked-photo-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-h10z1zruq4] {
    color:#73569b;
    font-size:.88rem;
    font-weight:800;
}

.linked-photo-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-h10z1zruq4] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.linked-photo-preview button[b-h10z1zruq4] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.progress-form-modal[b-h10z1zruq4] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.progress-preview-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.progress-preview-grid article[b-h10z1zruq4] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.progress-preview-grid small[b-h10z1zruq4],
.progress-preview-grid strong[b-h10z1zruq4],
.progress-preview-grid span[b-h10z1zruq4] {
    display:block;
}

.progress-preview-grid small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.progress-preview-grid strong[b-h10z1zruq4] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.progress-preview-grid span[b-h10z1zruq4] {
    margin-top:5px;
    color:#2f789f;
    font-size:.88rem;
}

.progress-preview-grid article.ph[b-h10z1zruq4] { border-top:4px solid #73569b; }
.progress-preview-grid article.do[b-h10z1zruq4] { border-top:4px solid #2f789f; }
.progress-preview-grid article.bod[b-h10z1zruq4] { border-top:4px solid #c56b2a; }
.progress-preview-grid article.cod[b-h10z1zruq4] { border-top:4px solid #b54d43; }
.progress-preview-grid article.turbidity[b-h10z1zruq4] { border-top:4px solid #987634; }
.progress-preview-grid article.coliform[b-h10z1zruq4] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-h10z1zruq4] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-h10z1zruq4] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.education-emblem[b-h10z1zruq4] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-h10z1zruq4] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-h10z1zruq4] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-h10z1zruq4] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-h10z1zruq4] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-h10z1zruq4] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-h10z1zruq4] {
    font-size:2.25rem;
}

.education-emblem strong[b-h10z1zruq4] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-h10z1zruq4] {
    font-size:.88rem;
}

.measurement-document-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-h10z1zruq4] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-h10z1zruq4],
.measurement-document-grid strong[b-h10z1zruq4] {
    display:block;
}

.measurement-document-grid span[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.measurement-document-grid strong[b-h10z1zruq4] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.progress-history-panel[b-h10z1zruq4],
.linked-complaint-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.progress-card-list[b-h10z1zruq4],
.linked-complaint-list[b-h10z1zruq4] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.progress-card[b-h10z1zruq4] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.progress-card.good[b-h10z1zruq4] { border-left-color:var(--theme-primary); }
.progress-card.watch[b-h10z1zruq4] { border-left-color:#987634; }
.progress-card.polluted[b-h10z1zruq4] { border-left-color:#c56b2a; }
.progress-card.critical[b-h10z1zruq4] { border-left-color:#b54d43; }
.progress-card.restoring[b-h10z1zruq4] { border-left-color:#73569b; }

.progress-card-head[b-h10z1zruq4] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.progress-card-head strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.progress-card-head small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.progress-card-metrics[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.progress-card-metrics span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.88rem;
}

.progress-card-metrics strong[b-h10z1zruq4] {
    color:#2f789f;
}

.progress-card p[b-h10z1zruq4] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.88rem;
}

.assessment-photo-actions[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-h10z1zruq4] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    cursor:pointer;
}

.linked-complaint-list article[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-h10z1zruq4] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.88rem;
}

.linked-complaint-list p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

.linked-complaint-list a[b-h10z1zruq4] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.88rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-h10z1zruq4] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-h10z1zruq4] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .institution-type-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .amount-document-grid[b-h10z1zruq4],
    .progress-photo-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-h10z1zruq4],
    .coordinate-preview[b-h10z1zruq4],
    .linked-complaint-list article[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-h10z1zruq4] {
        height:250px;
    }

    .coordinate-pin[b-h10z1zruq4] {
        margin:0 auto;
    }

    .education-map-board[b-h10z1zruq4] {
        min-height:500px;
    }

    .linked-complaint-list button[b-h10z1zruq4] {
        height:210px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .education-cover-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.68;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-h10z1zruq4] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-h10z1zruq4] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.diseased > span[b-h10z1zruq4] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-h10z1zruq4] { background:#b54d43; }
.status-overview-card.treatment > span[b-h10z1zruq4] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-h10z1zruq4]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-h10z1zruq4],
.institution-type-card.selected[b-h10z1zruq4] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
    font-weight:700;
}

.institution-type-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-h10z1zruq4] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-h10z1zruq4] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-h10z1zruq4] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-h10z1zruq4] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-h10z1zruq4] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-h10z1zruq4] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-h10z1zruq4] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.student-metric-grid article.carbon > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.student-metric-grid article.photo > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.student-metric-grid article.maintenance > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.student-metric-grid article.treatment > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-h10z1zruq4] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-h10z1zruq4] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-h10z1zruq4] { background:var(--theme-primary); }
.education-map-pin.watch[b-h10z1zruq4] { background:#987634; }
.education-map-pin.diseased[b-h10z1zruq4] { background:#c56b2a; }
.education-map-pin.hazardous[b-h10z1zruq4] { background:#b54d43; }
.education-map-pin.treatment[b-h10z1zruq4] { background:#73569b; }
.education-map-pin.removed[b-h10z1zruq4] { background:#687872; }

.education-map-pin span[b-h10z1zruq4] {
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-h10z1zruq4] { background:var(--theme-primary); }
.map-board-legend i.watch[b-h10z1zruq4] { background:#987634; }
.map-board-legend i.diseased[b-h10z1zruq4] { background:#c56b2a; }
.map-board-legend i.hazardous[b-h10z1zruq4] { background:#b54d43; }
.map-board-legend i.treatment[b-h10z1zruq4] { background:#73569b; }

/* TABLE */

.student-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.student-photo-mini[b-h10z1zruq4] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.student-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.student-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.student-photo-cell small[b-h10z1zruq4],
.student-photo-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.student-photo-cell em[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-h10z1zruq4],
.latest-progress-cell[b-h10z1zruq4],
.maintenance-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-h10z1zruq4],
.health-status-chip[b-h10z1zruq4],
.risk-chip[b-h10z1zruq4],
.health-score-chip[b-h10z1zruq4],
.no-progress-chip[b-h10z1zruq4],
.overdue-chip[b-h10z1zruq4],
.urgent-chip[b-h10z1zruq4],
.water-link-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-h10z1zruq4] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-h10z1zruq4] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.risk-chip.high[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-h10z1zruq4],
.urgent-chip[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-h10z1zruq4],
.latest-progress-cell strong[b-h10z1zruq4],
.maintenance-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-h10z1zruq4],
.latest-progress-cell small[b-h10z1zruq4],
.maintenance-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.size-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-h10z1zruq4] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.88rem;
}

.size-cell strong[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
}

.size-cell em[b-h10z1zruq4] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.88rem;
    font-style:normal;
}

.row-action.inspect[b-h10z1zruq4] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-h10z1zruq4] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-h10z1zruq4] {
    color:#2f789f;
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.88rem;
}

/* INSPECTION */

.progress-form-modal[b-h10z1zruq4] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.progress-preview-grid article.good[b-h10z1zruq4] {
    border-top:4px solid var(--theme-primary);
}

.progress-preview-grid article.watch[b-h10z1zruq4] {
    border-top:4px solid #987634;
}

.progress-preview-grid article.diseased[b-h10z1zruq4],
.progress-preview-grid article.high[b-h10z1zruq4] {
    border-top:4px solid #c56b2a;
}

.progress-preview-grid article.hazardous[b-h10z1zruq4],
.progress-preview-grid article.critical[b-h10z1zruq4] {
    border-top:4px solid #b54d43;
}

.progress-preview-grid article.medium[b-h10z1zruq4] {
    border-top:4px solid #987634;
}

.progress-preview-grid article.low[b-h10z1zruq4] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-h10z1zruq4] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-h10z1zruq4] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.education-emblem[b-h10z1zruq4] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-h10z1zruq4] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-h10z1zruq4] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-h10z1zruq4] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-h10z1zruq4] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-h10z1zruq4] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-h10z1zruq4] {
    font-size:2.25rem;
}

.education-emblem strong[b-h10z1zruq4] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-h10z1zruq4] {
    font-size:.88rem;
}

.progress-history-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.progress-card[b-h10z1zruq4] {
    border-left:5px solid var(--theme-primary);
}

.progress-card.medium[b-h10z1zruq4],
.progress-card.watch[b-h10z1zruq4] {
    border-left-color:#987634;
}

.progress-card.high[b-h10z1zruq4],
.progress-card.diseased[b-h10z1zruq4] {
    border-left-color:#c56b2a;
}

.progress-card.critical[b-h10z1zruq4],
.progress-card.hazardous[b-h10z1zruq4] {
    border-left-color:#b54d43;
}

.view-progress-button[b-h10z1zruq4] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-h10z1zruq4] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-h10z1zruq4] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-h10z1zruq4],
    .source-photo-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .institution-type-overview[b-h10z1zruq4],
    .amount-metrics[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .progress-photo-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-h10z1zruq4],
    .coordinate-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-h10z1zruq4] {
        height:250px;
    }

    .coordinate-pin[b-h10z1zruq4] {
        margin:0 auto;
    }

    .education-map-board[b-h10z1zruq4] {
        min-height:500px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.88rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .education-cover-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.72;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-h10z1zruq4] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.full > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.maintenance > span[b-h10z1zruq4] { background:#c56b2a; }
.status-overview-card.review > span[b-h10z1zruq4] { background:#73569b; }
.status-overview-card.temp-closed > span[b-h10z1zruq4] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-h10z1zruq4] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-h10z1zruq4]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-h10z1zruq4],
.institution-type-card.selected[b-h10z1zruq4] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-h10z1zruq4] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-h10z1zruq4] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-h10z1zruq4] {
    display:block;
    color:#71837a;
    font-size:.88rem;
    font-weight:700;
}

.institution-type-card strong[b-h10z1zruq4] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-h10z1zruq4] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-h10z1zruq4] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-h10z1zruq4] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-h10z1zruq4] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-h10z1zruq4] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-h10z1zruq4] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.student-metric-grid article.attendance > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.student-metric-grid article.health > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.student-metric-grid article.assessment > span[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.student-metric-grid article.green > span[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-h10z1zruq4] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-h10z1zruq4] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-h10z1zruq4] { background:var(--theme-primary); }
.education-map-pin.full[b-h10z1zruq4] { background:#987634; }
.education-map-pin.maintenance[b-h10z1zruq4] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-h10z1zruq4] { background:#73569b; }
.education-map-pin.temp-closed[b-h10z1zruq4],
.education-map-pin.inactive[b-h10z1zruq4] { background:#b54d43; }

.education-map-pin span[b-h10z1zruq4] {
    font-family:'Kanit',sans-serif;
    font-size:.88rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-h10z1zruq4] { background:var(--theme-primary); }
.map-board-legend i.full[b-h10z1zruq4] { background:#987634; }
.map-board-legend i.maintenance[b-h10z1zruq4] { background:#c56b2a; }
.map-board-legend i.review[b-h10z1zruq4] { background:#73569b; }
.map-board-legend i.closed[b-h10z1zruq4] { background:#b54d43; }

/* TABLE */

.student-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.student-photo-mini[b-h10z1zruq4] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.student-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.student-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.student-photo-cell small[b-h10z1zruq4],
.student-photo-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
}

.student-photo-cell em[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-h10z1zruq4],
.latest-progress-cell[b-h10z1zruq4],
.assessment-date-cell[b-h10z1zruq4],
.status-cell[b-h10z1zruq4] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-h10z1zruq4],
.institution-status-chip[b-h10z1zruq4],
.accreditation-chip[b-h10z1zruq4],
.assessment-result-chip[b-h10z1zruq4],
.no-progress-chip[b-h10z1zruq4],
.overdue-chip[b-h10z1zruq4],
.due-chip[b-h10z1zruq4],
.green-link-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-h10z1zruq4],
.assessment-result-chip.passed[b-h10z1zruq4],
.assessment-result-chip.excellent[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-h10z1zruq4],
.assessment-result-chip.conditional[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-h10z1zruq4],
.assessment-result-chip.review[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-h10z1zruq4],
.accreditation-chip.not-assessed[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-h10z1zruq4],
.latest-progress-cell small[b-h10z1zruq4],
.assessment-date-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.latest-progress-cell strong[b-h10z1zruq4],
.assessment-date-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-h10z1zruq4] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
}

.occupancy-track[b-h10z1zruq4] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
    line-height:1.55;
}

.personnel-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-h10z1zruq4] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.88rem;
}

.personnel-cell strong[b-h10z1zruq4] {
    color:var(--theme-primary);
}

.personnel-cell em[b-h10z1zruq4] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.88rem;
    font-style:normal;
}

.row-action.assess[b-h10z1zruq4] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-h10z1zruq4] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-h10z1zruq4],
.capacity-preview strong[b-h10z1zruq4] {
    display:block;
}

.capacity-preview small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.capacity-preview strong[b-h10z1zruq4] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-h10z1zruq4] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.progress-form-modal[b-h10z1zruq4] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.progress-preview-grid article.excellent[b-h10z1zruq4],
.progress-preview-grid article.passed[b-h10z1zruq4] {
    border-top:4px solid var(--theme-primary);
}

.progress-preview-grid article.conditional[b-h10z1zruq4] {
    border-top:4px solid #987634;
}

.progress-preview-grid article.review[b-h10z1zruq4] {
    border-top:4px solid #b54d43;
}

.progress-card.excellent[b-h10z1zruq4],
.progress-card.passed[b-h10z1zruq4] {
    border-left-color:var(--theme-primary);
}

.progress-card.conditional[b-h10z1zruq4] {
    border-left-color:#987634;
}

.progress-card.review[b-h10z1zruq4] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-h10z1zruq4] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-h10z1zruq4] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-h10z1zruq4] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-h10z1zruq4] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-h10z1zruq4] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.88rem;
    font-weight:750;
}

.education-emblem[b-h10z1zruq4] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-h10z1zruq4] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-h10z1zruq4] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-h10z1zruq4] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-h10z1zruq4] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-h10z1zruq4] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-h10z1zruq4] {
    font-size:2.25rem;
}

.education-emblem strong[b-h10z1zruq4] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-h10z1zruq4] {
    font-size:.88rem;
}

.progress-history-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-progress-button[b-h10z1zruq4] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-h10z1zruq4] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-h10z1zruq4] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-h10z1zruq4] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-h10z1zruq4] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.04rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-h10z1zruq4] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-h10z1zruq4],
    .source-photo-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .institution-type-overview[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .progress-photo-grid[b-h10z1zruq4],
    .capacity-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-h10z1zruq4] {
        height:250px;
    }

    .education-map-board[b-h10z1zruq4] {
        min-height:500px;
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .education-cover-panel[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.student-page[b-h10z1zruq4] {
    font-size:17px;
    line-height:1.74;
}

.student-hero[b-h10z1zruq4] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-h10z1zruq4] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-h10z1zruq4] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-h10z1zruq4] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-h10z1zruq4] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-h10z1zruq4] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-h10z1zruq4] { background:var(--theme-primary); }
.status-overview-card.new > span[b-h10z1zruq4] { background:#c56b2a; }
.status-overview-card.watch > span[b-h10z1zruq4] { background:#987634; }
.status-overview-card.transferred > span[b-h10z1zruq4] { background:#2f789f; }
.status-overview-card.graduated > span[b-h10z1zruq4] { background:#73569b; }

.student-metric-grid article.new > span[b-h10z1zruq4] {
    color:#c56b2a;
    background:#fff0df;
}

.student-metric-grid article.health > span[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.student-metric-grid article.scholarship > span[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.student-metric-grid article.photo > span[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.student-photo-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.student-photo-mini[b-h10z1zruq4] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.student-photo-mini img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.student-photo-cell strong[b-h10z1zruq4] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.student-photo-cell small[b-h10z1zruq4],
.student-photo-cell em[b-h10z1zruq4] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.88rem;
}

.student-photo-cell em[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-h10z1zruq4],
.latest-progress-cell[b-h10z1zruq4],
.care-cell[b-h10z1zruq4] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-h10z1zruq4],
.student-status-chip[b-h10z1zruq4],
.health-chip[b-h10z1zruq4],
.special-care-chip[b-h10z1zruq4],
.scholarship-chip[b-h10z1zruq4],
.learning-chip[b-h10z1zruq4],
.no-progress-chip[b-h10z1zruq4] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.88rem;
    font-weight:800;
}

.school-chip[b-h10z1zruq4] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-h10z1zruq4] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-h10z1zruq4] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-h10z1zruq4] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-h10z1zruq4] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-h10z1zruq4] { color:#987634; background:#fff4df; }
.health-chip.referred[b-h10z1zruq4] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-h10z1zruq4] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-h10z1zruq4] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-h10z1zruq4] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-h10z1zruq4],
.learning-chip.good[b-h10z1zruq4] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-h10z1zruq4] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-h10z1zruq4] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-h10z1zruq4] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-h10z1zruq4],
.latest-progress-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-h10z1zruq4],
.latest-progress-cell small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.attendance-cell[b-h10z1zruq4] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-h10z1zruq4] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.progress-track[b-h10z1zruq4] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-h10z1zruq4] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-h10z1zruq4] { background:var(--theme-primary); }
.progress-track i.watch[b-h10z1zruq4] { background:#987634; }
.progress-track i.risk[b-h10z1zruq4] { background:#b54d43; }

.teacher-cell[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-h10z1zruq4] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-h10z1zruq4],
.teacher-cell small[b-h10z1zruq4] {
    display:block;
}

.teacher-cell strong[b-h10z1zruq4] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-h10z1zruq4] {
    margin-top:4px;
    color:#71837a;
    font-size:.88rem;
}

.row-action.progress[b-h10z1zruq4] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-h10z1zruq4] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-h10z1zruq4] {
    color:var(--theme-primary);
    font-size:.88rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-h10z1zruq4] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-h10z1zruq4] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-h10z1zruq4] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.progress-form-modal[b-h10z1zruq4] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.progress-preview-grid[b-h10z1zruq4] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.progress-preview-grid article[b-h10z1zruq4] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.progress-preview-grid article.watch[b-h10z1zruq4],
.progress-preview-grid article.pass[b-h10z1zruq4] {
    border-top-color:#987634;
}

.progress-preview-grid article.risk[b-h10z1zruq4],
.progress-preview-grid article.support[b-h10z1zruq4] {
    border-top-color:#b54d43;
}

.progress-preview-grid small[b-h10z1zruq4],
.progress-preview-grid strong[b-h10z1zruq4],
.progress-preview-grid span[b-h10z1zruq4] {
    display:block;
}

.progress-preview-grid small[b-h10z1zruq4] {
    color:#71837a;
    font-size:.88rem;
}

.progress-preview-grid strong[b-h10z1zruq4] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.progress-preview-grid span[b-h10z1zruq4] {
    margin-top:5px;
    color:#5f746a;
    font-size:.88rem;
}

.progress-history-panel[b-h10z1zruq4] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.progress-card[b-h10z1zruq4] {
    border-left:5px solid var(--theme-primary);
}

.progress-card.pass[b-h10z1zruq4] {
    border-left-color:#2f789f;
}

.progress-card.support[b-h10z1zruq4] {
    border-left-color:#b54d43;
}

.view-progress-button[b-h10z1zruq4] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.student-profile-photo[b-h10z1zruq4] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.student-profile-photo img[b-h10z1zruq4] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-h10z1zruq4] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-h10z1zruq4] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-h10z1zruq4] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-h10z1zruq4] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-h10z1zruq4] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.student-page[b-h10z1zruq4]  .student-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.student-page[b-h10z1zruq4]  .mud-input,
.student-page[b-h10z1zruq4]  .mud-select-input {
    font-size:1.05rem !important;
}

.student-page[b-h10z1zruq4]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.student-page[b-h10z1zruq4]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.student-page[b-h10z1zruq4]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-h10z1zruq4] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-h10z1zruq4],
    .follow-grid[b-h10z1zruq4],
    .student-metric-grid[b-h10z1zruq4],
    .measurement-document-grid[b-h10z1zruq4],
    .reference-grid[b-h10z1zruq4],
    .progress-preview-grid[b-h10z1zruq4],
    .progress-photo-grid[b-h10z1zruq4] {
        grid-template-columns:minmax(0,1fr);
    }

    .student-page[b-h10z1zruq4]  .student-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .student-form-modal[b-h10z1zruq4],
    .progress-form-modal[b-h10z1zruq4],
    .student-view-modal[b-h10z1zruq4] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #student-profile-print-area[b-h10z1zruq4],
    #student-profile-print-area *[b-h10z1zruq4] {
        visibility:visible !important;
    }

    #student-profile-print-area[b-h10z1zruq4] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .student-view-modal[b-h10z1zruq4] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-h10z1zruq4],
    .document-status-strip[b-h10z1zruq4],
    .document-section[b-h10z1zruq4],
    .document-footer[b-h10z1zruq4] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/07Pets/PetAdoptions.razor.rz.scp.css */
.adoption-page[b-atvkdew8cz] {
    --adoption-ink: #18352f;
    --adoption-muted: #60736d;
    --adoption-line: var(--theme-border);
    --adoption-soft: #f4faf7;
    --adoption-green: #16785f;
    --adoption-green-dark: #0e5a47;
    --adoption-mint: color-mix(in srgb, var(--theme-light) 15%, white);
    --adoption-gold: #c9902e;
    --adoption-rose: #c65d72;
    --adoption-blue: #397a9c;
    --adoption-shadow: 0 18px 48px rgba(21, 78, 63, .11);
    min-height: 100vh;
    padding: 24px 0 52px;
    color: var(--adoption-ink);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    font-size: 17px;
    line-height: 1.65;
    background:
        radial-gradient(circle at 8% 2%, rgba(108, 211, 169, .16), transparent 31%),
        radial-gradient(circle at 96% 12%, rgba(244, 193, 105, .13), transparent 28%),
        linear-gradient(180deg, #f8fcfa 0%, var(--theme-bg) 54%, var(--theme-bg) 100%);
}

.adoption-page *[b-atvkdew8cz],
.adoption-page *[b-atvkdew8cz]::before,
.adoption-page *[b-atvkdew8cz]::after {
    box-sizing: border-box;
}

.adoption-page button[b-atvkdew8cz],
.adoption-page input[b-atvkdew8cz],
.adoption-page textarea[b-atvkdew8cz],
.adoption-page select[b-atvkdew8cz] {
    font-family: inherit;
}

.adoption-container[b-atvkdew8cz] {
    width: min(100%, 1760px);
    padding-inline: clamp(16px, 2.2vw, 34px) !important;
}

.adoption-hero[b-atvkdew8cz] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(330px, .75fr);
    gap: clamp(24px, 3vw, 54px);
    overflow: hidden;
    min-height: 330px;
    padding: clamp(28px, 4vw, 54px);
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 30px;
    color: #fff;
    background:
        linear-gradient(120deg, rgba(11, 76, 60, .98), rgba(19, 125, 96, .94) 57%, rgba(45, 145, 109, .91)),
        radial-gradient(circle at 80% 30%, rgba(255,255,255,.18), transparent 35%);
    box-shadow: 0 25px 65px rgba(13, 83, 64, .22);
    isolation: isolate;
}

.hero-pattern[b-atvkdew8cz] {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .45;
    background-image:
        radial-gradient(circle at 18px 18px, rgba(255,255,255,.15) 2px, transparent 2px),
        radial-gradient(circle at 70% 14%, rgba(255, 220, 154, .25), transparent 20%);
    background-size: 42px 42px, auto;
}

.hero-pattern[b-atvkdew8cz]::before,
.hero-pattern[b-atvkdew8cz]::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;
}

.hero-pattern[b-atvkdew8cz]::before {
    width: 360px;
    height: 360px;
    right: -110px;
    top: -150px;
}

.hero-pattern[b-atvkdew8cz]::after {
    width: 220px;
    height: 220px;
    right: 22%;
    bottom: -150px;
}

.hero-accent-line[b-atvkdew8cz] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 7px;
    background: linear-gradient(180deg, #ffe8ad, #d9a33c 55%, #fff0c7);
}

.hero-content[b-atvkdew8cz],
.hero-action-panel[b-atvkdew8cz] {
    position: relative;
    z-index: 1;
}

.hero-content[b-atvkdew8cz] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.hero-badge[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 18px;
    padding: 10px 15px 10px 10px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 16px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(12px);
}

.hero-badge > span[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: #164e3f;
    background: linear-gradient(145deg, #fff4d1, #f0c76f);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}

.hero-badge > span[b-atvkdew8cz]  .mud-icon-root {
    font-size: 29px;
}

.hero-badge div[b-atvkdew8cz] {
    display: grid;
    min-width: 0;
}

.hero-badge small[b-atvkdew8cz] {
    color: #e8fff7;
    font-size: .83rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.hero-badge strong[b-atvkdew8cz] {
    overflow-wrap: anywhere;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.45;
}

.hero-content h1[b-atvkdew8cz] {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(2.25rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.02em;
    text-shadow: 0 8px 24px rgba(0,0,0,.15);
}

.hero-content > p[b-atvkdew8cz] {
    max-width: 900px;
    margin: 0;
    color: rgba(255,255,255,.91);
    font-size: clamp(1.05rem, 1.25vw, 1.25rem);
    font-weight: 400;
    line-height: 1.75;
}

.hero-meta[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.hero-meta span[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 40px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    color: #f7fffc;
    font-size: .95rem;
    font-weight: 600;
    background: rgba(5, 54, 42, .18);
}

.hero-action-panel[b-atvkdew8cz] {
    align-self: center;
    display: grid;
    gap: 16px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 24px;
    background: rgba(255,255,255,.12);
    box-shadow: 0 18px 40px rgba(4, 48, 38, .15);
    backdrop-filter: blur(16px);
}

.hero-status[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 14px;
    border-radius: 17px;
    background: rgba(2, 52, 40, .25);
}

.status-dot[b-atvkdew8cz] {
    flex: 0 0 13px;
    width: 13px;
    height: 13px;
    border: 3px solid rgba(255,255,255,.55);
    border-radius: 50%;
    background: #85f2bd;
    box-shadow: 0 0 0 7px rgba(133, 242, 189, .12);
}

.hero-status div[b-atvkdew8cz] {
    display: grid;
}

.hero-status strong[b-atvkdew8cz] {
    color: #fff;
    font-size: 1.07rem;
    font-weight: 800;
}

.hero-status small[b-atvkdew8cz] {
    color: #dcfff2;
    font-size: .93rem;
    font-weight: 500;
}

[b-atvkdew8cz] .hero-add-button.mud-button-root,
[b-atvkdew8cz] .toolbar-add-button.mud-button-root {
    min-height: 52px;
    border-radius: 15px;
    color: #1b4c3d;
    font-size: 1.08rem;
    font-weight: 800;
    text-transform: none;
    background: linear-gradient(145deg, #fff5d5, #efc66f);
    box-shadow: 0 11px 24px rgba(29, 72, 58, .18);
}

[b-atvkdew8cz] .hero-add-button.mud-button-root:hover,
[b-atvkdew8cz] .toolbar-add-button.mud-button-root:hover {
    background: linear-gradient(145deg, #fff9e8, #f4d187);
    transform: translateY(-1px);
}

.hero-link-row[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.hero-source-button[b-atvkdew8cz],
.hero-refresh-button[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 45px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 13px;
    color: #fff;
    font-size: .93rem;
    font-weight: 700;
    text-decoration: none;
    background: rgba(255,255,255,.09);
    cursor: pointer;
    transition: .18s ease;
}

.hero-source-button:hover[b-atvkdew8cz],
.hero-refresh-button:hover:not(:disabled)[b-atvkdew8cz] {
    color: #fff;
    background: rgba(255,255,255,.18);
    transform: translateY(-1px);
}

.hero-refresh-button:disabled[b-atvkdew8cz] {
    opacity: .6;
    cursor: default;
}

[b-atvkdew8cz] .page-loading {
    margin: 16px 4px 0;
    border-radius: 999px;
    overflow: hidden;
}

[b-atvkdew8cz] .page-error {
    margin-top: 18px;
    border-radius: 16px;
    font-size: 1rem;
}

.summary-grid[b-atvkdew8cz] {
    margin-top: 8px !important;
}

.summary-card[b-atvkdew8cz] {
    position: relative;
    display: grid;
    grid-template-columns: 66px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    overflow: hidden;
    height: 100%;
    min-height: 148px;
    padding: 20px;
    border: 1px solid var(--adoption-line);
    border-radius: 22px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 13px 34px rgba(26, 77, 64, .08);
}

.summary-line[b-atvkdew8cz] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--card-accent, var(--adoption-green));
}

.summary-icon[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    color: var(--card-accent, var(--adoption-green));
    background: var(--card-soft, var(--adoption-mint));
}

.summary-icon[b-atvkdew8cz]  .mud-icon-root {
    font-size: 33px;
}

.summary-card small[b-atvkdew8cz] {
    color: #60736d;
    font-size: .98rem;
    font-style: normal;
    font-weight: 700;
}

.summary-card p[b-atvkdew8cz] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 2px 0 0;
}

.summary-card p strong[b-atvkdew8cz] {
    color: #163b31;
    font-size: 2.1rem;
    font-weight: 900;
    line-height: 1.15;
}

.summary-card p span[b-atvkdew8cz] {
    color: #526b64;
    font-size: .96rem;
    font-weight: 600;
}

.summary-card em[b-atvkdew8cz] {
    display: block;
    margin-top: 5px;
    color: #7a8d86;
    font-size: .9rem;
    font-style: normal;
    font-weight: 500;
}

.summary-card.available[b-atvkdew8cz] { --card-accent: #168165; --card-soft: #ddf4e9; }
.summary-card.reserved[b-atvkdew8cz] { --card-accent: #c18a2d; --card-soft: #fff1d3; }
.summary-card.adopted[b-atvkdew8cz] { --card-accent: #b85770; --card-soft: #fde5eb; }
.summary-card.source[b-atvkdew8cz] { --card-accent: #3e7895; --card-soft: #e3f0f7; }

.quick-filter-row[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.quick-filter-row button[b-atvkdew8cz] {
    --quick-accent: #56736b;
    --quick-soft: var(--theme-bg);
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 88px;
    padding: 14px;
    border: 1px solid var(--adoption-line);
    border-radius: 18px;
    color: var(--adoption-ink);
    text-align: left;
    background: rgba(255,255,255,.88);
    box-shadow: 0 9px 25px rgba(28, 79, 65, .06);
    cursor: pointer;
    transition: .18s ease;
}

.quick-filter-row button:hover[b-atvkdew8cz],
.quick-filter-row button.active[b-atvkdew8cz] {
    border-color: color-mix(in srgb, var(--quick-accent) 42%, white);
    background: linear-gradient(145deg, #fff, var(--quick-soft));
    box-shadow: 0 14px 30px rgba(28, 79, 65, .12);
    transform: translateY(-2px);
}

.quick-filter-row button > span[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: var(--quick-accent);
    background: var(--quick-soft);
}

.quick-filter-row button small[b-atvkdew8cz],
.quick-filter-row button strong[b-atvkdew8cz] {
    display: block;
}

.quick-filter-row button small[b-atvkdew8cz] {
    color: #657a73;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.35;
}

.quick-filter-row button strong[b-atvkdew8cz] {
    color: var(--quick-accent);
    font-size: 1.55rem;
    font-weight: 900;
    line-height: 1.15;
}

.quick-filter-row .published[b-atvkdew8cz] { --quick-accent: #17795f; --quick-soft: #e0f4eb; }
.quick-filter-row .urgent[b-atvkdew8cz] { --quick-accent: #b8623c; --quick-soft: #ffeadf; }
.quick-filter-row .special[b-atvkdew8cz] { --quick-accent: #42749a; --quick-soft: #e5f0f8; }
.quick-filter-row .reserved[b-atvkdew8cz] { --quick-accent: #ad7c24; --quick-soft: #fff0ce; }
.quick-filter-row .adopted[b-atvkdew8cz] { --quick-accent: #b1536d; --quick-soft: #fbe4ea; }

.insight-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(360px, .9fr);
    gap: 20px;
    margin-top: 20px;
}

.insight-panel[b-atvkdew8cz],
.filter-panel[b-atvkdew8cz],
.adoption-list-panel[b-atvkdew8cz] {
    border: 1px solid var(--adoption-line);
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    box-shadow: var(--adoption-shadow);
}

.insight-panel[b-atvkdew8cz] {
    padding: 23px;
}

.insight-heading[b-atvkdew8cz],
.filter-heading[b-atvkdew8cz],
.list-toolbar[b-atvkdew8cz],
.section-title-row[b-atvkdew8cz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.insight-heading small[b-atvkdew8cz],
.filter-heading > div > span[b-atvkdew8cz],
.panel-kicker[b-atvkdew8cz],
.modal-header small[b-atvkdew8cz] {
    color: var(--adoption-green);
    font-size: .82rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.insight-heading h2[b-atvkdew8cz],
.filter-heading h2[b-atvkdew8cz],
.list-toolbar h2[b-atvkdew8cz],
.modal-header h2[b-atvkdew8cz] {
    margin: 2px 0 0;
    color: var(--theme-ink);
    font-size: clamp(1.45rem, 2vw, 1.85rem);
    font-weight: 900;
    line-height: 1.3;
}

.insight-heading > span[b-atvkdew8cz] {
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    color: #597069;
    font-size: .85rem;
    font-weight: 600;
    background: #edf6f2;
}

.metric-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.metric-grid article[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 92px;
    padding: 13px;
    border: 1px solid #e3eee9;
    border-radius: 17px;
    background: #f9fcfb;
}

.metric-grid article > span[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    color: #157a5f;
    background: #def3e9;
}

.metric-grid small[b-atvkdew8cz],
.metric-grid strong[b-atvkdew8cz],
.metric-grid em[b-atvkdew8cz] {
    display: block;
}

.metric-grid small[b-atvkdew8cz] {
    color: #657870;
    font-size: .85rem;
    font-weight: 700;
}

.metric-grid strong[b-atvkdew8cz] {
    color: #193f34;
    font-size: 1.55rem;
    font-weight: 900;
    line-height: 1.1;
}

.metric-grid em[b-atvkdew8cz] {
    color: #788b84;
    font-size: .82rem;
    font-style: normal;
}

.process-list[b-atvkdew8cz] {
    display: grid;
    gap: 10px;
    margin-top: 17px;
}

.process-list > div[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 0 12px;
    padding: 11px 12px;
    border: 1px solid #e5eee9;
    border-radius: 15px;
    background: #f9fcfb;
}

.process-list > div > span[b-atvkdew8cz] {
    grid-row: 1 / span 2;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 900;
    background: linear-gradient(145deg, #158064, #0f604c);
}

.process-list strong[b-atvkdew8cz] {
    color: #23473d;
    font-size: .97rem;
    font-weight: 800;
}

.process-list small[b-atvkdew8cz] {
    color: #71837d;
    font-size: .86rem;
}

.filter-panel[b-atvkdew8cz] {
    margin-top: 20px;
    padding: 24px;
}

.filter-heading p[b-atvkdew8cz],
.list-toolbar p[b-atvkdew8cz] {
    margin: 7px 0 0;
    color: #687c75;
    font-size: 1rem;
}

.clear-filter-button[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    min-height: 42px;
    padding: 8px 14px;
    border: 1px solid #d4e4dd;
    border-radius: 13px;
    color: #416158;
    font-size: .96rem;
    font-weight: 700;
    background: #f5faf8;
    cursor: pointer;
}

.filter-grid[b-atvkdew8cz] {
    margin-top: 8px !important;
}

[b-atvkdew8cz] .premium-field .mud-input-control-input-container,
[b-atvkdew8cz] .premium-field .mud-input-outlined-border {
    border-radius: 14px;
}

[b-atvkdew8cz] .premium-field .mud-input-root,
[b-atvkdew8cz] .premium-field .mud-select-input,
[b-atvkdew8cz] .premium-field input,
[b-atvkdew8cz] .premium-field textarea {
    color: #243f37;
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    font-size: 1.07rem !important;
    line-height: 1.55;
}

[b-atvkdew8cz] .premium-field .mud-input-label {
    color: #587068;
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    font-size: 1.02rem !important;
    font-weight: 600;
}

[b-atvkdew8cz] .premium-field .mud-input-helper-text {
    font-size: .88rem;
}

[b-atvkdew8cz] .premium-field .mud-input-adornment .mud-icon-root {
    font-size: 24px;
}

.filter-summary[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    min-height: 57px;
    padding: 9px 12px;
    border: 1px dashed #cfe2d9;
    border-radius: 14px;
    background: #f5faf8;
}

.filter-summary span[b-atvkdew8cz] {
    padding: 6px 10px;
    border-radius: 999px;
    color: #60756e;
    font-size: .94rem;
    font-weight: 600;
    background: #fff;
}

.filter-summary strong[b-atvkdew8cz] {
    color: #126d55;
    font-size: 1.07rem;
    font-weight: 900;
}

.adoption-list-panel[b-atvkdew8cz] {
    margin-top: 20px;
    padding: 24px;
}

.list-toolbar[b-atvkdew8cz] {
    align-items: center;
    margin-bottom: 20px;
}

[b-atvkdew8cz] .toolbar-add-button.mud-button-root {
    flex: 0 0 auto;
    min-width: 155px;
    color: #fff;
    background: linear-gradient(145deg, #168164, #0f604b);
    box-shadow: 0 10px 22px rgba(20, 111, 86, .23);
}

[b-atvkdew8cz] .toolbar-add-button.mud-button-root:hover {
    color: #fff;
    background: linear-gradient(145deg, #1a8e6e, #116950);
}

.adoption-card-grid[b-atvkdew8cz] {
    align-items: stretch;
}

.adoption-card[b-atvkdew8cz] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
    min-height: 650px;
    border: 1px solid var(--theme-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(25, 75, 62, .09);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.adoption-card:hover[b-atvkdew8cz] {
    border-color: #bbd9cd;
    box-shadow: 0 21px 46px rgba(21, 84, 66, .15);
    transform: translateY(-4px);
}

.pet-photo-wrap[b-atvkdew8cz] {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    min-height: 250px;
    background: linear-gradient(145deg, #e9f4ef, #dcece5);
}

.pet-photo[b-atvkdew8cz] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}

.adoption-card:hover .pet-photo[b-atvkdew8cz] {
    transform: scale(1.025);
}

.photo-top-row[b-atvkdew8cz],
.photo-bottom-row[b-atvkdew8cz] {
    position: absolute;
    left: 14px;
    right: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
}

.photo-top-row[b-atvkdew8cz] { top: 14px; }
.photo-bottom-row[b-atvkdew8cz] { bottom: 13px; }

.photo-top-row > span[b-atvkdew8cz],
.photo-bottom-row > span[b-atvkdew8cz],
.detail-photo-status > span[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 800;
    line-height: 1.2;
    box-shadow: 0 5px 14px rgba(0,0,0,.14);
    backdrop-filter: blur(10px);
}

.photo-bottom-row > span[b-atvkdew8cz] {
    color: #fff;
    background: rgba(18, 46, 39, .72);
}

.status-badge.draft[b-atvkdew8cz] { color: #374f48; background: rgba(245,249,247,.93); }
.status-badge.published[b-atvkdew8cz] { color: #0d5b46; background: rgba(217,246,233,.95); }
.status-badge.reserved[b-atvkdew8cz] { color: #704b0e; background: rgba(255,239,194,.95); }
.status-badge.adopted[b-atvkdew8cz] { color: #7c2944; background: rgba(255,224,233,.95); }
.status-badge.paused[b-atvkdew8cz] { color: #4d5970; background: rgba(231,236,247,.95); }
.status-badge.closed[b-atvkdew8cz] { color: #5d6260; background: rgba(236,239,238,.95); }

.urgency-badge.normal[b-atvkdew8cz] { color: #31564c; background: rgba(236,247,242,.95); }
.urgency-badge.high[b-atvkdew8cz] { color: #8b5618; background: rgba(255,231,196,.96); }
.urgency-badge.urgent[b-atvkdew8cz] { color: #8d2e2e; background: rgba(255,218,214,.96); }

.adoption-card-body[b-atvkdew8cz] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 20px 20px 15px;
}

.pet-name-row[b-atvkdew8cz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.pet-name-row small[b-atvkdew8cz] {
    color: #6d817a;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .025em;
}

.pet-name-row h3[b-atvkdew8cz] {
    margin: 0;
    color: #153c31;
    font-size: 1.65rem;
    font-weight: 900;
    line-height: 1.3;
}

.species-badge[b-atvkdew8cz] {
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    color: #12674f;
    font-size: .9rem;
    font-weight: 800;
    background: #e3f4ec;
}

.adoption-card-body > h4[b-atvkdew8cz] {
    margin: 10px 0 8px;
    color: #36574e;
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1.5;
}

.pet-facts[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.pet-facts span[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: #61766f;
    font-size: .94rem;
    font-weight: 600;
}

.pet-facts span[b-atvkdew8cz]  .mud-icon-root {
    flex: 0 0 auto;
    color: #2d8269;
}

.pet-description[b-atvkdew8cz] {
    display: -webkit-box;
    overflow: hidden;
    margin: 14px 0;
    color: #5e726b;
    font-size: 1rem;
    line-height: 1.68;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.health-badges[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
}

.health-badges span[b-atvkdew8cz],
.check-grid span[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: 11px;
    font-size: .9rem;
    font-weight: 700;
}

.health-badges .ok[b-atvkdew8cz],
.check-grid .yes[b-atvkdew8cz],
.vaccine-current[b-atvkdew8cz] {
    color: #17634f;
    border-color: #c8e7da !important;
    background: #eaf8f2;
}

.health-badges .pending[b-atvkdew8cz],
.check-grid .no[b-atvkdew8cz],
.vaccine-unknown[b-atvkdew8cz] {
    color: #785d2a;
    border-color: #eadbb9 !important;
    background: #fff8e7;
}

.vaccine-due-soon[b-atvkdew8cz] {
    color: #8c551d;
    border-color: #efd6ae !important;
    background: #fff0d9;
}

.vaccine-overdue[b-atvkdew8cz] {
    color: #913d3d;
    border-color: #efc5c5 !important;
    background: #fff0f0;
}

.interest-row[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px dashed #dce8e3;
}

.interest-row span[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #71837d;
    font-size: .88rem;
    font-weight: 600;
}

.adoption-card-footer[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px 18px;
    border-top: 1px solid #e8f0ed;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

[b-atvkdew8cz] .detail-button.mud-button-root,
[b-atvkdew8cz] .apply-button.mud-button-root {
    min-height: 43px;
    border-radius: 12px;
    font-size: .94rem;
    font-weight: 800;
    text-transform: none;
}

[b-atvkdew8cz] .detail-button.mud-button-root {
    color: #fff;
    background: linear-gradient(145deg, #168164, #105f4b);
}

[b-atvkdew8cz] .apply-button.mud-button-root {
    color: #9b4b63;
    border-color: #e4b8c5;
    background: #fff8fa;
}

[b-atvkdew8cz] .card-icon-button.mud-icon-button {
    width: 43px;
    height: 43px;
    margin-left: auto;
    border: 1px solid #dce7e3;
    border-radius: 12px;
    color: #56716a;
    background: #fff;
}

[b-atvkdew8cz] .card-icon-button.edit:hover {
    color: #a06d1c;
    border-color: #e6cfaa;
    background: #fff7e8;
}

.pagination-row[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 23px;
}

.pagination-row button[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 43px;
    padding: 8px 15px;
    border: 1px solid #ccdfd7;
    border-radius: 12px;
    color: #236451;
    font-size: .98rem;
    font-weight: 800;
    background: #f4faf7;
    cursor: pointer;
}

.pagination-row button:disabled[b-atvkdew8cz] {
    color: #99aaa4;
    background: #f4f6f5;
    cursor: not-allowed;
}

.pagination-row > span[b-atvkdew8cz] {
    color: #62766f;
    font-size: .98rem;
    font-weight: 600;
}

.pagination-row strong[b-atvkdew8cz] {
    color: #146c54;
    font-size: 1.08rem;
}

.empty-state[b-atvkdew8cz] {
    display: grid;
    justify-items: center;
    padding: 58px 20px;
    text-align: center;
}

.empty-state > span[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    border-radius: 24px;
    color: #2a8068;
    background: #e5f4ed;
}

.empty-state > span[b-atvkdew8cz]  .mud-icon-root {
    font-size: 42px;
}

.empty-state h3[b-atvkdew8cz] {
    margin: 16px 0 4px;
    color: #274b41;
    font-size: 1.4rem;
    font-weight: 900;
}

.empty-state p[b-atvkdew8cz] {
    margin: 0 0 17px;
    color: #71847d;
    font-size: 1rem;
}

[b-atvkdew8cz] .empty-button.mud-button-root {
    min-height: 46px;
    border-radius: 13px;
    color: #fff;
    font-weight: 800;
    text-transform: none;
    background: #15795f;
}

.modal-backdrop[b-atvkdew8cz] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: grid;
    place-items: center;
    overflow-y: auto;
    padding: 24px;
    background: rgba(12, 33, 28, .62);
    backdrop-filter: blur(7px);
}

.modal-shell[b-atvkdew8cz] {
    width: min(100%, 1040px);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 25px;
    border: 1px solid rgba(255,255,255,.65);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(3, 35, 27, .3);
}

.detail-modal[b-atvkdew8cz] { width: min(100%, 1180px); }
.form-modal[b-atvkdew8cz] { width: min(100%, 1120px); }
.application-modal[b-atvkdew8cz] { width: min(100%, 860px); }
.compact-modal[b-atvkdew8cz] { width: min(100%, 590px); }
.delete-modal[b-atvkdew8cz] { width: min(100%, 520px); text-align: center; }

.modal-header[b-atvkdew8cz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 17px;
    border-bottom: 1px solid #e1ebe7;
}

[b-atvkdew8cz] .modal-close.mud-icon-button {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border: 1px solid #dce7e3;
    border-radius: 13px;
    color: #506961;
    background: var(--theme-bg);
}

.detail-hero-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: minmax(340px, .9fr) minmax(0, 1.25fr);
    gap: 22px;
}

.detail-photo-panel[b-atvkdew8cz] {
    position: relative;
    overflow: hidden;
    min-height: 360px;
    border-radius: 22px;
    background: #e8f2ee;
}

.detail-photo-panel > img[b-atvkdew8cz] {
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
}

.detail-photo-status[b-atvkdew8cz] {
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.detail-main-panel[b-atvkdew8cz] {
    padding: 8px 4px;
}

.detail-source[b-atvkdew8cz] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border-radius: 999px;
    color: #226550;
    font-size: .92rem;
    font-weight: 700;
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.detail-main-panel h3[b-atvkdew8cz] {
    margin: 15px 0 8px;
    color: #173f34;
    font-size: clamp(1.6rem, 2.5vw, 2.2rem);
    font-weight: 900;
    line-height: 1.3;
}

.detail-main-panel > p[b-atvkdew8cz] {
    margin: 0;
    color: var(--theme-muted);
    font-size: 1.07rem;
    line-height: 1.75;
}

.detail-stat-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 20px;
}

.detail-stat-grid > div[b-atvkdew8cz] {
    padding: 12px;
    border: 1px solid #e0ebe6;
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-stat-grid small[b-atvkdew8cz],
.detail-stat-grid strong[b-atvkdew8cz] {
    display: block;
}

.detail-stat-grid small[b-atvkdew8cz] {
    color: #71847d;
    font-size: .86rem;
    font-weight: 600;
}

.detail-stat-grid strong[b-atvkdew8cz] {
    color: #2d5147;
    font-size: 1rem;
    font-weight: 800;
}

.detail-section-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.detail-section-grid > section[b-atvkdew8cz],
.applications-section[b-atvkdew8cz],
.timeline-section[b-atvkdew8cz],
.form-section[b-atvkdew8cz],
.source-section[b-atvkdew8cz],
.photo-preview-section[b-atvkdew8cz] {
    padding: 18px;
    border: 1px solid var(--theme-border);
    border-radius: 19px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.detail-section-grid > section > p[b-atvkdew8cz] {
    margin: 7px 0 0;
    color: var(--theme-muted);
    font-size: 1rem;
    line-height: 1.7;
}

.section-title[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #19765d;
}

.section-title h3[b-atvkdew8cz],
.section-title-row h3[b-atvkdew8cz],
.form-section-title h3[b-atvkdew8cz] {
    margin: 0;
    color: #244b40;
    font-size: 1.16rem;
    font-weight: 900;
}

.check-grid[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.applications-section[b-atvkdew8cz],
.timeline-section[b-atvkdew8cz] {
    margin-top: 18px;
}

.application-list[b-atvkdew8cz],
.timeline-list[b-atvkdew8cz] {
    display: grid;
    gap: 10px;
    margin-top: 13px;
}

.application-list > article[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 16px;
    padding: 14px;
    border: 1px solid #e0ebe6;
    border-radius: 15px;
    background: #fff;
}

.application-list h4[b-atvkdew8cz] {
    margin: 0;
    color: #294e43;
    font-size: 1.02rem;
    font-weight: 800;
}

.application-list p[b-atvkdew8cz],
.application-list small[b-atvkdew8cz] {
    margin: 0;
    color: #6c8079;
    font-size: .91rem;
}

.application-badge[b-atvkdew8cz] {
    align-self: start;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
}

.application-badge.submitted[b-atvkdew8cz] { color: #6c541f; background: #fff2cc; }
.application-badge.reviewing[b-atvkdew8cz] { color: #285b7b; background: #e5f1f8; }
.application-badge.approved[b-atvkdew8cz] { color: #17624e; background: #e2f5ec; }
.application-badge.rejected[b-atvkdew8cz] { color: #8b3c3c; background: #fde6e6; }
.application-badge.withdrawn[b-atvkdew8cz] { color: #606d69; background: #edf1ef; }

.no-applications[b-atvkdew8cz] {
    margin: 13px 0 0;
    padding: 17px;
    border-radius: 14px;
    color: #6e807a;
    text-align: center;
    background: #f2f7f5;
}

.timeline-list > div[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid #e2ece8;
    border-radius: 14px;
    background: #fff;
}

.timeline-list > div > span:first-child[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #1a755d;
    background: #e5f5ee;
}

.timeline-list strong[b-atvkdew8cz],
.timeline-list small[b-atvkdew8cz] {
    display: block;
}

.timeline-list strong[b-atvkdew8cz] {
    color: #31544a;
    font-size: .98rem;
    font-weight: 800;
}

.timeline-list small[b-atvkdew8cz] {
    color: var(--theme-muted);
    font-size: .86rem;
}

.timeline-list time[b-atvkdew8cz] {
    color: #71847d;
    font-size: .86rem;
    font-weight: 600;
}

.detail-actions[b-atvkdew8cz],
.modal-actions[b-atvkdew8cz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #e1ebe7;
}

.modal-actions.centered[b-atvkdew8cz] {
    justify-content: center;
}

[b-atvkdew8cz] .primary-action.mud-button-root,
[b-atvkdew8cz] .secondary-action.mud-button-root,
[b-atvkdew8cz] .danger-action.mud-button-root,
[b-atvkdew8cz] .delete-confirm-action.mud-button-root {
    min-height: 48px;
    padding-inline: 19px;
    border-radius: 13px;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
}

[b-atvkdew8cz] .primary-action.mud-button-root {
    color: #fff;
    background: linear-gradient(145deg, #168064, #0f604b);
}

[b-atvkdew8cz] .secondary-action.mud-button-root {
    color: #48655d;
    border-color: #cdded7;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

[b-atvkdew8cz] .danger-action.mud-button-root,
[b-atvkdew8cz] .delete-confirm-action.mud-button-root {
    color: #fff;
    background: linear-gradient(145deg, #c35050, #9c3434);
}

.form-section[b-atvkdew8cz],
.source-section[b-atvkdew8cz],
.photo-preview-section[b-atvkdew8cz] {
    margin-bottom: 16px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.form-section-title[b-atvkdew8cz] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 11px;
    color: #17765d;
}

.source-help-card[b-atvkdew8cz] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 13px;
    padding: 13px;
    border: 1px dashed #c8dfd5;
    border-radius: 14px;
    color: #5f756d;
    font-size: .95rem;
    background: #f2faf6;
}

.source-help-card[b-atvkdew8cz]  .mud-icon-root {
    flex: 0 0 auto;
    color: #1b7a61;
}

.switch-grid[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 14px;
}

[b-atvkdew8cz] .switch-grid .mud-switch,
[b-atvkdew8cz] .accept-followup.mud-checkbox {
    color: #385c52;
    font-size: 1rem;
    font-weight: 600;
}

.photo-preview-section img[b-atvkdew8cz],
.application-pet-summary img[b-atvkdew8cz] {
    display: block;
    width: 100%;
    object-fit: cover;
}

.photo-preview-section img[b-atvkdew8cz] {
    max-height: 360px;
    border-radius: 17px;
}

.application-pet-summary[b-atvkdew8cz] {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid var(--theme-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.application-pet-summary img[b-atvkdew8cz] {
    width: 112px;
    height: 94px;
    border-radius: 15px;
}

.application-pet-summary h3[b-atvkdew8cz] {
    margin: 0;
    color: #244d41;
    font-size: 1.3rem;
    font-weight: 900;
}

.application-pet-summary p[b-atvkdew8cz] {
    margin: 3px 0;
    color: var(--theme-muted);
    font-size: .96rem;
}

.application-pet-summary span[b-atvkdew8cz] {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    color: #17634f;
    font-size: .86rem;
    font-weight: 800;
    background: #e2f4ec;
}

.delete-icon[b-atvkdew8cz] {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    margin: 0 auto 15px;
    border-radius: 24px;
    color: #af4040;
    background: #fdeaea;
}

.delete-icon[b-atvkdew8cz]  .mud-icon-root {
    font-size: 42px;
}

.delete-modal h2[b-atvkdew8cz] {
    margin: 0 0 7px;
    color: #3f4543;
    font-size: 1.55rem;
    font-weight: 900;
}

.delete-modal p[b-atvkdew8cz] {
    margin: 0;
    color: #687872;
    font-size: 1.03rem;
    line-height: 1.65;
}

.modal-shell[b-atvkdew8cz]::-webkit-scrollbar {
    width: 10px;
}

.modal-shell[b-atvkdew8cz]::-webkit-scrollbar-track {
    background: transparent;
}

.modal-shell[b-atvkdew8cz]::-webkit-scrollbar-thumb {
    border: 3px solid transparent;
    border-radius: 999px;
    background: #a5bcb3;
    background-clip: padding-box;
}

@media (max-width: 1440px) {
    .quick-filter-row[b-atvkdew8cz] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

@media (max-width: 1120px) {
    .adoption-hero[b-atvkdew8cz],
    .insight-grid[b-atvkdew8cz] {
        grid-template-columns: 1fr;
    }

    .hero-action-panel[b-atvkdew8cz] {
        width: 100%;
    }

    .detail-hero-grid[b-atvkdew8cz] {
        grid-template-columns: 1fr;
    }

    .detail-photo-panel[b-atvkdew8cz],
    .detail-photo-panel > img[b-atvkdew8cz] {
        min-height: 420px;
    }

    .switch-grid[b-atvkdew8cz] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .adoption-page[b-atvkdew8cz] {
        padding-top: 12px;
        font-size: 16px;
    }

    .adoption-container[b-atvkdew8cz] {
        padding-inline: 10px !important;
    }

    .adoption-hero[b-atvkdew8cz] {
        min-height: 0;
        padding: 24px 18px;
        border-radius: 23px;
    }

    .hero-content h1[b-atvkdew8cz] {
        font-size: 2.25rem;
    }

    .hero-content > p[b-atvkdew8cz] {
        font-size: 1.03rem;
    }

    .hero-badge[b-atvkdew8cz] {
        align-items: flex-start;
    }

    .hero-badge > span[b-atvkdew8cz] {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
    }

    .hero-link-row[b-atvkdew8cz],
    .quick-filter-row[b-atvkdew8cz],
    .metric-grid[b-atvkdew8cz],
    .detail-stat-grid[b-atvkdew8cz],
    .detail-section-grid[b-atvkdew8cz],
    .switch-grid[b-atvkdew8cz] {
        grid-template-columns: 1fr;
    }

    .hero-source-button[b-atvkdew8cz],
    .hero-refresh-button[b-atvkdew8cz] {
        justify-content: flex-start;
        padding-inline: 14px;
    }

    .insight-heading[b-atvkdew8cz],
    .filter-heading[b-atvkdew8cz],
    .list-toolbar[b-atvkdew8cz],
    .section-title-row[b-atvkdew8cz] {
        flex-direction: column;
        align-items: stretch;
    }

    .insight-heading > span[b-atvkdew8cz],
    .clear-filter-button[b-atvkdew8cz],
    [b-atvkdew8cz] .toolbar-add-button.mud-button-root {
        width: 100%;
    }

    .clear-filter-button[b-atvkdew8cz] {
        justify-content: center;
    }

    .insight-panel[b-atvkdew8cz],
    .filter-panel[b-atvkdew8cz],
    .adoption-list-panel[b-atvkdew8cz] {
        padding: 17px;
        border-radius: 20px;
    }

    .adoption-card[b-atvkdew8cz] {
        min-height: 0;
    }

    .pet-photo-wrap[b-atvkdew8cz] {
        min-height: 230px;
    }

    .pet-facts[b-atvkdew8cz] {
        grid-template-columns: 1fr;
    }

    .adoption-card-footer[b-atvkdew8cz] {
        flex-wrap: wrap;
    }

    [b-atvkdew8cz] .detail-button.mud-button-root,
    [b-atvkdew8cz] .apply-button.mud-button-root {
        flex: 1 1 calc(50% - 6px);
    }

    .pagination-row[b-atvkdew8cz] {
        gap: 8px;
    }

    .pagination-row button[b-atvkdew8cz] {
        padding-inline: 10px;
    }

    .modal-backdrop[b-atvkdew8cz] {
        align-items: start;
        padding: 8px;
    }

    .modal-shell[b-atvkdew8cz] {
        max-height: calc(100vh - 16px);
        padding: 17px;
        border-radius: 20px;
    }

    .detail-photo-panel[b-atvkdew8cz],
    .detail-photo-panel > img[b-atvkdew8cz] {
        min-height: 280px;
    }

    .application-pet-summary[b-atvkdew8cz] {
        grid-template-columns: 82px minmax(0, 1fr);
    }

    .application-pet-summary img[b-atvkdew8cz] {
        width: 82px;
        height: 82px;
    }

    .application-list > article[b-atvkdew8cz],
    .timeline-list > div[b-atvkdew8cz] {
        grid-template-columns: 1fr;
    }

    .timeline-list > div > span:first-child[b-atvkdew8cz] {
        display: none;
    }

    .detail-actions[b-atvkdew8cz],
    .modal-actions[b-atvkdew8cz] {
        flex-direction: column-reverse;
    }

    [b-atvkdew8cz] .primary-action.mud-button-root,
    [b-atvkdew8cz] .secondary-action.mud-button-root,
    [b-atvkdew8cz] .danger-action.mud-button-root,
    [b-atvkdew8cz] .delete-confirm-action.mud-button-root {
        width: 100%;
    }
}

@media print {
    .adoption-page[b-atvkdew8cz] {
        padding: 0;
        background: #fff;
    }

    .adoption-hero[b-atvkdew8cz],
    .summary-grid[b-atvkdew8cz],
    .quick-filter-row[b-atvkdew8cz],
    .insight-grid[b-atvkdew8cz],
    .filter-panel[b-atvkdew8cz],
    .list-toolbar .toolbar-add-button[b-atvkdew8cz],
    .pagination-row[b-atvkdew8cz],
    .adoption-card-footer[b-atvkdew8cz],
    .modal-backdrop[b-atvkdew8cz] {
        display: none !important;
    }

    .adoption-list-panel[b-atvkdew8cz],
    .adoption-card[b-atvkdew8cz] {
        border: 1px solid #bbb;
        box-shadow: none;
    }
}

/* Supplemental component actions and timeline layout */
[b-atvkdew8cz] .detail-apply-button.mud-button-root {
    min-height: 48px;
    padding-inline: 19px;
    border-radius: 13px;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
    background: linear-gradient(145deg, #c55d78, #a94360);
    box-shadow: 0 9px 22px rgba(166, 63, 91, .2);
}

[b-atvkdew8cz] .delete-action.mud-button-root {
    min-height: 48px;
    padding-inline: 17px;
    border-radius: 13px;
    color: #a83d3d;
    border-color: #e7baba;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
    background: #fff8f8;
}

.timeline-list > div[b-atvkdew8cz] {
    position: relative;
    grid-template-columns: 15px minmax(0, 1fr);
    align-items: start;
}

.timeline-list > div > span:first-child[b-atvkdew8cz] {
    width: 13px;
    height: 13px;
    margin-top: 7px;
    border: 3px solid #c9e9dc;
    border-radius: 50%;
    background: #168064;
    box-shadow: 0 0 0 5px #eef8f4;
}

.timeline-list article[b-atvkdew8cz] {
    min-width: 0;
}

.timeline-list article p[b-atvkdew8cz] {
    margin: 4px 0;
    color: #61756e;
    font-size: .94rem;
    line-height: 1.6;
}

.timeline-list article em[b-atvkdew8cz] {
    color: #7a8d86;
    font-size: .86rem;
    font-style: normal;
    font-weight: 600;
}

@media (max-width: 760px) {
    [b-atvkdew8cz] .detail-apply-button.mud-button-root,
    [b-atvkdew8cz] .delete-action.mud-button-root {
        width: 100%;
    }

    .timeline-list > div[b-atvkdew8cz] {
        grid-template-columns: 13px minmax(0, 1fr);
    }

    .timeline-list > div > span:first-child[b-atvkdew8cz] {
        display: block;
    }
}
/* /Components/Pages/02Specialized/07Pets/PetRegistrations.razor.rz.scp.css */
:root[b-1g9s4twg9t] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.pet-page[b-1g9s4twg9t] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.pet-page[b-1g9s4twg9t]  .pet-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.pet-hero[b-1g9s4twg9t] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-1g9s4twg9t] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-1g9s4twg9t] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-1g9s4twg9t],
.hero-action-panel[b-1g9s4twg9t] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-1g9s4twg9t] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-1g9s4twg9t] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-1g9s4twg9t] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-1g9s4twg9t] {
    color: #d8ede6;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-1g9s4twg9t] {
    margin-top: 3px;
    font-size: .94rem;
}

.pet-hero h1[b-1g9s4twg9t] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.pet-hero p[b-1g9s4twg9t] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-1g9s4twg9t] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .90rem;
    font-weight: 650;
}

.hero-action-panel[b-1g9s4twg9t] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-1g9s4twg9t] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-1g9s4twg9t] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-1g9s4twg9t] {
    font-size: .90rem;
}

.hero-status small[b-1g9s4twg9t] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .90rem;
}

.pet-page[b-1g9s4twg9t]  .hero-add-button,
.pet-page[b-1g9s4twg9t]  .toolbar-add-button,
.pet-page[b-1g9s4twg9t]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.pet-page[b-1g9s4twg9t]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-1g9s4twg9t],
.hero-refresh-button[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-1g9s4twg9t] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-1g9s4twg9t] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-1g9s4twg9t] {
    opacity: .55;
    cursor: wait;
}

.pet-page[b-1g9s4twg9t]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.pet-page[b-1g9s4twg9t]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-1g9s4twg9t] {
    margin-top: 2px !important;
}

.summary-card[b-1g9s4twg9t] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-1g9s4twg9t] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-1g9s4twg9t] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-1g9s4twg9t] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-1g9s4twg9t] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-1g9s4twg9t] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-1g9s4twg9t] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-1g9s4twg9t] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-1g9s4twg9t] {
    color: #788982;
    font-size: .90rem;
    font-weight: 650;
}

.summary-card p[b-1g9s4twg9t] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-1g9s4twg9t] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-1g9s4twg9t] {
    color: #798a83;
    font-size: .90rem;
}

.summary-card em[b-1g9s4twg9t] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-1g9s4twg9t],
.status-overview-card.selected[b-1g9s4twg9t] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-1g9s4twg9t] {
    background: #f5faf7;
}

.status-overview-card > span[b-1g9s4twg9t] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-1g9s4twg9t] { background:#687872; }
.status-overview-card.reviewing > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.difference > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.approved > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.closed > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.voided > span[b-1g9s4twg9t] { background:#687872; }
.status-overview-card.today > span[b-1g9s4twg9t] { background:#73569b; }

.status-overview-card div[b-1g9s4twg9t] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-1g9s4twg9t] {
    color: var(--theme-muted);
    font-size: .90rem;
}

.status-overview-card strong[b-1g9s4twg9t] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-1g9s4twg9t] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-1g9s4twg9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-1g9s4twg9t] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-1g9s4twg9t] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .90rem;
    font-weight: 700;
}

.variance-grid[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-1g9s4twg9t] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-1g9s4twg9t] {
    display: block;
    color: #3c5047;
    font-size: .90rem;
}

.variance-card small[b-1g9s4twg9t] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .90rem;
}

.closing-progress[b-1g9s4twg9t] {
    margin-top: 13px;
}

.progress-track[b-1g9s4twg9t] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-1g9s4twg9t] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-1g9s4twg9t] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-1g9s4twg9t] {
    display: block;
    color: #87958f;
    font-size: .90rem;
}

.progress-metrics strong[b-1g9s4twg9t] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-1g9s4twg9t],
.pet-list-panel[b-1g9s4twg9t] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-1g9s4twg9t] {
    padding: 15px;
}

.filter-heading[b-1g9s4twg9t],
.list-toolbar[b-1g9s4twg9t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-1g9s4twg9t],
.panel-kicker[b-1g9s4twg9t] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-1g9s4twg9t],
.list-toolbar h2[b-1g9s4twg9t] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-1g9s4twg9t],
.list-toolbar p[b-1g9s4twg9t] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .90rem;
    line-height: 1.65;
}

.clear-filter-button[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-1g9s4twg9t] {
    margin-top: 8px !important;
}

.pet-page[b-1g9s4twg9t]  .premium-field,
.pet-page[b-1g9s4twg9t]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.pet-page[b-1g9s4twg9t]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    text-transform: none !important;
}

.filter-summary[b-1g9s4twg9t] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .90rem;
}

.filter-summary strong[b-1g9s4twg9t] {
    color: var(--theme-primary);
}

.pet-list-panel[b-1g9s4twg9t] {
    overflow: hidden;
}

.list-toolbar[b-1g9s4twg9t] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.pet-page[b-1g9s4twg9t]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-1g9s4twg9t] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-1g9s4twg9t] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-1g9s4twg9t] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-1g9s4twg9t] {
    margin: 0;
    font-size: .90rem;
}

.pet-page[b-1g9s4twg9t]  .pet-table {
    font-family: 'Kanit',sans-serif;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head {
    background: #f1f7f4;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .90rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-1g9s4twg9t] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-1g9s4twg9t] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-1g9s4twg9t] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .90rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-1g9s4twg9t] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .90rem;
}

.date-shift-cell[b-1g9s4twg9t],
.counter-cashier-cell[b-1g9s4twg9t],
.money-cell[b-1g9s4twg9t],
.difference-cell[b-1g9s4twg9t],
.transaction-status-cell[b-1g9s4twg9t] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-1g9s4twg9t] {
    min-width: 175px;
}

.date-shift-cell strong[b-1g9s4twg9t],
.counter-cashier-cell strong[b-1g9s4twg9t],
.money-cell strong[b-1g9s4twg9t],
.difference-cell strong[b-1g9s4twg9t],
.transaction-status-cell strong[b-1g9s4twg9t] {
    color: #3c5047;
    font-size: .90rem;
    line-height: 1.48;
}

.date-shift-cell small[b-1g9s4twg9t],
.counter-cashier-cell small[b-1g9s4twg9t],
.money-cell small[b-1g9s4twg9t],
.difference-cell small[b-1g9s4twg9t] {
    margin-top: 3px;
    color: #84928d;
    font-size: .90rem;
}

.date-shift-cell em[b-1g9s4twg9t],
.counter-cashier-cell em[b-1g9s4twg9t] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-1g9s4twg9t] { color:var(--theme-primary); }
.money-cell.actual strong[b-1g9s4twg9t] { color:#2f789f; }

.difference-cell.matched strong[b-1g9s4twg9t] { color:#34734b; }
.difference-cell.over strong[b-1g9s4twg9t] { color:#987634; }
.difference-cell.short strong[b-1g9s4twg9t] { color:#b54d43; }

.status-chip[b-1g9s4twg9t],
.match-chip[b-1g9s4twg9t] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .90rem;
    font-weight: 700;
}

.status-chip i[b-1g9s4twg9t] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.difference[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-1g9s4twg9t] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-1g9s4twg9t] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.pet-page[b-1g9s4twg9t]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.pet-page[b-1g9s4twg9t]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.pet-page[b-1g9s4twg9t]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.pet-page[b-1g9s4twg9t]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.pet-page[b-1g9s4twg9t]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-1g9s4twg9t] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-1g9s4twg9t] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .90rem;
}

/* MODALS */

.modal-backdrop[b-1g9s4twg9t],
.image-preview-backdrop[b-1g9s4twg9t] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.pet-form-modal[b-1g9s4twg9t],
.pet-view-modal[b-1g9s4twg9t],
.delete-modal[b-1g9s4twg9t],
.image-preview-modal[b-1g9s4twg9t] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-1g9s4twg9t],
.view-toolbar[b-1g9s4twg9t],
.image-preview-header[b-1g9s4twg9t] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-1g9s4twg9t] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-1g9s4twg9t] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-1g9s4twg9t],
.view-toolbar small[b-1g9s4twg9t],
.image-preview-header small[b-1g9s4twg9t] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-1g9s4twg9t],
.view-toolbar h2[b-1g9s4twg9t],
.image-preview-header h3[b-1g9s4twg9t] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-1g9s4twg9t] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.modal-body[b-1g9s4twg9t],
.view-scroll[b-1g9s4twg9t] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-1g9s4twg9t] {
    background: #e9efec;
}

.modal-footer[b-1g9s4twg9t] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.pet-page[b-1g9s4twg9t]  .cancel-button,
.pet-page[b-1g9s4twg9t]  .save-button,
.pet-page[b-1g9s4twg9t]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.form-section-title[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-1g9s4twg9t] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-1g9s4twg9t] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-1g9s4twg9t] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.form-section-title small[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.open-transactions-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-1g9s4twg9t] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-1g9s4twg9t],
.calculation-heading[b-1g9s4twg9t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-1g9s4twg9t],
.calculation-heading small[b-1g9s4twg9t] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-1g9s4twg9t],
.calculation-heading h3[b-1g9s4twg9t] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-1g9s4twg9t],
.calculation-heading > span[b-1g9s4twg9t] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-1g9s4twg9t] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-1g9s4twg9t] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.source-summary-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.system-amount-grid[b-1g9s4twg9t] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-1g9s4twg9t] {
    display:block;
    color:#84928d;
    font-size:.90rem;
}

.system-amount-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.reconciliation-calculation-preview[b-1g9s4twg9t] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-1g9s4twg9t] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-1g9s4twg9t] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-1g9s4twg9t] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-1g9s4twg9t] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-1g9s4twg9t] {
    display:block;
    color:#8b7b74;
    font-size:.90rem;
}

.calculation-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.90rem;
}

.calculation-grid .short span[b-1g9s4twg9t],
.calculation-grid .short strong[b-1g9s4twg9t],
.calculation-grid .short small[b-1g9s4twg9t] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-1g9s4twg9t] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-1g9s4twg9t] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.photo-upload-heading small[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.photo-preview[b-1g9s4twg9t] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-1g9s4twg9t] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-1g9s4twg9t] {
    color:#40544b;
    font-size:.90rem;
}

.photo-empty small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.photo-upload-actions[b-1g9s4twg9t] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-1g9s4twg9t],
.remove-photo-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-1g9s4twg9t] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-1g9s4twg9t] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-1g9s4twg9t] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-1g9s4twg9t],
.detail-transaction-table[b-1g9s4twg9t] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-1g9s4twg9t],
.source-transaction-row[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-1g9s4twg9t] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-1g9s4twg9t],
.source-transaction-row > span[b-1g9s4twg9t] {
    padding:7px;
    font-size:.90rem;
}

.source-transaction-row[b-1g9s4twg9t] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-1g9s4twg9t] {
    border-bottom:0;
}

.mini-photo-button[b-1g9s4twg9t] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-1g9s4twg9t],
.source-transaction-more[b-1g9s4twg9t] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

.mock-rule-warning[b-1g9s4twg9t] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.90rem !important;
}

/* VIEW & PRINT */

.pet-view-modal[b-1g9s4twg9t] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.pet-page[b-1g9s4twg9t]  .view-edit-button,
.pet-page[b-1g9s4twg9t]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.pet-page[b-1g9s4twg9t]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-pet-profile[b-1g9s4twg9t] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-1g9s4twg9t] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-1g9s4twg9t] {
    text-align:center;
}

.document-organization small[b-1g9s4twg9t] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-1g9s4twg9t] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-1g9s4twg9t] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.90rem;
}

.document-number-box[b-1g9s4twg9t] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-1g9s4twg9t],
.document-number-box small[b-1g9s4twg9t] {
    display:block;
    color:#778980;
    font-size:.90rem;
}

.document-number-box strong[b-1g9s4twg9t] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
    word-break:break-word;
}

.document-status-strip[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-1g9s4twg9t] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-1g9s4twg9t] {
    display:block;
    color:#83918b;
    font-size:.90rem;
}

.document-status-strip > div strong[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.90rem;
}

.scope-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
}

.scope-reference-box[b-1g9s4twg9t] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.scope-reference-box strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.90rem;
}

.scope-reference-box small[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-1g9s4twg9t],
.transaction-summary-section[b-1g9s4twg9t],
.source-transaction-section[b-1g9s4twg9t],
.review-section[b-1g9s4twg9t] {
    margin-top:16px;
}

.section-title[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-1g9s4twg9t] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.90rem;
    font-weight:800;
}

.section-title small[b-1g9s4twg9t] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-1g9s4twg9t] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-1g9s4twg9t] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-1g9s4twg9t],
.comparison-row[b-1g9s4twg9t],
.comparison-total[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-1g9s4twg9t] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-1g9s4twg9t],
.comparison-row span[b-1g9s4twg9t],
.comparison-total span[b-1g9s4twg9t] {
    padding:8px 9px;
    font-size:.90rem;
}

.comparison-row[b-1g9s4twg9t] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-1g9s4twg9t],
.comparison-total span:not(:first-child)[b-1g9s4twg9t] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-1g9s4twg9t] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-1g9s4twg9t] { color:#34734b; }
.difference-text.over[b-1g9s4twg9t] { color:#987634; }
.difference-text.short[b-1g9s4twg9t] { color:#b54d43; }

.transaction-summary-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-1g9s4twg9t] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-1g9s4twg9t] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-1g9s4twg9t] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-1g9s4twg9t] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-1g9s4twg9t] { background:#f4fafc; }

.transaction-summary-grid span[b-1g9s4twg9t] {
    display:block;
    color:#84928c;
    font-size:.90rem;
}

.transaction-summary-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-1g9s4twg9t] {
    display:block;
    color:#798a83;
    font-size:.90rem;
}

.detail-transaction-header[b-1g9s4twg9t],
.detail-transaction-row[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-1g9s4twg9t] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-1g9s4twg9t],
.detail-transaction-row span[b-1g9s4twg9t] {
    padding:8px 7px;
    font-size:.90rem;
}

.detail-transaction-row[b-1g9s4twg9t] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-1g9s4twg9t] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.review-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.review-note-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-1g9s4twg9t] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
}

.review-note-grid p[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.document-footer[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.document-footer p[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.90rem;
    line-height:1.6;
}

.qr-placeholder[b-1g9s4twg9t] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-1g9s4twg9t] {
    font-size:.90rem;
    font-weight:700;
}

.mock-document-label[b-1g9s4twg9t] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.90rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-1g9s4twg9t],
.attachment-panel[b-1g9s4twg9t] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-1g9s4twg9t] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-1g9s4twg9t] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:700;
}

.history-list[b-1g9s4twg9t] {
    display:grid;
    gap:7px;
}

.history-item[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-1g9s4twg9t] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-1g9s4twg9t] {
    color:#3c5047;
    font-size:.90rem;
}

.history-item small[b-1g9s4twg9t],
.history-item em[b-1g9s4twg9t] {
    color:#84928d;
    font-size:.90rem;
    font-style:normal;
}

.history-item p[b-1g9s4twg9t] {
    margin:4px 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.55;
}

.attachment-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-1g9s4twg9t] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-1g9s4twg9t] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-1g9s4twg9t] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-1g9s4twg9t] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-1g9s4twg9t] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-1g9s4twg9t] { background:rgba(52,115,75,.89); }

.attachment-empty[b-1g9s4twg9t] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-1g9s4twg9t] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-1g9s4twg9t] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-1g9s4twg9t] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-1g9s4twg9t] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-1g9s4twg9t] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-1g9s4twg9t] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-1g9s4twg9t] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.7;
}

.delete-modal p strong[b-1g9s4twg9t] {
    color:#b54d43;
}

.delete-warning[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.90rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-1g9s4twg9t] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.pet-page[b-1g9s4twg9t]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .pet-hero[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-1g9s4twg9t] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-1g9s4twg9t] {
        grid-column:1 / -1;
    }

    .document-header[b-1g9s4twg9t] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-1g9s4twg9t] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .pet-page[b-1g9s4twg9t] {
        padding-top:10px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-container {
        padding-inline:10px !important;
    }

    .pet-hero[b-1g9s4twg9t] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-1g9s4twg9t],
    .list-toolbar[b-1g9s4twg9t],
    .source-summary-heading[b-1g9s4twg9t],
    .calculation-heading[b-1g9s4twg9t],
    .view-toolbar[b-1g9s4twg9t],
    .section-heading[b-1g9s4twg9t] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-1g9s4twg9t],
    .variance-grid[b-1g9s4twg9t],
    .progress-metrics[b-1g9s4twg9t],
    .source-summary-grid[b-1g9s4twg9t],
    .system-amount-grid[b-1g9s4twg9t],
    .calculation-grid[b-1g9s4twg9t],
    .photo-upload-grid[b-1g9s4twg9t],
    .transaction-summary-grid[b-1g9s4twg9t],
    .review-grid[b-1g9s4twg9t],
    .review-note-grid[b-1g9s4twg9t],
    .attachment-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-1g9s4twg9t] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-1g9s4twg9t] {
        width:100%;
    }

    .print-pet-profile[b-1g9s4twg9t] {
        padding:22px 18px;
    }

    .document-footer[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-1g9s4twg9t] {
        grid-column:auto;
    }

    .status-overview[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-1g9s4twg9t] {
        width:100%;
    }

    .document-header[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-1g9s4twg9t] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-1g9s4twg9t] {
        visibility:hidden !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-1g9s4twg9t] {
        display:none !important;
    }

    .modal-backdrop[b-1g9s4twg9t],
    .pet-view-modal[b-1g9s4twg9t],
    .view-scroll[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .scope-panel[b-1g9s4twg9t],
    .amount-comparison-section[b-1g9s4twg9t],
    .transaction-summary-section[b-1g9s4twg9t],
    .source-transaction-section[b-1g9s4twg9t],
    .review-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }

    .mock-document-label[b-1g9s4twg9t] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-1g9s4twg9t] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.pet-page[b-1g9s4twg9t]  .hero-add-button,
.pet-page[b-1g9s4twg9t]  .toolbar-add-button,
.pet-page[b-1g9s4twg9t]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.confirmed > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.checked-in > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.in-service > span[b-1g9s4twg9t] { background:#c46a2b; }
.status-overview-card.completed > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.cancelled > span[b-1g9s4twg9t] { background:#b54d43; }

.service-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-1g9s4twg9t],
.service-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-1g9s4twg9t] {
    background:#f4faf7;
}

.service-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.service-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-1g9s4twg9t] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-1g9s4twg9t] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.focus-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.90rem;
}

/* TABLE */

.citizen-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-1g9s4twg9t] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.citizen-photo-cell small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.90rem;
}

.appointment-time-cell[b-1g9s4twg9t],
.service-unit-cell[b-1g9s4twg9t],
.provider-location-cell[b-1g9s4twg9t],
.queue-priority-cell[b-1g9s4twg9t],
.reason-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-1g9s4twg9t],
.reason-cell[b-1g9s4twg9t] {
    min-width:180px;
}

.appointment-time-cell strong[b-1g9s4twg9t],
.service-unit-cell strong[b-1g9s4twg9t],
.provider-location-cell strong[b-1g9s4twg9t],
.queue-priority-cell strong[b-1g9s4twg9t],
.reason-cell strong[b-1g9s4twg9t] {
    color:#3c5047;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell small[b-1g9s4twg9t],
.service-unit-cell small[b-1g9s4twg9t],
.provider-location-cell small[b-1g9s4twg9t],
.queue-priority-cell small[b-1g9s4twg9t],
.reason-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell em[b-1g9s4twg9t],
.provider-location-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-1g9s4twg9t],
.priority-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-1g9s4twg9t] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-1g9s4twg9t] { color:#987634; background:#fff4df; }

.priority-chip[b-1g9s4twg9t] {
    margin-top:5px;
}

.priority-chip.normal[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-1g9s4twg9t] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-1g9s4twg9t] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-1g9s4twg9t] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.identity-chip[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.identity-chip.verified[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-1g9s4twg9t],
.identity-chip.not-found[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-1g9s4twg9t] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.citizen-source-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.citizen-address[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.90rem;
}

.citizen-source-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-1g9s4twg9t],
.citizen-source-actions a[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-1g9s4twg9t] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-1g9s4twg9t] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-1g9s4twg9t] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.preview-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.consent-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-1g9s4twg9t] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-1g9s4twg9t] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-1g9s4twg9t] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-1g9s4twg9t] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-1g9s4twg9t] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-1g9s4twg9t] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-1g9s4twg9t] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.5;
}

.identity-box[b-1g9s4twg9t] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-1g9s4twg9t],
.identity-box small[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.identity-box strong[b-1g9s4twg9t] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
}

.service-section[b-1g9s4twg9t],
.reason-section[b-1g9s4twg9t],
.reminder-section[b-1g9s4twg9t] {
    margin-top:16px;
}

.reference-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-1g9s4twg9t] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-1g9s4twg9t],
.timeline-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.reference-grid strong[b-1g9s4twg9t],
.timeline-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.note-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-1g9s4twg9t] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-1g9s4twg9t] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.note-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.note-grid p[b-1g9s4twg9t] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.timeline-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-1g9s4twg9t] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.90rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-1g9s4twg9t] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-1g9s4twg9t] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-1g9s4twg9t],
    .preview-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-1g9s4twg9t] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-1g9s4twg9t] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-1g9s4twg9t] {
        grid-column:1 / -1;
    }

    .reference-grid[b-1g9s4twg9t],
    .timeline-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-1g9s4twg9t],
    .focus-grid[b-1g9s4twg9t],
    .citizen-source-grid[b-1g9s4twg9t],
    .preview-grid[b-1g9s4twg9t],
    .consent-grid[b-1g9s4twg9t],
    .source-photo-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .note-grid[b-1g9s4twg9t],
    .timeline-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-1g9s4twg9t] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-1g9s4twg9t] {
        margin:0 auto;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .service-section[b-1g9s4twg9t],
    .reason-section[b-1g9s4twg9t],
    .reminder-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size: 16px;
    line-height: 1.55;
}

.pet-page[b-1g9s4twg9t]  .mud-typography,
.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-input-label,
.pet-page[b-1g9s4twg9t]  .mud-select,
.pet-page[b-1g9s4twg9t]  .mud-list-item-text,
.pet-page[b-1g9s4twg9t]  .mud-button-label,
.pet-page[b-1g9s4twg9t]  .mud-table-cell,
.pet-page[b-1g9s4twg9t]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size: .92rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size: .90rem !important;
    font-weight: 600 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size: .90rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size: .90rem !important;
    font-weight: 700 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .90rem !important;
    line-height: 1.55 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .90rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-1g9s4twg9t] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-1g9s4twg9t] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-1g9s4twg9t] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-1g9s4twg9t] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-1g9s4twg9t] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-1g9s4twg9t] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-1g9s4twg9t] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-1g9s4twg9t] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-1g9s4twg9t],
.pet-list-panel[b-1g9s4twg9t],
.insight-panel[b-1g9s4twg9t] {
    border-radius: 20px;
}

.filter-panel[b-1g9s4twg9t] {
    padding: 20px;
}

.list-toolbar[b-1g9s4twg9t] {
    padding: 19px 20px;
}

.filter-heading p[b-1g9s4twg9t],
.list-toolbar p[b-1g9s4twg9t] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-1g9s4twg9t] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-1g9s4twg9t] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-1g9s4twg9t],
.service-unit-cell[b-1g9s4twg9t],
.provider-location-cell[b-1g9s4twg9t],
.queue-priority-cell[b-1g9s4twg9t],
.reason-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    min-width: 155px;
}

.provider-location-cell[b-1g9s4twg9t],
.reason-cell[b-1g9s4twg9t] {
    min-width: 215px;
}

.service-chip[b-1g9s4twg9t],
.priority-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.identity-chip[b-1g9s4twg9t] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-1g9s4twg9t] {
    min-width: 205px;
    gap: 7px;
}

.pet-page[b-1g9s4twg9t]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-1g9s4twg9t] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-1g9s4twg9t],
.view-toolbar[b-1g9s4twg9t],
.image-preview-header[b-1g9s4twg9t] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-1g9s4twg9t],
.view-scroll[b-1g9s4twg9t] {
    padding: 20px;
}

.modal-footer[b-1g9s4twg9t] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-1g9s4twg9t] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-1g9s4twg9t] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-1g9s4twg9t],
.preview-grid > div[b-1g9s4twg9t],
.reference-grid > div[b-1g9s4twg9t],
.timeline-grid > div[b-1g9s4twg9t] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-1g9s4twg9t] {
    padding: 13px;
}

.photo-preview[b-1g9s4twg9t] {
    min-height: 200px;
}

.photo-preview img[b-1g9s4twg9t] {
    height: 200px;
}

.history-item[b-1g9s4twg9t] {
    padding: 12px;
}

.attachment-card[b-1g9s4twg9t],
.attachment-card img[b-1g9s4twg9t] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .pet-page[b-1g9s4twg9t] {
        font-size: 15px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .90rem !important;
    }

    .summary-card[b-1g9s4twg9t] {
        min-height: 122px;
    }

    .status-overview-card[b-1g9s4twg9t],
    .service-overview-card[b-1g9s4twg9t] {
        min-height: 82px;
    }

    .modal-body[b-1g9s4twg9t],
    .view-scroll[b-1g9s4twg9t] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #pet-profile-print-area[b-1g9s4twg9t] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #pet-profile-print-area h1[b-1g9s4twg9t] {
        font-size: 18pt !important;
    }

    #pet-profile-print-area h2[b-1g9s4twg9t] {
        font-size: 14pt !important;
    }

    #pet-profile-print-area h3[b-1g9s4twg9t] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.follow-up > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.referred > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.cancelled > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.month > span[b-1g9s4twg9t] { background:#73569b; }

.service-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-1g9s4twg9t] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-1g9s4twg9t] {
    display:block;
    color:#7c8d86;
    font-size:.90rem;
}

.care-metrics strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-1g9s4twg9t],
.service-unit-cell[b-1g9s4twg9t],
.provider-location-cell[b-1g9s4twg9t],
.result-cell[b-1g9s4twg9t],
.follow-score-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-1g9s4twg9t],
.result-cell[b-1g9s4twg9t] {
    min-width:230px;
}

.history-date-cell strong[b-1g9s4twg9t],
.service-unit-cell strong[b-1g9s4twg9t],
.provider-location-cell strong[b-1g9s4twg9t],
.result-cell strong[b-1g9s4twg9t],
.follow-score-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-1g9s4twg9t],
.service-unit-cell small[b-1g9s4twg9t],
.provider-location-cell small[b-1g9s4twg9t],
.result-cell small[b-1g9s4twg9t],
.follow-score-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.history-date-cell em[b-1g9s4twg9t],
.provider-location-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.referred[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-1g9s4twg9t] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-1g9s4twg9t] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-1g9s4twg9t] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-1g9s4twg9t] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-1g9s4twg9t],
.source-actions button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-1g9s4twg9t] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-1g9s4twg9t] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-1g9s4twg9t] {
    min-height:180px;
}

.source-photo-card img[b-1g9s4twg9t] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-1g9s4twg9t] {
    margin-top:18px;
}

.vital-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-1g9s4twg9t],
.quality-grid > div[b-1g9s4twg9t],
.follow-up-grid > div[b-1g9s4twg9t] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-1g9s4twg9t],
.quality-grid span[b-1g9s4twg9t],
.follow-up-grid span[b-1g9s4twg9t] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-1g9s4twg9t],
.quality-grid strong[b-1g9s4twg9t],
.follow-up-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.vital-summary[b-1g9s4twg9t] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.90rem;
    line-height:1.65;
}

.follow-up-grid[b-1g9s4twg9t],
.quality-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.55 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:.94rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:.92rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-1g9s4twg9t] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-1g9s4twg9t] { background:rgba(104,120,114,.89); }

.view-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-1g9s4twg9t],
    .service-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-1g9s4twg9t],
    .vital-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-1g9s4twg9t] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-1g9s4twg9t],
    .quality-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-1g9s4twg9t],
    .service-overview[b-1g9s4twg9t],
    .care-metrics[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .source-photo-grid[b-1g9s4twg9t],
    .vital-grid[b-1g9s4twg9t],
    .follow-up-grid[b-1g9s4twg9t],
    .quality-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.follow-up > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.referred > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.overdue > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.inactive > span[b-1g9s4twg9t] { background:#687872; }

.risk-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-1g9s4twg9t],
.risk-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.risk-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-1g9s4twg9t] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-1g9s4twg9t],
.care-metrics strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-1g9s4twg9t],
.care-metrics small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.care-metrics[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-1g9s4twg9t] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-1g9s4twg9t],
.risk-adl-cell[b-1g9s4twg9t],
.dependency-living-cell[b-1g9s4twg9t],
.caregiver-cell[b-1g9s4twg9t],
.follow-up-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-1g9s4twg9t] {
    min-width:190px;
}

.register-age-cell strong[b-1g9s4twg9t],
.risk-adl-cell strong[b-1g9s4twg9t],
.dependency-living-cell strong[b-1g9s4twg9t],
.caregiver-cell strong[b-1g9s4twg9t],
.follow-up-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-1g9s4twg9t],
.risk-adl-cell small[b-1g9s4twg9t],
.dependency-living-cell small[b-1g9s4twg9t],
.caregiver-cell small[b-1g9s4twg9t],
.follow-up-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.register-age-cell em[b-1g9s4twg9t],
.caregiver-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-1g9s4twg9t],
.dependency-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.identity-chip[b-1g9s4twg9t],
.overdue-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.risk-chip.low[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.risk-chip.high[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.active[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.referred[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.overdue-chip[b-1g9s4twg9t] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-1g9s4twg9t] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-1g9s4twg9t] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-1g9s4twg9t] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-1g9s4twg9t] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.6;
}

.source-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-1g9s4twg9t],
.source-actions button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-1g9s4twg9t] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-1g9s4twg9t] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.assessment-preview strong[b-1g9s4twg9t] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-1g9s4twg9t],
.reference-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-1g9s4twg9t],
.reference-grid > div[b-1g9s4twg9t],
.care-plan-grid > div[b-1g9s4twg9t] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-1g9s4twg9t],
.reference-grid span[b-1g9s4twg9t],
.care-plan-grid span[b-1g9s4twg9t] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.assessment-grid strong[b-1g9s4twg9t],
.reference-grid strong[b-1g9s4twg9t],
.care-plan-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.55;
}

.care-plan-main[b-1g9s4twg9t] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.90rem;
    line-height:1.7;
}

.care-plan-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.58 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:.96rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:.94rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-1g9s4twg9t] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-1g9s4twg9t] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-1g9s4twg9t] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-1g9s4twg9t],
    .assessment-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-1g9s4twg9t],
    .risk-overview[b-1g9s4twg9t],
    .dependency-grid[b-1g9s4twg9t],
    .care-metrics[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .assessment-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .care-plan-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:16.5px;
    line-height:1.62;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-1g9s4twg9t] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.field > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.completed > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.follow-up > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.referred > span[b-1g9s4twg9t] { background:#b55b82; }

.visit-type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-1g9s4twg9t],
.visit-type-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-1g9s4twg9t] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.visit-type-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-1g9s4twg9t] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-1g9s4twg9t],
.care-metrics strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-1g9s4twg9t],
.care-metrics small[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE */

.visit-date-cell[b-1g9s4twg9t],
.visit-type-cell[b-1g9s4twg9t],
.team-location-cell[b-1g9s4twg9t],
.result-cell[b-1g9s4twg9t],
.follow-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-1g9s4twg9t],
.result-cell[b-1g9s4twg9t] {
    min-width:230px;
}

.visit-date-cell strong[b-1g9s4twg9t],
.visit-type-cell strong[b-1g9s4twg9t],
.team-location-cell strong[b-1g9s4twg9t],
.result-cell strong[b-1g9s4twg9t],
.follow-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-1g9s4twg9t],
.visit-type-cell small[b-1g9s4twg9t],
.team-location-cell small[b-1g9s4twg9t],
.result-cell small[b-1g9s4twg9t],
.follow-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.58;
}

.visit-date-cell em[b-1g9s4twg9t],
.team-location-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.identity-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.referred[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.priority-text[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-1g9s4twg9t] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-1g9s4twg9t] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-1g9s4twg9t] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-1g9s4twg9t] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.65;
}

.source-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-1g9s4twg9t] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-1g9s4twg9t],
.reference-grid > div[b-1g9s4twg9t] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-1g9s4twg9t],
.reference-grid span[b-1g9s4twg9t] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-1g9s4twg9t],
.reference-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:.98rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-1g9s4twg9t],
    .visit-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-1g9s4twg9t],
    .visit-type-overview[b-1g9s4twg9t],
    .target-grid[b-1g9s4twg9t],
    .care-metrics[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .vital-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.65;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-1g9s4twg9t] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.review > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.eligible > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.paid > span[b-1g9s4twg9t] { background:#73569b; }

.type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-1g9s4twg9t],
.type-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-1g9s4twg9t] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-1g9s4twg9t],
.target-grid button[b-1g9s4twg9t] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.budget-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

/* TABLE */

.application-no-cell[b-1g9s4twg9t],
.welfare-type-cell[b-1g9s4twg9t],
.household-cell[b-1g9s4twg9t],
.amount-cell[b-1g9s4twg9t],
.officer-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-1g9s4twg9t],
.officer-cell[b-1g9s4twg9t] {
    min-width:210px;
}

.application-no-cell strong[b-1g9s4twg9t],
.welfare-type-cell strong[b-1g9s4twg9t],
.household-cell strong[b-1g9s4twg9t],
.amount-cell strong[b-1g9s4twg9t],
.officer-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-1g9s4twg9t],
.welfare-type-cell small[b-1g9s4twg9t],
.household-cell small[b-1g9s4twg9t],
.amount-cell small[b-1g9s4twg9t],
.officer-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.application-no-cell em[b-1g9s4twg9t],
.household-cell em[b-1g9s4twg9t],
.amount-cell em[b-1g9s4twg9t],
.officer-cell em[b-1g9s4twg9t],
.citizen-photo-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.source-group-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.source-group-chip[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-1g9s4twg9t] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-1g9s4twg9t],
.amount-preview[b-1g9s4twg9t] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-1g9s4twg9t] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-1g9s4twg9t] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-1g9s4twg9t],
.amount-preview > div[b-1g9s4twg9t] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-1g9s4twg9t],
.amount-preview small[b-1g9s4twg9t] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.amount-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-1g9s4twg9t],
.amount-preview strong[b-1g9s4twg9t] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-1g9s4twg9t],
.amount-preview span[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-document-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-1g9s4twg9t] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-1g9s4twg9t],
.amount-document-grid small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-document-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-1g9s4twg9t] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-1g9s4twg9t] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-1g9s4twg9t] {
    min-height:43px;
    font-size:.90rem;
}

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-1g9s4twg9t] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-1g9s4twg9t],
    .type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .type-overview[b-1g9s4twg9t],
    .budget-grid[b-1g9s4twg9t],
    .target-grid[b-1g9s4twg9t],
    .care-metrics[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .assessment-preview[b-1g9s4twg9t],
    .amount-preview[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.66;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-1g9s4twg9t] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.payment > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.suspended > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.expiring > span[b-1g9s4twg9t] { background:#73569b; }

.target-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-1g9s4twg9t],
.target-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-1g9s4twg9t] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.target-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-1g9s4twg9t],
.follow-grid button[b-1g9s4twg9t] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-metrics strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

.follow-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-1g9s4twg9t] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.registry-cell[b-1g9s4twg9t],
.benefit-cell[b-1g9s4twg9t],
.period-cell[b-1g9s4twg9t],
.amount-cell[b-1g9s4twg9t],
.payment-cycle-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-1g9s4twg9t] {
    min-width:225px;
}

.registry-cell strong[b-1g9s4twg9t],
.benefit-cell strong[b-1g9s4twg9t],
.period-cell strong[b-1g9s4twg9t],
.amount-cell strong[b-1g9s4twg9t],
.payment-cycle-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-1g9s4twg9t],
.benefit-cell small[b-1g9s4twg9t],
.period-cell small[b-1g9s4twg9t],
.amount-cell small[b-1g9s4twg9t],
.payment-cycle-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.registry-cell em[b-1g9s4twg9t],
.period-cell em[b-1g9s4twg9t],
.amount-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-1g9s4twg9t],
.cycle-chip[b-1g9s4twg9t],
.verify-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.source-group-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.benefit-chip.allowance[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-1g9s4twg9t] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.expired[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.source-group-chip[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-1g9s4twg9t] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-1g9s4twg9t] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-1g9s4twg9t] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-1g9s4twg9t] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* LARGE MUD TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-1g9s4twg9t] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-1g9s4twg9t] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-1g9s4twg9t],
    .target-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .target-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .condition-switch-grid[b-1g9s4twg9t],
    .amount-preview[b-1g9s4twg9t],
    .source-data-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .patient-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.66;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-1g9s4twg9t] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-1g9s4twg9t] { background:#687872; }
.status-overview-card.approval > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.processing > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.paid > span[b-1g9s4twg9t] { background:#34734b; }
.status-overview-card.failed > span[b-1g9s4twg9t] { background:#b54d43; }

.disbursement-progress[b-1g9s4twg9t] {
    margin-top:15px;
}

.disbursement-progress > div[b-1g9s4twg9t] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-1g9s4twg9t],
.amount-cell[b-1g9s4twg9t],
.progress-cell[b-1g9s4twg9t],
.date-cell[b-1g9s4twg9t],
.control-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-1g9s4twg9t] {
    min-width:245px;
}

.batch-cell strong[b-1g9s4twg9t],
.amount-cell strong[b-1g9s4twg9t],
.progress-cell strong[b-1g9s4twg9t],
.date-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-1g9s4twg9t],
.amount-cell small[b-1g9s4twg9t],
.progress-cell small[b-1g9s4twg9t],
.date-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.batch-cell em[b-1g9s4twg9t],
.amount-cell em[b-1g9s4twg9t],
.date-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-1g9s4twg9t] {
    min-width:180px;
}

.recipient-stack[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-1g9s4twg9t],
.recipient-stack span[b-1g9s4twg9t] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-1g9s4twg9t] {
    margin-left:0;
}

.recipient-stack img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.recipient-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.table-progress[b-1g9s4twg9t] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-1g9s4twg9t],
.approval-chip[b-1g9s4twg9t],
.reconcile-chip[b-1g9s4twg9t],
.cycle-chip[b-1g9s4twg9t],
.line-status-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.approved[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.control-cell[b-1g9s4twg9t] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-1g9s4twg9t] {
    align-items:center;
}

.selection-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-1g9s4twg9t] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-1g9s4twg9t] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-1g9s4twg9t] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-1g9s4twg9t] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.source-selection-summary strong[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-1g9s4twg9t] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-1g9s4twg9t] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-1g9s4twg9t],
.source-selection-table td[b-1g9s4twg9t] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.90rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-1g9s4twg9t] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.90rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-1g9s4twg9t] {
    background:#f0faf6;
}

.source-person-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-1g9s4twg9t] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-1g9s4twg9t],
.source-benefit-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-person-cell small[b-1g9s4twg9t],
.source-benefit-cell small[b-1g9s4twg9t],
.source-date[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.source-person-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.source-benefit-cell[b-1g9s4twg9t] {
    min-width:190px;
}

.source-amount[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.bank-readiness span.ready[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.source-document-buttons[b-1g9s4twg9t] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-1g9s4twg9t] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-1g9s4twg9t] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-1g9s4twg9t] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* DETAIL */

.batch-overview-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-1g9s4twg9t] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-1g9s4twg9t] {
    font-size:3.5rem;
}

.batch-overview-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-1g9s4twg9t] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.print-line-table-wrap[b-1g9s4twg9t] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-1g9s4twg9t] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-1g9s4twg9t],
.print-line-table td[b-1g9s4twg9t] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.90rem;
    vertical-align:top;
}

.print-line-table th[b-1g9s4twg9t] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-1g9s4twg9t],
.print-line-table td small[b-1g9s4twg9t] {
    display:block;
}

.print-line-table td small[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-1g9s4twg9t] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-1g9s4twg9t] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-1g9s4twg9t] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-1g9s4twg9t] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-1g9s4twg9t] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid strong[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.recipient-document-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-1g9s4twg9t] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-1g9s4twg9t] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-1g9s4twg9t] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-1g9s4twg9t] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-1g9s4twg9t] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-1g9s4twg9t],
    .recipient-detail-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-1g9s4twg9t] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-1g9s4twg9t] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .source-selection-summary[b-1g9s4twg9t],
    .amount-preview[b-1g9s4twg9t],
    .recipient-detail-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-1g9s4twg9t] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-1g9s4twg9t] {
        overflow-x:auto;
    }

    .source-selection-table[b-1g9s4twg9t] {
        min-width:1050px;
    }

    .batch-overview-panel[b-1g9s4twg9t],
    .recipient-detail-card[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-1g9s4twg9t] {
        width:100%;
        height:190px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .batch-overview-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.66;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t],
.type-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.full > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.overflow > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.maintenance > span[b-1g9s4twg9t] { background:#73569b; }

.type-overview[b-1g9s4twg9t] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-1g9s4twg9t],
.type-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-1g9s4twg9t] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-1g9s4twg9t] {
    margin-top:15px;
}

.fill-progress > div[b-1g9s4twg9t] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-1g9s4twg9t] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-1g9s4twg9t] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-1g9s4twg9t] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-1g9s4twg9t] {
    background:#987634;
}

.map-pin.full[b-1g9s4twg9t] {
    background:#c56b2a;
}

.map-pin.overflow[b-1g9s4twg9t] {
    background:#b54d43;
}

.map-pin.maintenance[b-1g9s4twg9t] {
    background:#73569b;
}

.map-pin.inactive[b-1g9s4twg9t] {
    background:#687872;
}

.map-pin span[b-1g9s4twg9t] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-1g9s4twg9t] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-1g9s4twg9t] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-1g9s4twg9t] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-1g9s4twg9t] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-1g9s4twg9t] { background:#987634; }
.map-board-legend i.full[b-1g9s4twg9t] { background:#b54d43; }
.map-board-legend i.maintenance[b-1g9s4twg9t] { background:#73569b; }

.map-board-caption[b-1g9s4twg9t] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-1g9s4twg9t],
.map-board-caption small[b-1g9s4twg9t] {
    display:block;
}

.map-board-caption strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.point-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-1g9s4twg9t] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.point-photo-cell em[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-1g9s4twg9t],
.bin-cell[b-1g9s4twg9t],
.fill-cell[b-1g9s4twg9t],
.collection-cell[b-1g9s4twg9t],
.sensor-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-1g9s4twg9t] {
    min-width:220px;
}

.location-cell strong[b-1g9s4twg9t],
.bin-cell strong[b-1g9s4twg9t],
.fill-cell strong[b-1g9s4twg9t],
.collection-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-1g9s4twg9t],
.bin-cell small[b-1g9s4twg9t],
.fill-cell small[b-1g9s4twg9t],
.collection-cell small[b-1g9s4twg9t],
.sensor-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.waste-type-chip[b-1g9s4twg9t],
.collection-chip[b-1g9s4twg9t],
.sensor-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.waste-type-chip.general[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.status-chip.active[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.full[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.table-progress[b-1g9s4twg9t] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-1g9s4twg9t] { background:var(--theme-primary); }
.table-progress.medium span[b-1g9s4twg9t] { background:#2f789f; }
.table-progress.high span[b-1g9s4twg9t] { background:#987634; }
.table-progress.critical span[b-1g9s4twg9t] { background:#b54d43; }

.repair-alert[b-1g9s4twg9t],
.clean-alert[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-1g9s4twg9t] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-1g9s4twg9t] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-1g9s4twg9t] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.fill-preview-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-1g9s4twg9t] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-1g9s4twg9t] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-1g9s4twg9t] { background:#2f789f; }
.fill-preview-bin.high span[b-1g9s4twg9t] { background:#987634; }
.fill-preview-bin.critical span[b-1g9s4twg9t] { background:#b54d43; }

.fill-preview-bin strong[b-1g9s4twg9t] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-1g9s4twg9t] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.source-photo-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-1g9s4twg9t] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-1g9s4twg9t] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.large-fill-indicator[b-1g9s4twg9t] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-1g9s4twg9t] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-1g9s4twg9t] { background:#2f789f; }
.large-fill-indicator.high > span[b-1g9s4twg9t] { background:#987634; }
.large-fill-indicator.critical > span[b-1g9s4twg9t] { background:#b54d43; }

.large-fill-indicator strong[b-1g9s4twg9t],
.large-fill-indicator small[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-1g9s4twg9t] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.detail-map-preview[b-1g9s4twg9t] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-1g9s4twg9t] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-1g9s4twg9t] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-1g9s4twg9t] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-1g9s4twg9t] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.collection-history-list small[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-button.collect[b-1g9s4twg9t] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-1g9s4twg9t] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-1g9s4twg9t],
    .type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-1g9s4twg9t] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .type-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .condition-switch-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-1g9s4twg9t],
    .fill-preview-card[b-1g9s4twg9t],
    .coordinate-preview[b-1g9s4twg9t],
    .collection-history-list article[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-1g9s4twg9t] {
        min-height:240px;
    }

    .large-fill-indicator[b-1g9s4twg9t],
    .fill-preview-bin[b-1g9s4twg9t],
    .coordinate-pin[b-1g9s4twg9t] {
        margin:0 auto;
    }

    .map-board[b-1g9s4twg9t] {
        min-height:500px;
    }

    .map-pin[b-1g9s4twg9t] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .point-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.68;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.received > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.inspecting > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.in-progress > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.resolved > span[b-1g9s4twg9t] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-1g9s4twg9t]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-1g9s4twg9t],
.pollution-type-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.pollution-type-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-1g9s4twg9t] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-1g9s4twg9t] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-1g9s4twg9t] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-1g9s4twg9t] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-1g9s4twg9t] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-1g9s4twg9t] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-1g9s4twg9t] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-1g9s4twg9t] {
    margin-top:18px;
}

.sla-progress > div[b-1g9s4twg9t] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-1g9s4twg9t] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-1g9s4twg9t] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-1g9s4twg9t] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-1g9s4twg9t] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-1g9s4twg9t] { background:#2f789f; }
.pollution-map-pin.medium[b-1g9s4twg9t] { background:#987634; }
.pollution-map-pin.high[b-1g9s4twg9t] { background:#c56b2a; }
.pollution-map-pin.critical[b-1g9s4twg9t] { background:#b54d43; }

.pollution-map-pin span[b-1g9s4twg9t] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-1g9s4twg9t] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-1g9s4twg9t] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-1g9s4twg9t] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-1g9s4twg9t] { background:#2f789f; }
.map-board-legend i.medium[b-1g9s4twg9t] { background:#987634; }
.map-board-legend i.high[b-1g9s4twg9t] { background:#c56b2a; }
.map-board-legend i.critical[b-1g9s4twg9t] { background:#b54d43; }

.map-board-caption[b-1g9s4twg9t] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-1g9s4twg9t],
.map-board-caption small[b-1g9s4twg9t] {
    display:block;
}

.map-board-caption strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-1g9s4twg9t] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.complaint-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.type-severity-cell[b-1g9s4twg9t],
.reporter-cell[b-1g9s4twg9t],
.location-cell[b-1g9s4twg9t],
.inspection-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-1g9s4twg9t],
.location-cell[b-1g9s4twg9t] {
    min-width:195px;
}

.reporter-cell strong[b-1g9s4twg9t],
.location-cell strong[b-1g9s4twg9t],
.inspection-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-1g9s4twg9t],
.location-cell small[b-1g9s4twg9t],
.inspection-cell small[b-1g9s4twg9t],
.status-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.reporter-cell em[b-1g9s4twg9t],
.location-cell em[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.pollution-type-chip[b-1g9s4twg9t],
.severity-chip[b-1g9s4twg9t],
.inspection-chip[b-1g9s4twg9t],
.status-chip[b-1g9s4twg9t],
.overdue-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.pollution-type-chip.air[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.severity-chip.high[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-1g9s4twg9t] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-1g9s4twg9t] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-1g9s4twg9t] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* FORM */

.anonymous-switch-card[b-1g9s4twg9t] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-1g9s4twg9t],
.anonymous-switch-card small[b-1g9s4twg9t] {
    display:block;
}

.anonymous-switch-card strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.coordinate-preview[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-1g9s4twg9t],
.map-board-grid[b-1g9s4twg9t] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-1g9s4twg9t] { background:#c56b2a; }
.coordinate-pin.critical[b-1g9s4twg9t] { background:#b54d43; }
.coordinate-pin.medium[b-1g9s4twg9t] { background:#987634; }

.coordinate-pin .mud-icon-root[b-1g9s4twg9t] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-1g9s4twg9t] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.source-point-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-1g9s4twg9t] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-condition-row[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:750;
}

.source-condition-row span.warning[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-1g9s4twg9t] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-1g9s4twg9t] { color:#987634; background:#fff4df; }

.measurement-preview small[b-1g9s4twg9t],
.measurement-preview strong[b-1g9s4twg9t],
.measurement-preview em[b-1g9s4twg9t] {
    display:block;
}

.measurement-preview small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-preview strong[b-1g9s4twg9t] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.source-photo-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-1g9s4twg9t] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-1g9s4twg9t] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.severity-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.25rem;
}

.severity-emblem strong[b-1g9s4twg9t] {
    font-size:1.10rem;
}

.severity-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.measurement-document-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-1g9s4twg9t] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-1g9s4twg9t],
.measurement-document-grid strong[b-1g9s4twg9t] {
    display:block;
}

.measurement-document-grid span[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-1g9s4twg9t] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-1g9s4twg9t] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-1g9s4twg9t] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-1g9s4twg9t] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-1g9s4twg9t] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-1g9s4twg9t] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-1g9s4twg9t] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-1g9s4twg9t] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-1g9s4twg9t] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-1g9s4twg9t] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-1g9s4twg9t] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-1g9s4twg9t],
    .source-photo-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-1g9s4twg9t],
    .source-photo-preview button[b-1g9s4twg9t] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .pollution-type-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .measurement-preview[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-1g9s4twg9t],
    .coordinate-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .coordinate-pin[b-1g9s4twg9t] {
        margin:0 auto;
    }

    .pollution-map-board[b-1g9s4twg9t] {
        min-height:500px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .complaint-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.68;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.polluted > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.critical > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.restoring > span[b-1g9s4twg9t] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-1g9s4twg9t]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-1g9s4twg9t],
.institution-type-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-1g9s4twg9t] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-1g9s4twg9t] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-1g9s4twg9t] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-1g9s4twg9t] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-1g9s4twg9t] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-1g9s4twg9t] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-1g9s4twg9t] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.pet-metric-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.pet-metric-grid article[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.pet-metric-grid article > span[b-1g9s4twg9t] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.pet-metric-grid article.ph > span[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.pet-metric-grid article.do > span[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.pet-metric-grid article.bod > span[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.pet-metric-grid article.turbidity > span[b-1g9s4twg9t] { color:#987634; background:#fff4df; }

.pet-metric-grid small[b-1g9s4twg9t],
.pet-metric-grid strong[b-1g9s4twg9t],
.pet-metric-grid em[b-1g9s4twg9t] {
    display:block;
}

.pet-metric-grid small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.pet-metric-grid strong[b-1g9s4twg9t] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.pet-metric-grid em[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-1g9s4twg9t] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-1g9s4twg9t] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-1g9s4twg9t] { background:var(--theme-primary); }
.education-map-pin.watch[b-1g9s4twg9t] { background:#987634; }
.education-map-pin.polluted[b-1g9s4twg9t] { background:#c56b2a; }
.education-map-pin.critical[b-1g9s4twg9t] { background:#b54d43; }
.education-map-pin.restoring[b-1g9s4twg9t] { background:#73569b; }
.education-map-pin.closed[b-1g9s4twg9t] { background:#687872; }

.education-map-pin span[b-1g9s4twg9t] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-1g9s4twg9t] { background:var(--theme-primary); }
.map-board-legend i.watch[b-1g9s4twg9t] { background:#987634; }
.map-board-legend i.polluted[b-1g9s4twg9t] { background:#c56b2a; }
.map-board-legend i.critical[b-1g9s4twg9t] { background:#b54d43; }
.map-board-legend i.restoring[b-1g9s4twg9t] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-1g9s4twg9t],
.latest-progress-cell[b-1g9s4twg9t],
.inspection-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-1g9s4twg9t],
.quality-status-chip[b-1g9s4twg9t],
.usage-chip[b-1g9s4twg9t],
.lab-chip[b-1g9s4twg9t],
.no-progress-chip[b-1g9s4twg9t],
.overdue-chip[b-1g9s4twg9t],
.follow-up-chip[b-1g9s4twg9t],
.complaint-count-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.canal[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-1g9s4twg9t] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.usage-chip[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-1g9s4twg9t],
.inspection-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-1g9s4twg9t],
.inspection-cell small[b-1g9s4twg9t],
.type-level-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.90rem;
}

.size-cell strong[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
}

.row-action.sample[b-1g9s4twg9t] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-1g9s4twg9t] { background:var(--theme-primary); }
.coordinate-pin.watch[b-1g9s4twg9t] { background:#987634; }
.coordinate-pin.polluted[b-1g9s4twg9t] { background:#c56b2a; }
.coordinate-pin.critical[b-1g9s4twg9t] { background:#b54d43; }
.coordinate-pin.restoring[b-1g9s4twg9t] { background:#73569b; }
.coordinate-pin.closed[b-1g9s4twg9t] { background:#687872; }

.coordinate-pin .mud-icon-root[b-1g9s4twg9t] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-1g9s4twg9t] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-1g9s4twg9t] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.linked-photo-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-1g9s4twg9t] {
    color:#73569b;
    font-size:.90rem;
    font-weight:800;
}

.linked-photo-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-photo-preview button[b-1g9s4twg9t] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.vaccine-form-modal[b-1g9s4twg9t] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.review-score-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.review-score-preview article[b-1g9s4twg9t] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.review-score-preview small[b-1g9s4twg9t],
.review-score-preview strong[b-1g9s4twg9t],
.review-score-preview span[b-1g9s4twg9t] {
    display:block;
}

.review-score-preview small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-1g9s4twg9t] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.review-score-preview span[b-1g9s4twg9t] {
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.review-score-preview article.ph[b-1g9s4twg9t] { border-top:4px solid #73569b; }
.review-score-preview article.do[b-1g9s4twg9t] { border-top:4px solid #2f789f; }
.review-score-preview article.bod[b-1g9s4twg9t] { border-top:4px solid #c56b2a; }
.review-score-preview article.cod[b-1g9s4twg9t] { border-top:4px solid #b54d43; }
.review-score-preview article.turbidity[b-1g9s4twg9t] { border-top:4px solid #987634; }
.review-score-preview article.coliform[b-1g9s4twg9t] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-1g9s4twg9t] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-1g9s4twg9t] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-1g9s4twg9t] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.25rem;
}

.education-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.measurement-document-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-1g9s4twg9t] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-1g9s4twg9t],
.measurement-document-grid strong[b-1g9s4twg9t] {
    display:block;
}

.measurement-document-grid span[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-1g9s4twg9t] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.vaccine-history-panel[b-1g9s4twg9t],
.linked-complaint-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card-list[b-1g9s4twg9t],
.linked-complaint-list[b-1g9s4twg9t] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.vaccine-card[b-1g9s4twg9t] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.vaccine-card.good[b-1g9s4twg9t] { border-left-color:var(--theme-primary); }
.vaccine-card.watch[b-1g9s4twg9t] { border-left-color:#987634; }
.vaccine-card.polluted[b-1g9s4twg9t] { border-left-color:#c56b2a; }
.vaccine-card.critical[b-1g9s4twg9t] { border-left-color:#b54d43; }
.vaccine-card.restoring[b-1g9s4twg9t] { border-left-color:#73569b; }

.vaccine-card-head[b-1g9s4twg9t] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.vaccine-card-head strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.vaccine-card-head small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card-metrics[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.vaccine-card-metrics span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.90rem;
}

.vaccine-card-metrics strong[b-1g9s4twg9t] {
    color:#2f789f;
}

.vaccine-card p[b-1g9s4twg9t] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.assessment-photo-actions[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

.linked-complaint-list article[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-1g9s4twg9t] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.90rem;
}

.linked-complaint-list p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-complaint-list a[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.90rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-1g9s4twg9t] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .institution-type-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .amount-document-grid[b-1g9s4twg9t],
    .progress-photo-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-1g9s4twg9t],
    .coordinate-preview[b-1g9s4twg9t],
    .linked-complaint-list article[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .coordinate-pin[b-1g9s4twg9t] {
        margin:0 auto;
    }

    .education-map-board[b-1g9s4twg9t] {
        min-height:500px;
    }

    .linked-complaint-list button[b-1g9s4twg9t] {
        height:210px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .education-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.68;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-1g9s4twg9t] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-1g9s4twg9t] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.diseased > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-1g9s4twg9t] { background:#b54d43; }
.status-overview-card.treatment > span[b-1g9s4twg9t] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-1g9s4twg9t]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-1g9s4twg9t],
.institution-type-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-1g9s4twg9t] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-1g9s4twg9t] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-1g9s4twg9t] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-1g9s4twg9t] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-1g9s4twg9t] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-1g9s4twg9t] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-1g9s4twg9t] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.pet-metric-grid article.carbon > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.pet-metric-grid article.photo > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.pet-metric-grid article.maintenance > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.pet-metric-grid article.treatment > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-1g9s4twg9t] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-1g9s4twg9t] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-1g9s4twg9t] { background:var(--theme-primary); }
.education-map-pin.watch[b-1g9s4twg9t] { background:#987634; }
.education-map-pin.diseased[b-1g9s4twg9t] { background:#c56b2a; }
.education-map-pin.hazardous[b-1g9s4twg9t] { background:#b54d43; }
.education-map-pin.treatment[b-1g9s4twg9t] { background:#73569b; }
.education-map-pin.removed[b-1g9s4twg9t] { background:#687872; }

.education-map-pin span[b-1g9s4twg9t] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-1g9s4twg9t] { background:var(--theme-primary); }
.map-board-legend i.watch[b-1g9s4twg9t] { background:#987634; }
.map-board-legend i.diseased[b-1g9s4twg9t] { background:#c56b2a; }
.map-board-legend i.hazardous[b-1g9s4twg9t] { background:#b54d43; }
.map-board-legend i.treatment[b-1g9s4twg9t] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-1g9s4twg9t],
.latest-progress-cell[b-1g9s4twg9t],
.maintenance-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-1g9s4twg9t],
.health-status-chip[b-1g9s4twg9t],
.risk-chip[b-1g9s4twg9t],
.health-score-chip[b-1g9s4twg9t],
.no-progress-chip[b-1g9s4twg9t],
.overdue-chip[b-1g9s4twg9t],
.urgent-chip[b-1g9s4twg9t],
.water-link-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-1g9s4twg9t] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-1g9s4twg9t] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.risk-chip.high[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-1g9s4twg9t],
.urgent-chip[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-1g9s4twg9t],
.latest-progress-cell strong[b-1g9s4twg9t],
.maintenance-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-1g9s4twg9t],
.latest-progress-cell small[b-1g9s4twg9t],
.maintenance-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.size-cell strong[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.size-cell em[b-1g9s4twg9t] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.90rem;
    font-style:normal;
}

.row-action.inspect[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-1g9s4twg9t] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-1g9s4twg9t] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* INSPECTION */

.vaccine-form-modal[b-1g9s4twg9t] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.good[b-1g9s4twg9t] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.watch[b-1g9s4twg9t] {
    border-top:4px solid #987634;
}

.review-score-preview article.diseased[b-1g9s4twg9t],
.review-score-preview article.high[b-1g9s4twg9t] {
    border-top:4px solid #c56b2a;
}

.review-score-preview article.hazardous[b-1g9s4twg9t],
.review-score-preview article.critical[b-1g9s4twg9t] {
    border-top:4px solid #b54d43;
}

.review-score-preview article.medium[b-1g9s4twg9t] {
    border-top:4px solid #987634;
}

.review-score-preview article.low[b-1g9s4twg9t] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-1g9s4twg9t] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-1g9s4twg9t] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-1g9s4twg9t] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.25rem;
}

.education-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card[b-1g9s4twg9t] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.medium[b-1g9s4twg9t],
.vaccine-card.watch[b-1g9s4twg9t] {
    border-left-color:#987634;
}

.vaccine-card.high[b-1g9s4twg9t],
.vaccine-card.diseased[b-1g9s4twg9t] {
    border-left-color:#c56b2a;
}

.vaccine-card.critical[b-1g9s4twg9t],
.vaccine-card.hazardous[b-1g9s4twg9t] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-1g9s4twg9t] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-1g9s4twg9t],
    .source-photo-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .institution-type-overview[b-1g9s4twg9t],
    .amount-metrics[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .progress-photo-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-1g9s4twg9t],
    .coordinate-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .coordinate-pin[b-1g9s4twg9t] {
        margin:0 auto;
    }

    .education-map-board[b-1g9s4twg9t] {
        min-height:500px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .education-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.72;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.full > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.maintenance > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.review > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.temp-closed > span[b-1g9s4twg9t] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-1g9s4twg9t]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-1g9s4twg9t],
.institution-type-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-1g9s4twg9t] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-1g9s4twg9t] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-1g9s4twg9t] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-1g9s4twg9t] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-1g9s4twg9t] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-1g9s4twg9t] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-1g9s4twg9t] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-1g9s4twg9t] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.pet-metric-grid article.attendance > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.pet-metric-grid article.health > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.pet-metric-grid article.assessment > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.pet-metric-grid article.green > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-1g9s4twg9t] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-1g9s4twg9t] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-1g9s4twg9t] { background:var(--theme-primary); }
.education-map-pin.full[b-1g9s4twg9t] { background:#987634; }
.education-map-pin.maintenance[b-1g9s4twg9t] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-1g9s4twg9t] { background:#73569b; }
.education-map-pin.temp-closed[b-1g9s4twg9t],
.education-map-pin.inactive[b-1g9s4twg9t] { background:#b54d43; }

.education-map-pin span[b-1g9s4twg9t] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-1g9s4twg9t] { background:var(--theme-primary); }
.map-board-legend i.full[b-1g9s4twg9t] { background:#987634; }
.map-board-legend i.maintenance[b-1g9s4twg9t] { background:#c56b2a; }
.map-board-legend i.review[b-1g9s4twg9t] { background:#73569b; }
.map-board-legend i.closed[b-1g9s4twg9t] { background:#b54d43; }

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-1g9s4twg9t],
.latest-progress-cell[b-1g9s4twg9t],
.assessment-date-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-1g9s4twg9t],
.institution-status-chip[b-1g9s4twg9t],
.accreditation-chip[b-1g9s4twg9t],
.assessment-result-chip[b-1g9s4twg9t],
.no-progress-chip[b-1g9s4twg9t],
.overdue-chip[b-1g9s4twg9t],
.due-chip[b-1g9s4twg9t],
.green-link-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-1g9s4twg9t],
.assessment-result-chip.passed[b-1g9s4twg9t],
.assessment-result-chip.excellent[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-1g9s4twg9t],
.assessment-result-chip.conditional[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-1g9s4twg9t],
.assessment-result-chip.review[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-1g9s4twg9t],
.accreditation-chip.not-assessed[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-1g9s4twg9t],
.latest-progress-cell small[b-1g9s4twg9t],
.assessment-date-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.latest-progress-cell strong[b-1g9s4twg9t],
.assessment-date-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.occupancy-track[b-1g9s4twg9t] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.personnel-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.personnel-cell strong[b-1g9s4twg9t] {
    color:var(--theme-primary);
}

.personnel-cell em[b-1g9s4twg9t] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.90rem;
    font-style:normal;
}

.row-action.assess[b-1g9s4twg9t] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-1g9s4twg9t] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-1g9s4twg9t],
.capacity-preview strong[b-1g9s4twg9t] {
    display:block;
}

.capacity-preview small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.capacity-preview strong[b-1g9s4twg9t] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-1g9s4twg9t] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.vaccine-form-modal[b-1g9s4twg9t] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.excellent[b-1g9s4twg9t],
.review-score-preview article.passed[b-1g9s4twg9t] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.conditional[b-1g9s4twg9t] {
    border-top:4px solid #987634;
}

.review-score-preview article.review[b-1g9s4twg9t] {
    border-top:4px solid #b54d43;
}

.vaccine-card.excellent[b-1g9s4twg9t],
.vaccine-card.passed[b-1g9s4twg9t] {
    border-left-color:var(--theme-primary);
}

.vaccine-card.conditional[b-1g9s4twg9t] {
    border-left-color:#987634;
}

.vaccine-card.review[b-1g9s4twg9t] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-1g9s4twg9t] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-1g9s4twg9t] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-1g9s4twg9t] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.25rem;
}

.education-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-1g9s4twg9t] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-1g9s4twg9t] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.04rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-1g9s4twg9t],
    .source-photo-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .institution-type-overview[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .progress-photo-grid[b-1g9s4twg9t],
    .capacity-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .education-map-board[b-1g9s4twg9t] {
        min-height:500px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .education-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.74;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-1g9s4twg9t] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.new > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.watch > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.transferred > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.graduated > span[b-1g9s4twg9t] { background:#73569b; }

.pet-metric-grid article.new > span[b-1g9s4twg9t] {
    color:#c56b2a;
    background:#fff0df;
}

.pet-metric-grid article.health > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.pet-metric-grid article.scholarship > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.pet-metric-grid article.photo > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-1g9s4twg9t],
.latest-progress-cell[b-1g9s4twg9t],
.care-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-1g9s4twg9t],
.student-status-chip[b-1g9s4twg9t],
.health-chip[b-1g9s4twg9t],
.special-care-chip[b-1g9s4twg9t],
.scholarship-chip[b-1g9s4twg9t],
.learning-chip[b-1g9s4twg9t],
.no-progress-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.school-chip[b-1g9s4twg9t] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.health-chip.referred[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-1g9s4twg9t],
.learning-chip.good[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-1g9s4twg9t],
.latest-progress-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-1g9s4twg9t],
.latest-progress-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.progress-track[b-1g9s4twg9t] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-1g9s4twg9t] { background:var(--theme-primary); }
.progress-track i.watch[b-1g9s4twg9t] { background:#987634; }
.progress-track i.risk[b-1g9s4twg9t] { background:#b54d43; }

.teacher-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-1g9s4twg9t],
.teacher-cell small[b-1g9s4twg9t] {
    display:block;
}

.teacher-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.progress[b-1g9s4twg9t] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-1g9s4twg9t] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-1g9s4twg9t] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-1g9s4twg9t] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.vaccine-form-modal[b-1g9s4twg9t] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.review-score-preview article[b-1g9s4twg9t] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.watch[b-1g9s4twg9t],
.review-score-preview article.pass[b-1g9s4twg9t] {
    border-top-color:#987634;
}

.review-score-preview article.risk[b-1g9s4twg9t],
.review-score-preview article.support[b-1g9s4twg9t] {
    border-top-color:#b54d43;
}

.review-score-preview small[b-1g9s4twg9t],
.review-score-preview strong[b-1g9s4twg9t],
.review-score-preview span[b-1g9s4twg9t] {
    display:block;
}

.review-score-preview small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-1g9s4twg9t] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.review-score-preview span[b-1g9s4twg9t] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-1g9s4twg9t] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.pass[b-1g9s4twg9t] {
    border-left-color:#2f789f;
}

.vaccine-card.support[b-1g9s4twg9t] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.pet-document-photo[b-1g9s4twg9t] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.05rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .progress-photo-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .pet-form-modal[b-1g9s4twg9t],
    .vaccine-form-modal[b-1g9s4twg9t],
    .pet-view-modal[b-1g9s4twg9t] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   SCHOLARSHIP MANAGEMENT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.75;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.applications[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.approved[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.paid[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.balance[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.submitted > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.under-review > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.waiting-payment > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.partial > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.paid > span[b-1g9s4twg9t] { background:var(--theme-primary); }

.pet-metric-grid article.review > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.pet-metric-grid article.waiting > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.pet-metric-grid article.partial > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.pet-metric-grid article.average > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.application-program-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:180px;
    flex-direction:column;
    gap:7px;
}

.application-program-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.99rem;
}

.application-program-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.scholarship-type-chip[b-1g9s4twg9t],
.scholarship-status-chip[b-1g9s4twg9t],
.priority-chip[b-1g9s4twg9t],
.special-care-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.scholarship-type-chip.need[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-type-chip.merit[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.scholarship-type-chip.disability[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.scholarship-type-chip.sport[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.scholarship-type-chip.culture[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.scholarship-type-chip.emergency[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.scholarship-status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.scholarship-status-chip.submitted[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.scholarship-status-chip.under-review[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.scholarship-status-chip.approved[b-1g9s4twg9t],
.scholarship-status-chip.paid[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-status-chip.waiting-payment[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.scholarship-status-chip.partial[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.scholarship-status-chip.rejected[b-1g9s4twg9t],
.scholarship-status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.special-care-chip[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.eligibility-cell[b-1g9s4twg9t],
.amount-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:205px;
}

.eligibility-cell span[b-1g9s4twg9t],
.amount-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:39px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.eligibility-cell strong[b-1g9s4twg9t],
.amount-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.eligibility-cell em[b-1g9s4twg9t] {
    grid-column:1 / -1;
}

.amount-cell span:nth-child(3)[b-1g9s4twg9t] {
    grid-column:1 / -1;
    color:#987634;
    background:#fffaf0;
}

.payment-progress-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:9px;
}

.payment-progress-cell > div:first-child[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.payment-progress-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-progress-cell span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.payment-track[b-1g9s4twg9t] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.payment-track i[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.payment-progress-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

.officer-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-1g9s4twg9t],
.officer-cell small[b-1g9s4twg9t] {
    display:block;
}

.officer-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.officer-cell small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.review[b-1g9s4twg9t] {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-action.pay[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* APPLICATION FORM */

.linked-student-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-student-preview > button[b-1g9s4twg9t] {
    height:190px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:20px;
    cursor:zoom-in;
}

.linked-student-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-student-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-student-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.linked-student-preview p[b-1g9s4twg9t] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.93rem;
}

.linked-student-preview > div > div[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-student-preview > div > div span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.document-upload-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.document-upload-card[b-1g9s4twg9t] {
    overflow:hidden;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.document-upload-heading[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-1g9s4twg9t] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.document-upload-heading strong[b-1g9s4twg9t],
.document-upload-heading small[b-1g9s4twg9t] {
    display:block;
}

.document-upload-heading strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.document-upload-heading small[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-1g9s4twg9t] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-1g9s4twg9t] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty .mud-icon-root[b-1g9s4twg9t] {
    font-size:2rem;
}

.document-empty strong[b-1g9s4twg9t] {
    font-size:.91rem;
}

.document-empty small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.officer-grid[b-1g9s4twg9t] {
    margin-top:10px;
}

.privacy-warning[b-1g9s4twg9t] {
    margin-top:20px;
    font-size:.96rem !important;
}

/* REVIEW */

.vaccine-form-modal[b-1g9s4twg9t],
.attendance-form-modal[b-1g9s4twg9t] {
    width:min(1120px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-source-summary[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.review-source-summary > div[b-1g9s4twg9t] {
    min-height:105px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.review-student[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.review-student img[b-1g9s4twg9t] {
    width:78px;
    height:78px;
    border-radius:19px;
    object-fit:cover;
}

.review-source-summary small[b-1g9s4twg9t],
.review-source-summary strong[b-1g9s4twg9t],
.review-source-summary span[b-1g9s4twg9t] {
    display:block;
}

.review-source-summary small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.review-source-summary strong[b-1g9s4twg9t] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1rem;
}

.review-source-summary span[b-1g9s4twg9t] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-score-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.review-score-preview article[b-1g9s4twg9t] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.conditional[b-1g9s4twg9t],
.review-score-preview article.requested[b-1g9s4twg9t] {
    border-top-color:#987634;
}

.review-score-preview article.review[b-1g9s4twg9t] {
    border-top-color:#b54d43;
}

.review-score-preview article.approved[b-1g9s4twg9t] {
    border-top-color:#73569b;
}

.review-score-preview small[b-1g9s4twg9t],
.review-score-preview strong[b-1g9s4twg9t],
.review-score-preview span[b-1g9s4twg9t] {
    display:block;
}

.review-score-preview small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-1g9s4twg9t] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.34rem;
}

.review-score-preview span[b-1g9s4twg9t] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-document-card[b-1g9s4twg9t],
.payment-document-card[b-1g9s4twg9t] {
    max-width:520px;
    margin:18px auto 0;
}

.review-save-button[b-1g9s4twg9t] {
    background:linear-gradient(135deg,#73569b,#584078) !important;
    color:#fff !important;
}

/* PAYMENT */

.payment-summary-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.payment-summary-grid article[b-1g9s4twg9t] {
    min-height:105px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.payment-summary-grid small[b-1g9s4twg9t],
.payment-summary-grid strong[b-1g9s4twg9t],
.payment-summary-grid span[b-1g9s4twg9t] {
    display:block;
}

.payment-summary-grid small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.payment-summary-grid strong[b-1g9s4twg9t] {
    margin-top:6px;
    color:var(--theme-primary);
    font-size:1.30rem;
}

.payment-summary-grid span[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.payment-save-button[b-1g9s4twg9t] {
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
    color:#fff !important;
}

/* VIEW */

.scholarship-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.scholarship-cover-photo[b-1g9s4twg9t] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.scholarship-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.scholarship-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.scholarship-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.40rem;
}

.scholarship-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.94rem;
}

.scholarship-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.scholarship-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.scholarship-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.scholarship-emblem.submitted[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.scholarship-emblem.under-review[b-1g9s4twg9t] { color:#73569b; border-color:#e8def4; }
.scholarship-emblem.waiting-payment[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.scholarship-emblem.partial[b-1g9s4twg9t] { color:#2f789f; border-color:#d8eaf2; }
.scholarship-emblem.rejected[b-1g9s4twg9t],
.scholarship-emblem.cancelled[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }

.scholarship-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.3rem;
}

.scholarship-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.scholarship-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.pet-document-photo[b-1g9s4twg9t] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.view-attendance-button[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    gap:12px;
    padding:15px;
    border-left:5px solid var(--theme-primary);
    border-radius:13px;
    background:#f7fbf8;
}

.vaccine-card > span[b-1g9s4twg9t] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.vaccine-card > div > div[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.vaccine-card strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1rem;
}

.vaccine-card small[b-1g9s4twg9t],
.vaccine-card p[b-1g9s4twg9t],
.vaccine-card em[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-1g9s4twg9t] {
    margin:5px 0;
}

.vaccine-card em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.history-empty[b-1g9s4twg9t] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.student > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.application > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.income > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.support > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.approval > span[b-1g9s4twg9t] { background:rgba(52,115,75,.90); }
.attachment-card.payment > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.96rem !important;
    line-height:1.74 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:67px;
    color:#26463c;
    font-size:.98rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.06rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:1.02rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1.04rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:1rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scholarship-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1100px) {
    .document-upload-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-source-summary[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-student-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .scholarship-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .review-source-summary[b-1g9s4twg9t],
    .review-score-preview[b-1g9s4twg9t],
    .payment-summary-grid[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.92rem !important;
    }

    .pet-form-modal[b-1g9s4twg9t],
    .vaccine-form-modal[b-1g9s4twg9t],
    .attendance-form-modal[b-1g9s4twg9t],
    .pet-view-modal[b-1g9s4twg9t] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .scholarship-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   CHILDREN & YOUTH ACTIVITIES โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.76;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.activities[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.participants[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.budget[b-1g9s4twg9t] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.outcome[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.open > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.full > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.ongoing > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.completed > span[b-1g9s4twg9t] { background:#73569b; }
.status-overview-card.postponed > span[b-1g9s4twg9t] { background:#c56b2a; }

/* CATEGORY CARDS */

.category-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.category-overview-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:108px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.category-overview-card[b-1g9s4twg9t]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--category-soft,rgba(10,114,87,.08));
    content:"";
}

.category-overview-card:hover[b-1g9s4twg9t],
.category-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.category-overview-card > span[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--category-color);
    background:var(--category-soft);
}

.category-overview-card > div[b-1g9s4twg9t] {
    position:relative;
    z-index:2;
}

.category-overview-card small[b-1g9s4twg9t],
.category-overview-card strong[b-1g9s4twg9t],
.category-overview-card em[b-1g9s4twg9t] {
    display:block;
}

.category-overview-card small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.category-overview-card strong[b-1g9s4twg9t] {
    margin-top:5px;
    color:var(--category-color);
    font-size:1.25rem;
    font-weight:850;
}

.category-overview-card em[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.category-overview-card.learning[b-1g9s4twg9t] {
    --category-color:var(--theme-primary);
    --category-soft:rgba(10,114,87,.13);
}

.category-overview-card.sport[b-1g9s4twg9t] {
    --category-color:#2f789f;
    --category-soft:rgba(47,120,159,.13);
}

.category-overview-card.art[b-1g9s4twg9t] {
    --category-color:#b3678a;
    --category-soft:rgba(179,103,138,.13);
}

.category-overview-card.environment[b-1g9s4twg9t] {
    --category-color:#39794f;
    --category-soft:rgba(57,121,79,.13);
}

.category-overview-card.volunteer[b-1g9s4twg9t] {
    --category-color:#c56b2a;
    --category-soft:rgba(197,107,42,.13);
}

.category-overview-card.digital[b-1g9s4twg9t] {
    --category-color:#73569b;
    --category-soft:rgba(115,86,155,.13);
}

/* METRICS */

.pet-metric-grid article.upcoming > span[b-1g9s4twg9t] {
    color:#c56b2a;
    background:#fff0df;
}

.pet-metric-grid article.full > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.pet-metric-grid article.ongoing > span[b-1g9s4twg9t] {
    color:#2f789f;
    background:#e8f3f8;
}

.pet-metric-grid article.photo > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:102px minmax(0,1fr);
    min-width:380px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:102px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.03rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.schedule-location-cell[b-1g9s4twg9t],
.registration-cell[b-1g9s4twg9t],
.payment-progress-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:8px;
}

.schedule-location-cell > span[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.91rem;
    font-weight:800;
}

.schedule-location-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.schedule-location-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.54;
}

.registration-cell > div:first-child[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.registration-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1rem;
}

.registration-cell span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.registration-track[b-1g9s4twg9t] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.registration-track i[b-1g9s4twg9t] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.registration-track i.available[b-1g9s4twg9t] { background:var(--theme-primary); }
.registration-track i.near-full[b-1g9s4twg9t] { background:#987634; }
.registration-track i.full[b-1g9s4twg9t] { background:#b54d43; }

.registration-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.budget-cell[b-1g9s4twg9t],
.outcome-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:215px;
}

.budget-cell span[b-1g9s4twg9t],
.outcome-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:40px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.budget-cell strong[b-1g9s4twg9t],
.outcome-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.budget-cell small[b-1g9s4twg9t],
.outcome-cell small[b-1g9s4twg9t] {
    grid-column:1 / -1;
    color:#71837a;
    font-size:.90rem;
}

.no-outcome-chip[b-1g9s4twg9t],
.activity-status-chip[b-1g9s4twg9t],
.priority-chip[b-1g9s4twg9t],
.category-chip[b-1g9s4twg9t],
.attendance-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.no-outcome-chip[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.activity-status-chip.draft[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.activity-status-chip.open[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.activity-status-chip.full[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.activity-status-chip.ongoing[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.activity-status-chip.completed[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.activity-status-chip.postponed[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.activity-status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.category-chip.learning[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.category-chip.sport[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.category-chip.art[b-1g9s4twg9t] { color:#b3678a; background:#faedf3; }
.category-chip.music[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.category-chip.environment[b-1g9s4twg9t] { color:#39794f; background:#eaf5ed; }
.category-chip.volunteer[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.category-chip.digital[b-1g9s4twg9t] { color:#356b9b; background:#e8f1f8; }
.category-chip.health[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.category-chip.culture[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.category-chip.career[b-1g9s4twg9t] { color:#4d7c68; background:#eaf3ef; }

.officer-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:215px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-1g9s4twg9t],
.officer-cell small[b-1g9s4twg9t] {
    display:block;
}

.officer-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.register[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

.row-action.attendance[b-1g9s4twg9t] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.complete[b-1g9s4twg9t] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM PREVIEW */

.activity-preview-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:17px 0 24px;
}

.activity-preview-grid article[b-1g9s4twg9t] {
    min-height:104px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.activity-preview-grid small[b-1g9s4twg9t],
.activity-preview-grid strong[b-1g9s4twg9t],
.activity-preview-grid span[b-1g9s4twg9t] {
    display:block;
}

.activity-preview-grid small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.activity-preview-grid strong[b-1g9s4twg9t] {
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.32rem;
}

.activity-preview-grid span[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

/* UPLOAD */

.activity-upload-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:13px;
    margin-bottom:20px;
}

.activity-upload-card[b-1g9s4twg9t] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.activity-upload-heading[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.activity-upload-heading > span[b-1g9s4twg9t] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.activity-upload-heading strong[b-1g9s4twg9t],
.activity-upload-heading small[b-1g9s4twg9t] {
    display:block;
}

.activity-upload-heading strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.activity-upload-heading small[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.activity-upload-preview[b-1g9s4twg9t] {
    height:165px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.activity-upload-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-upload-empty[b-1g9s4twg9t] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.activity-upload-empty .mud-icon-root[b-1g9s4twg9t] {
    font-size:2rem;
}

.activity-upload-empty strong[b-1g9s4twg9t],
.activity-upload-empty small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.privacy-warning[b-1g9s4twg9t] {
    margin-top:20px;
    font-size:.98rem !important;
}

/* PARTICIPANT */

.vaccine-form-modal[b-1g9s4twg9t],
.attendance-form-modal[b-1g9s4twg9t],
.completion-form-modal[b-1g9s4twg9t] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.participant-activity-summary[b-1g9s4twg9t],
.completion-summary-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.participant-activity-summary > div[b-1g9s4twg9t],
.completion-summary-grid article[b-1g9s4twg9t] {
    min-height:102px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.participant-activity-summary small[b-1g9s4twg9t],
.participant-activity-summary strong[b-1g9s4twg9t],
.completion-summary-grid small[b-1g9s4twg9t],
.completion-summary-grid strong[b-1g9s4twg9t],
.completion-summary-grid span[b-1g9s4twg9t] {
    display:block;
}

.participant-activity-summary small[b-1g9s4twg9t],
.completion-summary-grid small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.participant-activity-summary strong[b-1g9s4twg9t],
.completion-summary-grid strong[b-1g9s4twg9t] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.04rem;
}

.completion-summary-grid span[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.linked-participant-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:155px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:15px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-participant-preview > img[b-1g9s4twg9t] {
    width:155px;
    height:155px;
    border-radius:22px;
    object-fit:cover;
}

.linked-participant-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-participant-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.25rem;
}

.linked-participant-preview p[b-1g9s4twg9t] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-participant-preview > div > div[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-participant-preview > div > div span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.linked-participant-preview .special-care-note[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

.consent-warning[b-1g9s4twg9t] {
    margin-top:18px;
    font-size:.96rem !important;
}

.register-save-button[b-1g9s4twg9t] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

/* ATTENDANCE */

.attendance-toolbar[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:15px;
    padding:14px 16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.attendance-toolbar strong[b-1g9s4twg9t],
.attendance-toolbar span[b-1g9s4twg9t] {
    display:block;
}

.attendance-toolbar strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:1.04rem;
}

.attendance-toolbar span[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
    font-size:.91rem;
}

.attendance-toolbar > div:last-child[b-1g9s4twg9t] {
    display:flex;
    gap:8px;
}

.attendance-toolbar button[b-1g9s4twg9t] {
    min-height:40px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.20);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.attendance-register-list[b-1g9s4twg9t] {
    display:flex;
    max-height:55vh;
    overflow:auto;
    flex-direction:column;
    gap:10px;
    padding-right:5px;
}

.attendance-row[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:64px minmax(180px,1fr) 180px 155px minmax(180px,1fr);
    align-items:center;
    gap:11px;
    padding:12px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:15px;
    background:#fff;
}

.attendance-row.attended[b-1g9s4twg9t] { border-left-color:var(--theme-primary); }
.attendance-row.late[b-1g9s4twg9t] { border-left-color:#987634; }
.attendance-row.absent[b-1g9s4twg9t] { border-left-color:#b54d43; }

.attendance-row > img[b-1g9s4twg9t] {
    width:64px;
    height:64px;
    border-radius:17px;
    object-fit:cover;
}

.attendance-person strong[b-1g9s4twg9t],
.attendance-person small[b-1g9s4twg9t] {
    display:block;
}

.attendance-person strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.attendance-person small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-recorder[b-1g9s4twg9t] {
    margin-top:16px !important;
}

.attendance-save-button[b-1g9s4twg9t] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#225c7a) !important;
}

/* COMPLETION */

.completion-score-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.completion-score-grid article[b-1g9s4twg9t] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.completion-score-grid article.watch[b-1g9s4twg9t] {
    border-top-color:#987634;
}

.completion-score-grid article.risk[b-1g9s4twg9t] {
    border-top-color:#b54d43;
}

.completion-score-grid small[b-1g9s4twg9t],
.completion-score-grid strong[b-1g9s4twg9t],
.completion-score-grid span[b-1g9s4twg9t] {
    display:block;
}

.completion-score-grid small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.completion-score-grid strong[b-1g9s4twg9t] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.35rem;
}

.completion-score-grid span[b-1g9s4twg9t] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.completion-photo-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.completion-save-button[b-1g9s4twg9t] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.activity-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.activity-cover-photo[b-1g9s4twg9t] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.activity-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.activity-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.activity-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.96rem;
    line-height:1.7;
}

.activity-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.activity-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.activity-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.activity-emblem.full[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.activity-emblem.ongoing[b-1g9s4twg9t] { color:#2f789f; border-color:#d8eaf2; }
.activity-emblem.completed[b-1g9s4twg9t] { color:#73569b; border-color:#e8def4; }
.activity-emblem.postponed[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.activity-emblem.cancelled[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }

.activity-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.3rem;
}

.activity-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.activity-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.pet-document-photo[b-1g9s4twg9t] {
    width:128px;
    height:96px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:22px;
    background:#e7f5ef;
}

.pet-document-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.view-attendance-button[b-1g9s4twg9t] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-complete-button[b-1g9s4twg9t] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.result-score-strip[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

.result-score-strip article[b-1g9s4twg9t] {
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.result-score-strip small[b-1g9s4twg9t],
.result-score-strip strong[b-1g9s4twg9t] {
    display:block;
}

.result-score-strip small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.result-score-strip strong[b-1g9s4twg9t] {
    margin-top:5px;
    color:var(--theme-primary);
    font-size:1.16rem;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    gap:12px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card.attended[b-1g9s4twg9t] { border-left-color:var(--theme-primary); }
.vaccine-card.late[b-1g9s4twg9t] { border-left-color:#987634; }
.vaccine-card.absent[b-1g9s4twg9t] { border-left-color:#b54d43; }

.vaccine-card > img[b-1g9s4twg9t] {
    width:70px;
    height:70px;
    border-radius:18px;
    object-fit:cover;
}

.vaccine-card > div > div[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-card p[b-1g9s4twg9t],
.vaccine-card em[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-1g9s4twg9t] {
    margin:5px 0;
}

.vaccine-card em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.attendance-chip.attended[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.attendance-chip.late[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.attendance-chip.absent[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.attendance-chip.not-recorded[b-1g9s4twg9t] {
    color:#687872;
    background:#edf1ef;
}

.history-empty[b-1g9s4twg9t] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.cover > span[b-1g9s4twg9t] { background:rgba(10,114,87,.90); }
.attachment-card.venue > span[b-1g9s4twg9t] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }
.attachment-card.schedule > span[b-1g9s4twg9t] { background:rgba(152,118,52,.90); }
.attachment-card.safety > span[b-1g9s4twg9t] { background:rgba(181,77,67,.90); }
.attachment-card.result > span[b-1g9s4twg9t] { background:rgba(57,121,79,.90); }
.attachment-card.report > span[b-1g9s4twg9t] { background:rgba(115,86,155,.90); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.75 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.07rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1650px) {
    .category-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-upload-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width:1500px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .activity-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1150px) {
    .activity-upload-grid[b-1g9s4twg9t],
    .vaccine-card-list[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attendance-row[b-1g9s4twg9t] {
        grid-template-columns:60px minmax(180px,1fr) 170px;
    }

    .attendance-time-field[b-1g9s4twg9t],
    .attendance-note-field[b-1g9s4twg9t] {
        grid-column:auto / span 1;
    }

    .activity-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .activity-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .category-overview[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .activity-preview-grid[b-1g9s4twg9t],
    .participant-activity-summary[b-1g9s4twg9t],
    .completion-summary-grid[b-1g9s4twg9t],
    .completion-score-grid[b-1g9s4twg9t],
    .completion-photo-grid[b-1g9s4twg9t],
    .activity-upload-grid[b-1g9s4twg9t],
    .vaccine-card-list[b-1g9s4twg9t],
    .result-score-strip[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview > img[b-1g9s4twg9t] {
        width:100%;
        height:240px;
    }

    .attendance-toolbar[b-1g9s4twg9t] {
        align-items:flex-start;
        flex-direction:column;
    }

    .attendance-row[b-1g9s4twg9t] {
        grid-template-columns:58px minmax(0,1fr);
    }

    .attendance-status-select[b-1g9s4twg9t],
    .attendance-time-field[b-1g9s4twg9t],
    .attendance-note-field[b-1g9s4twg9t] {
        grid-column:1 / -1;
    }

    .activity-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-cover-photo[b-1g9s4twg9t] {
        height:250px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .pet-form-modal[b-1g9s4twg9t],
    .vaccine-form-modal[b-1g9s4twg9t],
    .attendance-form-modal[b-1g9s4twg9t],
    .completion-form-modal[b-1g9s4twg9t],
    .pet-view-modal[b-1g9s4twg9t] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .activity-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}


/* =========================================================
   PET REGISTRATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.pet-page[b-1g9s4twg9t] {
    font-size:17px;
    line-height:1.76;
}

.pet-hero[b-1g9s4twg9t] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.total[b-1g9s4twg9t] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.dog[b-1g9s4twg9t] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.summary-card.vaccine[b-1g9s4twg9t] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.chip[b-1g9s4twg9t] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-1g9s4twg9t] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.pending > span[b-1g9s4twg9t] { background:#987634; }
.status-overview-card.active > span[b-1g9s4twg9t] { background:var(--theme-primary); }
.status-overview-card.transferred > span[b-1g9s4twg9t] { background:#2f789f; }
.status-overview-card.lost > span[b-1g9s4twg9t] { background:#c56b2a; }
.status-overview-card.deceased > span[b-1g9s4twg9t] { background:#687872; }

.species-overview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:15px 0 0;
}

.species-overview-card[b-1g9s4twg9t] {
    position:relative;
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    min-height:118px;
    overflow:hidden;
    align-items:center;
    gap:14px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 12px 28px rgba(5,62,46,.06);
    transition:.18s ease;
}

.species-overview-card:hover[b-1g9s4twg9t],
.species-overview-card.selected[b-1g9s4twg9t] {
    transform:translateY(-3px);
    border-color:var(--species-color);
    box-shadow:0 18px 38px rgba(5,62,46,.13);
}

.species-overview-card > span[b-1g9s4twg9t] {
    display:grid;
    width:68px;
    height:68px;
    place-items:center;
    border-radius:19px;
    color:var(--species-color);
    background:var(--species-soft);
}

.species-overview-card small[b-1g9s4twg9t],
.species-overview-card strong[b-1g9s4twg9t],
.species-overview-card em[b-1g9s4twg9t] {
    display:block;
}

.species-overview-card small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.92rem;
    font-weight:700;
}

.species-overview-card strong[b-1g9s4twg9t] {
    margin-top:4px;
    color:var(--species-color);
    font-size:1.42rem;
    font-weight:850;
}

.species-overview-card em[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.species-overview-card.dog[b-1g9s4twg9t] {
    --species-color:#c56b2a;
    --species-soft:#fff0df;
}

.species-overview-card.cat[b-1g9s4twg9t] {
    --species-color:#73569b;
    --species-soft:#f0eafb;
}

.species-overview-card.other[b-1g9s4twg9t] {
    --species-color:#2f789f;
    --species-soft:#e8f3f8;
}

.pet-metric-grid article.due > span[b-1g9s4twg9t] {
    color:#987634;
    background:#fff4df;
}

.pet-metric-grid article.overdue > span[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.pet-metric-grid article.neutered > span[b-1g9s4twg9t] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.pet-metric-grid article.photo > span[b-1g9s4twg9t] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:94px minmax(0,1fr);
    min-width:360px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-1g9s4twg9t] {
    width:94px;
    height:94px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:25px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-1g9s4twg9t] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
    font-weight:850;
    line-height:1.55;
}

.pet-photo-cell small[b-1g9s4twg9t],
.pet-photo-cell em[b-1g9s4twg9t] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.pet-photo-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-style:normal;
}

.owner-house-cell[b-1g9s4twg9t],
.breed-cell[b-1g9s4twg9t],
.vaccine-cell[b-1g9s4twg9t],
.identity-cell[b-1g9s4twg9t],
.status-cell[b-1g9s4twg9t] {
    display:flex;
    min-width:185px;
    flex-direction:column;
    gap:7px;
}

.owner-house-cell strong[b-1g9s4twg9t],
.breed-cell strong[b-1g9s4twg9t],
.vaccine-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.owner-house-cell span[b-1g9s4twg9t],
.owner-house-cell small[b-1g9s4twg9t],
.owner-house-cell em[b-1g9s4twg9t],
.breed-cell small[b-1g9s4twg9t],
.vaccine-cell small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
    line-height:1.55;
}

.owner-house-cell em[b-1g9s4twg9t] {
    color:var(--theme-primary);
}

.species-chip[b-1g9s4twg9t],
.pet-status-chip[b-1g9s4twg9t],
.vaccine-chip[b-1g9s4twg9t],
.warning-chip[b-1g9s4twg9t] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.species-chip.dog[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.species-chip.cat[b-1g9s4twg9t] { color:#73569b; background:#f0eafb; }
.species-chip.other[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }

.pet-status-chip.pending[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.pet-status-chip.active[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.pet-status-chip.transferred[b-1g9s4twg9t] { color:#2f789f; background:#e8f3f8; }
.pet-status-chip.lost[b-1g9s4twg9t] { color:#c56b2a; background:#fff0df; }
.pet-status-chip.deceased[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }
.pet-status-chip.cancelled[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }

.vaccine-chip.current[b-1g9s4twg9t] { color:var(--theme-primary); background:#e7f5ef; }
.vaccine-chip.due-soon[b-1g9s4twg9t] { color:#987634; background:#fff4df; }
.vaccine-chip.overdue[b-1g9s4twg9t] { color:#b54d43; background:#fff0ee; }
.vaccine-chip.no-data[b-1g9s4twg9t] { color:#687872; background:#edf1ef; }

.warning-chip[b-1g9s4twg9t] {
    color:#b54d43;
    background:#fff0ee;
}

.identity-cell span[b-1g9s4twg9t] {
    display:flex;
    min-height:38px;
    align-items:center;
    gap:7px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f7fbf8;
    font-size:.90rem;
}

.identity-cell small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
}

.officer-cell[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-1g9s4twg9t] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-1g9s4twg9t],
.officer-cell small[b-1g9s4twg9t] {
    display:block;
}

.officer-cell strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-1g9s4twg9t] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.vaccine[b-1g9s4twg9t] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

/* OWNER PREVIEW */

.linked-owner-preview[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:125px minmax(0,1fr) 220px;
    align-items:center;
    gap:18px;
    margin:15px 0 24px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:19px;
    background:#f1f8f3;
}

.owner-preview-photo[b-1g9s4twg9t] {
    display:grid;
    width:125px;
    height:125px;
    overflow:hidden;
    place-items:center;
    border-radius:24px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.owner-preview-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.owner-preview-photo .mud-icon-root[b-1g9s4twg9t] {
    font-size:3.5rem;
}

.linked-owner-preview small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-owner-preview h3[b-1g9s4twg9t] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.28rem;
}

.linked-owner-preview p[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-owner-preview > div:nth-child(2) > div[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.linked-owner-preview > div:nth-child(2) > div span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.house-preview-photo[b-1g9s4twg9t] {
    height:135px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:18px;
    cursor:zoom-in;
}

.house-preview-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* UPLOAD */

.pet-upload-grid[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.pet-upload-card[b-1g9s4twg9t] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.pet-upload-heading[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.pet-upload-heading > span[b-1g9s4twg9t] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.pet-upload-heading strong[b-1g9s4twg9t],
.pet-upload-heading small[b-1g9s4twg9t] {
    display:block;
}

.pet-upload-heading strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.pet-upload-heading small[b-1g9s4twg9t] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.pet-upload-preview[b-1g9s4twg9t] {
    height:175px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.pet-upload-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-upload-empty[b-1g9s4twg9t] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.pet-upload-empty strong[b-1g9s4twg9t],
.pet-upload-empty small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.privacy-warning[b-1g9s4twg9t] {
    margin-top:19px;
    font-size:.98rem !important;
}

/* VACCINE FORM */

.vaccine-form-modal[b-1g9s4twg9t] {
    width:min(1080px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.vaccine-pet-summary[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:110px 1.3fr 1fr 1fr;
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.vaccine-pet-summary > img[b-1g9s4twg9t] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.vaccine-pet-summary small[b-1g9s4twg9t],
.vaccine-pet-summary strong[b-1g9s4twg9t],
.vaccine-pet-summary span[b-1g9s4twg9t] {
    display:block;
}

.vaccine-pet-summary small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-pet-summary strong[b-1g9s4twg9t] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.vaccine-pet-summary span[b-1g9s4twg9t] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-upload-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 250px 150px;
    align-items:center;
    gap:13px;
    max-width:760px;
    margin:20px auto 0;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
}

.vaccine-upload-card > div:first-child[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
}

.vaccine-upload-card > div:first-child > span[b-1g9s4twg9t] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-upload-card strong[b-1g9s4twg9t],
.vaccine-upload-card small[b-1g9s4twg9t] {
    display:block;
}

.vaccine-upload-card strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-upload-card small[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-upload-preview[b-1g9s4twg9t] {
    display:grid;
    height:130px;
    overflow:hidden;
    place-items:center;
    border-radius:14px;
    color:#71837a;
    background:var(--theme-bg);
}

.vaccine-upload-preview img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.vaccine-save-button[b-1g9s4twg9t] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

/* VIEW */

.pet-cover-panel[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.pet-cover-photo[b-1g9s4twg9t] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.pet-cover-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-cover-content small[b-1g9s4twg9t] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.pet-cover-content h2[b-1g9s4twg9t] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.pet-cover-content p[b-1g9s4twg9t] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.pet-cover-meta[b-1g9s4twg9t] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.pet-cover-meta span[b-1g9s4twg9t] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.pet-emblem[b-1g9s4twg9t] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.pet-emblem.pending[b-1g9s4twg9t] { color:#987634; border-color:#f2e6c9; }
.pet-emblem.transferred[b-1g9s4twg9t] { color:#2f789f; border-color:#d8eaf2; }
.pet-emblem.lost[b-1g9s4twg9t] { color:#c56b2a; border-color:#f8ddc7; }
.pet-emblem.deceased[b-1g9s4twg9t] { color:#687872; border-color:#dfe6e2; }
.pet-emblem.cancelled[b-1g9s4twg9t] { color:#b54d43; border-color:#f4d7d3; }

.pet-emblem .mud-icon-root[b-1g9s4twg9t] {
    font-size:2.4rem;
}

.pet-emblem strong[b-1g9s4twg9t] {
    font-size:1.05rem;
    text-align:center;
}

.pet-emblem small[b-1g9s4twg9t] {
    font-size:.90rem;
}

.pet-document-photo[b-1g9s4twg9t] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-1g9s4twg9t] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-1g9s4twg9t] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.vaccine-history-panel[b-1g9s4twg9t] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-1g9s4twg9t] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px;
    border-left:5px solid #2f789f;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card > span[b-1g9s4twg9t] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:15px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-card > div > div[b-1g9s4twg9t] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-1g9s4twg9t] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.vaccine-card small[b-1g9s4twg9t],
.vaccine-card p[b-1g9s4twg9t],
.vaccine-card em[b-1g9s4twg9t] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-1g9s4twg9t] {
    margin:5px 0;
}

.vaccine-card em[b-1g9s4twg9t] {
    color:#2f789f;
    font-style:normal;
}

.attachment-card.pet > span[b-1g9s4twg9t] { background:rgba(197,107,42,.92); }
.attachment-card.owner > span[b-1g9s4twg9t] { background:rgba(10,114,87,.92); }
.attachment-card.house > span[b-1g9s4twg9t] { background:rgba(77,124,104,.92); }
.attachment-card.vaccine > span[b-1g9s4twg9t] { background:rgba(47,120,159,.92); }
.attachment-card.chip > span[b-1g9s4twg9t] { background:rgba(115,86,155,.92); }
.attachment-card.neuter > span[b-1g9s4twg9t] { background:rgba(57,121,79,.92); }

/* LARGE TEXT */

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.pet-page[b-1g9s4twg9t]  .pet-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.pet-page[b-1g9s4twg9t]  .mud-input,
.pet-page[b-1g9s4twg9t]  .mud-select-input {
    font-size:1.07rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.pet-page[b-1g9s4twg9t]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.pet-page[b-1g9s4twg9t]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-1g9s4twg9t] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .pet-upload-grid[b-1g9s4twg9t] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .pet-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:250px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .linked-owner-preview[b-1g9s4twg9t] {
        grid-template-columns:115px minmax(0,1fr);
    }

    .house-preview-photo[b-1g9s4twg9t] {
        grid-column:1 / -1;
        height:220px;
    }

    .vaccine-pet-summary[b-1g9s4twg9t] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .vaccine-pet-summary > div:last-child[b-1g9s4twg9t] {
        grid-column:2 / -1;
    }

    .vaccine-upload-card[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .pet-emblem[b-1g9s4twg9t] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-1g9s4twg9t],
    .species-overview[b-1g9s4twg9t],
    .follow-grid[b-1g9s4twg9t],
    .pet-metric-grid[b-1g9s4twg9t],
    .reference-grid[b-1g9s4twg9t],
    .measurement-document-grid[b-1g9s4twg9t],
    .pet-upload-grid[b-1g9s4twg9t],
    .vaccine-card-list[b-1g9s4twg9t],
    .vaccine-pet-summary[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-owner-preview[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .owner-preview-photo[b-1g9s4twg9t] {
        width:100%;
        height:230px;
    }

    .pet-cover-panel[b-1g9s4twg9t] {
        grid-template-columns:minmax(0,1fr);
    }

    .pet-cover-photo[b-1g9s4twg9t] {
        height:280px;
    }

    .pet-page[b-1g9s4twg9t]  .pet-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .pet-form-modal[b-1g9s4twg9t],
    .vaccine-form-modal[b-1g9s4twg9t],
    .pet-view-modal[b-1g9s4twg9t] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-profile-print-area[b-1g9s4twg9t],
    #pet-profile-print-area *[b-1g9s4twg9t] {
        visibility:visible !important;
    }

    #pet-profile-print-area[b-1g9s4twg9t] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .pet-view-modal[b-1g9s4twg9t] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-1g9s4twg9t],
    .document-status-strip[b-1g9s4twg9t],
    .pet-cover-panel[b-1g9s4twg9t],
    .document-section[b-1g9s4twg9t],
    .document-footer[b-1g9s4twg9t] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/07Pets/PetVaccinationControl.razor.rz.scp.css */
:root[b-814oxos9lf] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.vaccination-page[b-814oxos9lf] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.vaccination-page[b-814oxos9lf]  .vaccination-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.vaccination-hero[b-814oxos9lf] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-814oxos9lf] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-814oxos9lf] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-814oxos9lf],
.hero-action-panel[b-814oxos9lf] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-814oxos9lf] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-814oxos9lf] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-814oxos9lf] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-814oxos9lf] {
    color: #d8ede6;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-814oxos9lf] {
    margin-top: 3px;
    font-size: .94rem;
}

.vaccination-hero h1[b-814oxos9lf] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.vaccination-hero p[b-814oxos9lf] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-814oxos9lf] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-814oxos9lf] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .90rem;
    font-weight: 650;
}

.hero-action-panel[b-814oxos9lf] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-814oxos9lf] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-814oxos9lf] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-814oxos9lf] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-814oxos9lf] {
    font-size: .90rem;
}

.hero-status small[b-814oxos9lf] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .90rem;
}

.vaccination-page[b-814oxos9lf]  .hero-add-button,
.vaccination-page[b-814oxos9lf]  .toolbar-add-button,
.vaccination-page[b-814oxos9lf]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.vaccination-page[b-814oxos9lf]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-814oxos9lf],
.hero-refresh-button[b-814oxos9lf] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-814oxos9lf] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-814oxos9lf] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-814oxos9lf] {
    opacity: .55;
    cursor: wait;
}

.vaccination-page[b-814oxos9lf]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.vaccination-page[b-814oxos9lf]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-814oxos9lf] {
    margin-top: 2px !important;
}

.summary-card[b-814oxos9lf] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-814oxos9lf] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-814oxos9lf] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-814oxos9lf] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-814oxos9lf] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-814oxos9lf] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-814oxos9lf] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-814oxos9lf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-814oxos9lf] {
    color: #788982;
    font-size: .90rem;
    font-weight: 650;
}

.summary-card p[b-814oxos9lf] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-814oxos9lf] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-814oxos9lf] {
    color: #798a83;
    font-size: .90rem;
}

.summary-card em[b-814oxos9lf] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-814oxos9lf] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-814oxos9lf] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-814oxos9lf],
.status-overview-card.selected[b-814oxos9lf] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-814oxos9lf] {
    background: #f5faf7;
}

.status-overview-card > span[b-814oxos9lf] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-814oxos9lf] { background:#687872; }
.status-overview-card.reviewing > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.difference > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.approved > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.closed > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.voided > span[b-814oxos9lf] { background:#687872; }
.status-overview-card.today > span[b-814oxos9lf] { background:#73569b; }

.status-overview-card div[b-814oxos9lf] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-814oxos9lf] {
    color: var(--theme-muted);
    font-size: .90rem;
}

.status-overview-card strong[b-814oxos9lf] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-814oxos9lf] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-814oxos9lf] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-814oxos9lf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-814oxos9lf] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-814oxos9lf] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-814oxos9lf] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .90rem;
    font-weight: 700;
}

.variance-grid[b-814oxos9lf] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-814oxos9lf] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-814oxos9lf] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-814oxos9lf] {
    display: block;
    color: #3c5047;
    font-size: .90rem;
}

.variance-card small[b-814oxos9lf] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .90rem;
}

.closing-progress[b-814oxos9lf] {
    margin-top: 13px;
}

.progress-track[b-814oxos9lf] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-814oxos9lf] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-814oxos9lf] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-814oxos9lf] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-814oxos9lf] {
    display: block;
    color: #87958f;
    font-size: .90rem;
}

.progress-metrics strong[b-814oxos9lf] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-814oxos9lf],
.vaccination-list-panel[b-814oxos9lf] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-814oxos9lf] {
    padding: 15px;
}

.filter-heading[b-814oxos9lf],
.list-toolbar[b-814oxos9lf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-814oxos9lf],
.panel-kicker[b-814oxos9lf] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-814oxos9lf],
.list-toolbar h2[b-814oxos9lf] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-814oxos9lf],
.list-toolbar p[b-814oxos9lf] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .90rem;
    line-height: 1.65;
}

.clear-filter-button[b-814oxos9lf] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-814oxos9lf] {
    margin-top: 8px !important;
}

.vaccination-page[b-814oxos9lf]  .premium-field,
.vaccination-page[b-814oxos9lf]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.vaccination-page[b-814oxos9lf]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    text-transform: none !important;
}

.filter-summary[b-814oxos9lf] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-814oxos9lf] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .90rem;
}

.filter-summary strong[b-814oxos9lf] {
    color: var(--theme-primary);
}

.vaccination-list-panel[b-814oxos9lf] {
    overflow: hidden;
}

.list-toolbar[b-814oxos9lf] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.vaccination-page[b-814oxos9lf]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-814oxos9lf] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-814oxos9lf] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-814oxos9lf] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-814oxos9lf] {
    margin: 0;
    font-size: .90rem;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table {
    font-family: 'Kanit',sans-serif;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head {
    background: #f1f7f4;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .90rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-814oxos9lf] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-814oxos9lf] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-814oxos9lf] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-814oxos9lf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-814oxos9lf] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .90rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-814oxos9lf] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .90rem;
}

.date-shift-cell[b-814oxos9lf],
.counter-cashier-cell[b-814oxos9lf],
.money-cell[b-814oxos9lf],
.difference-cell[b-814oxos9lf],
.transaction-status-cell[b-814oxos9lf] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-814oxos9lf] {
    min-width: 175px;
}

.date-shift-cell strong[b-814oxos9lf],
.counter-cashier-cell strong[b-814oxos9lf],
.money-cell strong[b-814oxos9lf],
.difference-cell strong[b-814oxos9lf],
.transaction-status-cell strong[b-814oxos9lf] {
    color: #3c5047;
    font-size: .90rem;
    line-height: 1.48;
}

.date-shift-cell small[b-814oxos9lf],
.counter-cashier-cell small[b-814oxos9lf],
.money-cell small[b-814oxos9lf],
.difference-cell small[b-814oxos9lf] {
    margin-top: 3px;
    color: #84928d;
    font-size: .90rem;
}

.date-shift-cell em[b-814oxos9lf],
.counter-cashier-cell em[b-814oxos9lf] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-814oxos9lf] { color:var(--theme-primary); }
.money-cell.actual strong[b-814oxos9lf] { color:#2f789f; }

.difference-cell.matched strong[b-814oxos9lf] { color:#34734b; }
.difference-cell.over strong[b-814oxos9lf] { color:#987634; }
.difference-cell.short strong[b-814oxos9lf] { color:#b54d43; }

.status-chip[b-814oxos9lf],
.match-chip[b-814oxos9lf] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .90rem;
    font-weight: 700;
}

.status-chip i[b-814oxos9lf] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.difference[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-814oxos9lf] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-814oxos9lf] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.vaccination-page[b-814oxos9lf]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.vaccination-page[b-814oxos9lf]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.vaccination-page[b-814oxos9lf]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.vaccination-page[b-814oxos9lf]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.vaccination-page[b-814oxos9lf]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-814oxos9lf] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-814oxos9lf] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .90rem;
}

/* MODALS */

.modal-backdrop[b-814oxos9lf],
.image-preview-backdrop[b-814oxos9lf] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.vaccination-form-modal[b-814oxos9lf],
.vaccination-view-modal[b-814oxos9lf],
.delete-modal[b-814oxos9lf],
.image-preview-modal[b-814oxos9lf] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-814oxos9lf],
.view-toolbar[b-814oxos9lf],
.image-preview-header[b-814oxos9lf] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-814oxos9lf] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-814oxos9lf] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-814oxos9lf],
.view-toolbar small[b-814oxos9lf],
.image-preview-header small[b-814oxos9lf] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-814oxos9lf],
.view-toolbar h2[b-814oxos9lf],
.image-preview-header h3[b-814oxos9lf] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-814oxos9lf] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.modal-body[b-814oxos9lf],
.view-scroll[b-814oxos9lf] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-814oxos9lf] {
    background: #e9efec;
}

.modal-footer[b-814oxos9lf] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.vaccination-page[b-814oxos9lf]  .cancel-button,
.vaccination-page[b-814oxos9lf]  .save-button,
.vaccination-page[b-814oxos9lf]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.form-section-title[b-814oxos9lf] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-814oxos9lf] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-814oxos9lf] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-814oxos9lf] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.form-section-title small[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.open-transactions-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-814oxos9lf] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-814oxos9lf],
.calculation-heading[b-814oxos9lf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-814oxos9lf],
.calculation-heading small[b-814oxos9lf] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-814oxos9lf],
.calculation-heading h3[b-814oxos9lf] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-814oxos9lf],
.calculation-heading > span[b-814oxos9lf] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-814oxos9lf] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-814oxos9lf] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-814oxos9lf] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.source-summary-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.system-amount-grid[b-814oxos9lf] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-814oxos9lf] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-814oxos9lf] {
    display:block;
    color:#84928d;
    font-size:.90rem;
}

.system-amount-card strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.reconciliation-calculation-preview[b-814oxos9lf] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-814oxos9lf] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-814oxos9lf] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-814oxos9lf] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-814oxos9lf] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-814oxos9lf] {
    display:block;
    color:#8b7b74;
    font-size:.90rem;
}

.calculation-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-814oxos9lf] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.90rem;
}

.calculation-grid .short span[b-814oxos9lf],
.calculation-grid .short strong[b-814oxos9lf],
.calculation-grid .short small[b-814oxos9lf] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-814oxos9lf] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-814oxos9lf] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.photo-upload-heading small[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.photo-preview[b-814oxos9lf] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-814oxos9lf] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-814oxos9lf] {
    color:#40544b;
    font-size:.90rem;
}

.photo-empty small[b-814oxos9lf] {
    font-size:.90rem;
}

.photo-upload-actions[b-814oxos9lf] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-814oxos9lf],
.remove-photo-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-814oxos9lf] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-814oxos9lf] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-814oxos9lf] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-814oxos9lf],
.detail-transaction-table[b-814oxos9lf] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-814oxos9lf],
.source-transaction-row[b-814oxos9lf] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-814oxos9lf] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-814oxos9lf],
.source-transaction-row > span[b-814oxos9lf] {
    padding:7px;
    font-size:.90rem;
}

.source-transaction-row[b-814oxos9lf] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-814oxos9lf] {
    border-bottom:0;
}

.mini-photo-button[b-814oxos9lf] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-814oxos9lf],
.source-transaction-more[b-814oxos9lf] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

.mock-rule-warning[b-814oxos9lf] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.90rem !important;
}

/* VIEW & PRINT */

.vaccination-view-modal[b-814oxos9lf] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.vaccination-page[b-814oxos9lf]  .view-edit-button,
.vaccination-page[b-814oxos9lf]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.vaccination-page[b-814oxos9lf]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-health-profile[b-814oxos9lf] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-814oxos9lf] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-814oxos9lf] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-814oxos9lf] {
    text-align:center;
}

.document-organization small[b-814oxos9lf] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-814oxos9lf] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-814oxos9lf] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.90rem;
}

.document-number-box[b-814oxos9lf] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-814oxos9lf],
.document-number-box small[b-814oxos9lf] {
    display:block;
    color:#778980;
    font-size:.90rem;
}

.document-number-box strong[b-814oxos9lf] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
    word-break:break-word;
}

.document-status-strip[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-814oxos9lf] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-814oxos9lf] {
    display:block;
    color:#83918b;
    font-size:.90rem;
}

.document-status-strip > div strong[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.90rem;
}

.scope-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-814oxos9lf] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-814oxos9lf] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
}

.scope-reference-box[b-814oxos9lf] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.scope-reference-box strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.90rem;
}

.scope-reference-box small[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-814oxos9lf],
.transaction-summary-section[b-814oxos9lf],
.source-transaction-section[b-814oxos9lf],
.review-section[b-814oxos9lf] {
    margin-top:16px;
}

.section-title[b-814oxos9lf] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-814oxos9lf] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.90rem;
    font-weight:800;
}

.section-title small[b-814oxos9lf] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-814oxos9lf] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-814oxos9lf] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-814oxos9lf],
.comparison-row[b-814oxos9lf],
.comparison-total[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-814oxos9lf] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-814oxos9lf],
.comparison-row span[b-814oxos9lf],
.comparison-total span[b-814oxos9lf] {
    padding:8px 9px;
    font-size:.90rem;
}

.comparison-row[b-814oxos9lf] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-814oxos9lf],
.comparison-total span:not(:first-child)[b-814oxos9lf] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-814oxos9lf] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-814oxos9lf] { color:#34734b; }
.difference-text.over[b-814oxos9lf] { color:#987634; }
.difference-text.short[b-814oxos9lf] { color:#b54d43; }

.transaction-summary-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-814oxos9lf] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-814oxos9lf] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-814oxos9lf] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-814oxos9lf] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-814oxos9lf] { background:#f4fafc; }

.transaction-summary-grid span[b-814oxos9lf] {
    display:block;
    color:#84928c;
    font-size:.90rem;
}

.transaction-summary-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-814oxos9lf] {
    display:block;
    color:#798a83;
    font-size:.90rem;
}

.detail-transaction-header[b-814oxos9lf],
.detail-transaction-row[b-814oxos9lf] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-814oxos9lf] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-814oxos9lf],
.detail-transaction-row span[b-814oxos9lf] {
    padding:8px 7px;
    font-size:.90rem;
}

.detail-transaction-row[b-814oxos9lf] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-814oxos9lf] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.review-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.review-note-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-814oxos9lf] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
}

.review-note-grid p[b-814oxos9lf] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.document-footer[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.document-footer p[b-814oxos9lf] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.90rem;
    line-height:1.6;
}

.qr-placeholder[b-814oxos9lf] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-814oxos9lf] {
    font-size:.90rem;
    font-weight:700;
}

.mock-document-label[b-814oxos9lf] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.90rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-814oxos9lf],
.attachment-panel[b-814oxos9lf] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-814oxos9lf] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-814oxos9lf] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-814oxos9lf] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:700;
}

.history-list[b-814oxos9lf] {
    display:grid;
    gap:7px;
}

.history-item[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-814oxos9lf] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-814oxos9lf] {
    color:#3c5047;
    font-size:.90rem;
}

.history-item small[b-814oxos9lf],
.history-item em[b-814oxos9lf] {
    color:#84928d;
    font-size:.90rem;
    font-style:normal;
}

.history-item p[b-814oxos9lf] {
    margin:4px 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.55;
}

.attachment-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-814oxos9lf] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-814oxos9lf] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-814oxos9lf] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-814oxos9lf] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-814oxos9lf] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-814oxos9lf] { background:rgba(52,115,75,.89); }

.attachment-empty[b-814oxos9lf] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-814oxos9lf] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-814oxos9lf] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-814oxos9lf] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-814oxos9lf] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-814oxos9lf] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-814oxos9lf] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-814oxos9lf] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.7;
}

.delete-modal p strong[b-814oxos9lf] {
    color:#b54d43;
}

.delete-warning[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.90rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-814oxos9lf] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.vaccination-page[b-814oxos9lf]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-814oxos9lf] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .vaccination-hero[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-814oxos9lf] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-814oxos9lf] {
        grid-column:1 / -1;
    }

    .document-header[b-814oxos9lf] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-814oxos9lf] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .vaccination-page[b-814oxos9lf] {
        padding-top:10px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-container {
        padding-inline:10px !important;
    }

    .vaccination-hero[b-814oxos9lf] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-814oxos9lf],
    .list-toolbar[b-814oxos9lf],
    .source-summary-heading[b-814oxos9lf],
    .calculation-heading[b-814oxos9lf],
    .view-toolbar[b-814oxos9lf],
    .section-heading[b-814oxos9lf] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-814oxos9lf],
    .variance-grid[b-814oxos9lf],
    .progress-metrics[b-814oxos9lf],
    .source-summary-grid[b-814oxos9lf],
    .system-amount-grid[b-814oxos9lf],
    .calculation-grid[b-814oxos9lf],
    .photo-upload-grid[b-814oxos9lf],
    .transaction-summary-grid[b-814oxos9lf],
    .review-grid[b-814oxos9lf],
    .review-note-grid[b-814oxos9lf],
    .attachment-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-814oxos9lf] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-814oxos9lf] {
        width:100%;
    }

    .print-health-profile[b-814oxos9lf] {
        padding:22px 18px;
    }

    .document-footer[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-814oxos9lf] {
        grid-column:auto;
    }

    .status-overview[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-814oxos9lf] {
        width:100%;
    }

    .document-header[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-814oxos9lf] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-814oxos9lf] {
        visibility:hidden !important;
    }

    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-814oxos9lf] {
        display:none !important;
    }

    .modal-backdrop[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf],
    .view-scroll[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .scope-panel[b-814oxos9lf],
    .amount-comparison-section[b-814oxos9lf],
    .transaction-summary-section[b-814oxos9lf],
    .source-transaction-section[b-814oxos9lf],
    .review-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }

    .mock-document-label[b-814oxos9lf] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-814oxos9lf] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.vaccination-page[b-814oxos9lf]  .hero-add-button,
.vaccination-page[b-814oxos9lf]  .toolbar-add-button,
.vaccination-page[b-814oxos9lf]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.confirmed > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.checked-in > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.in-service > span[b-814oxos9lf] { background:#c46a2b; }
.status-overview-card.completed > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.cancelled > span[b-814oxos9lf] { background:#b54d43; }

.service-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-814oxos9lf],
.service-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-814oxos9lf] {
    background:#f4faf7;
}

.service-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-814oxos9lf] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-814oxos9lf] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.service-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-814oxos9lf] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-814oxos9lf] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-814oxos9lf] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.focus-grid small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.90rem;
}

/* TABLE */

.citizen-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-814oxos9lf] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.citizen-photo-cell small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.90rem;
}

.appointment-time-cell[b-814oxos9lf],
.service-unit-cell[b-814oxos9lf],
.provider-location-cell[b-814oxos9lf],
.queue-priority-cell[b-814oxos9lf],
.reason-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-814oxos9lf],
.reason-cell[b-814oxos9lf] {
    min-width:180px;
}

.appointment-time-cell strong[b-814oxos9lf],
.service-unit-cell strong[b-814oxos9lf],
.provider-location-cell strong[b-814oxos9lf],
.queue-priority-cell strong[b-814oxos9lf],
.reason-cell strong[b-814oxos9lf] {
    color:#3c5047;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell small[b-814oxos9lf],
.service-unit-cell small[b-814oxos9lf],
.provider-location-cell small[b-814oxos9lf],
.queue-priority-cell small[b-814oxos9lf],
.reason-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell em[b-814oxos9lf],
.provider-location-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-814oxos9lf],
.priority-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-814oxos9lf] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-814oxos9lf] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-814oxos9lf] { color:#987634; background:#fff4df; }

.priority-chip[b-814oxos9lf] {
    margin-top:5px;
}

.priority-chip.normal[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-814oxos9lf] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-814oxos9lf] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-814oxos9lf] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-814oxos9lf] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-814oxos9lf] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.identity-chip[b-814oxos9lf] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.identity-chip.verified[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-814oxos9lf] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-814oxos9lf],
.identity-chip.not-found[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-814oxos9lf] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.citizen-source-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.citizen-address[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.90rem;
}

.citizen-source-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-814oxos9lf],
.citizen-source-actions a[b-814oxos9lf] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-814oxos9lf] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-814oxos9lf] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-814oxos9lf] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.preview-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.consent-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-814oxos9lf] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-814oxos9lf] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-814oxos9lf] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-814oxos9lf] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-814oxos9lf] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-814oxos9lf] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-814oxos9lf] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-814oxos9lf] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.5;
}

.identity-box[b-814oxos9lf] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-814oxos9lf],
.identity-box small[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.identity-box strong[b-814oxos9lf] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
}

.service-section[b-814oxos9lf],
.reason-section[b-814oxos9lf],
.reminder-section[b-814oxos9lf] {
    margin-top:16px;
}

.reference-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-814oxos9lf] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-814oxos9lf],
.timeline-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.reference-grid strong[b-814oxos9lf],
.timeline-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.note-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-814oxos9lf] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-814oxos9lf] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.note-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.note-grid p[b-814oxos9lf] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.timeline-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-814oxos9lf] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.90rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-814oxos9lf] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-814oxos9lf] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-814oxos9lf],
    .preview-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-814oxos9lf] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-814oxos9lf] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-814oxos9lf] {
        grid-column:1 / -1;
    }

    .reference-grid[b-814oxos9lf],
    .timeline-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-814oxos9lf],
    .focus-grid[b-814oxos9lf],
    .citizen-source-grid[b-814oxos9lf],
    .preview-grid[b-814oxos9lf],
    .consent-grid[b-814oxos9lf],
    .source-photo-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .note-grid[b-814oxos9lf],
    .timeline-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-814oxos9lf] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-814oxos9lf] {
        margin:0 auto;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .service-section[b-814oxos9lf],
    .reason-section[b-814oxos9lf],
    .reminder-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size: 16px;
    line-height: 1.55;
}

.vaccination-page[b-814oxos9lf]  .mud-typography,
.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-input-label,
.vaccination-page[b-814oxos9lf]  .mud-select,
.vaccination-page[b-814oxos9lf]  .mud-list-item-text,
.vaccination-page[b-814oxos9lf]  .mud-button-label,
.vaccination-page[b-814oxos9lf]  .mud-table-cell,
.vaccination-page[b-814oxos9lf]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size: .92rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size: .90rem !important;
    font-weight: 600 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size: .90rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size: .90rem !important;
    font-weight: 700 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .90rem !important;
    line-height: 1.55 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .90rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-814oxos9lf] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-814oxos9lf] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-814oxos9lf] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-814oxos9lf] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-814oxos9lf] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-814oxos9lf] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-814oxos9lf] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-814oxos9lf] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-814oxos9lf],
.vaccination-list-panel[b-814oxos9lf],
.insight-panel[b-814oxos9lf] {
    border-radius: 20px;
}

.filter-panel[b-814oxos9lf] {
    padding: 20px;
}

.list-toolbar[b-814oxos9lf] {
    padding: 19px 20px;
}

.filter-heading p[b-814oxos9lf],
.list-toolbar p[b-814oxos9lf] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-814oxos9lf] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-814oxos9lf] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-814oxos9lf],
.service-unit-cell[b-814oxos9lf],
.provider-location-cell[b-814oxos9lf],
.queue-priority-cell[b-814oxos9lf],
.reason-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    min-width: 155px;
}

.provider-location-cell[b-814oxos9lf],
.reason-cell[b-814oxos9lf] {
    min-width: 215px;
}

.service-chip[b-814oxos9lf],
.priority-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.identity-chip[b-814oxos9lf] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-814oxos9lf] {
    min-width: 205px;
    gap: 7px;
}

.vaccination-page[b-814oxos9lf]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-814oxos9lf] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-814oxos9lf],
.view-toolbar[b-814oxos9lf],
.image-preview-header[b-814oxos9lf] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-814oxos9lf],
.view-scroll[b-814oxos9lf] {
    padding: 20px;
}

.modal-footer[b-814oxos9lf] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-814oxos9lf] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-814oxos9lf] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-814oxos9lf],
.preview-grid > div[b-814oxos9lf],
.reference-grid > div[b-814oxos9lf],
.timeline-grid > div[b-814oxos9lf] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-814oxos9lf] {
    padding: 13px;
}

.photo-preview[b-814oxos9lf] {
    min-height: 200px;
}

.photo-preview img[b-814oxos9lf] {
    height: 200px;
}

.history-item[b-814oxos9lf] {
    padding: 12px;
}

.attachment-card[b-814oxos9lf],
.attachment-card img[b-814oxos9lf] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .vaccination-page[b-814oxos9lf] {
        font-size: 15px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .90rem !important;
    }

    .summary-card[b-814oxos9lf] {
        min-height: 122px;
    }

    .status-overview-card[b-814oxos9lf],
    .service-overview-card[b-814oxos9lf] {
        min-height: 82px;
    }

    .modal-body[b-814oxos9lf],
    .view-scroll[b-814oxos9lf] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #pet-health-print-area[b-814oxos9lf] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #pet-health-print-area h1[b-814oxos9lf] {
        font-size: 18pt !important;
    }

    #pet-health-print-area h2[b-814oxos9lf] {
        font-size: 14pt !important;
    }

    #pet-health-print-area h3[b-814oxos9lf] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.follow-up > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.referred > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.cancelled > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.month > span[b-814oxos9lf] { background:#73569b; }

.service-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-814oxos9lf] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-814oxos9lf] {
    display:block;
    color:#7c8d86;
    font-size:.90rem;
}

.care-metrics strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-814oxos9lf],
.service-unit-cell[b-814oxos9lf],
.provider-location-cell[b-814oxos9lf],
.result-cell[b-814oxos9lf],
.follow-score-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-814oxos9lf],
.result-cell[b-814oxos9lf] {
    min-width:230px;
}

.history-date-cell strong[b-814oxos9lf],
.service-unit-cell strong[b-814oxos9lf],
.provider-location-cell strong[b-814oxos9lf],
.result-cell strong[b-814oxos9lf],
.follow-score-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-814oxos9lf],
.service-unit-cell small[b-814oxos9lf],
.provider-location-cell small[b-814oxos9lf],
.result-cell small[b-814oxos9lf],
.follow-score-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.history-date-cell em[b-814oxos9lf],
.provider-location-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.referred[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-814oxos9lf] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-814oxos9lf] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-814oxos9lf] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-814oxos9lf] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-814oxos9lf] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-814oxos9lf],
.source-actions button[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-814oxos9lf] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-814oxos9lf] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-814oxos9lf] {
    min-height:180px;
}

.source-photo-card img[b-814oxos9lf] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-814oxos9lf] {
    margin-top:18px;
}

.vital-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-814oxos9lf],
.quality-grid > div[b-814oxos9lf],
.follow-up-grid > div[b-814oxos9lf] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-814oxos9lf],
.quality-grid span[b-814oxos9lf],
.follow-up-grid span[b-814oxos9lf] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-814oxos9lf],
.quality-grid strong[b-814oxos9lf],
.follow-up-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.vital-summary[b-814oxos9lf] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.90rem;
    line-height:1.65;
}

.follow-up-grid[b-814oxos9lf],
.quality-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.55 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:.94rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:.92rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-814oxos9lf] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-814oxos9lf] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-814oxos9lf] { background:rgba(104,120,114,.89); }

.view-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-814oxos9lf],
    .service-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-814oxos9lf],
    .vital-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-814oxos9lf] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-814oxos9lf],
    .quality-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-814oxos9lf],
    .service-overview[b-814oxos9lf],
    .care-metrics[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .source-photo-grid[b-814oxos9lf],
    .vital-grid[b-814oxos9lf],
    .follow-up-grid[b-814oxos9lf],
    .quality-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.follow-up > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.referred > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.overdue > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.inactive > span[b-814oxos9lf] { background:#687872; }

.risk-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-814oxos9lf],
.risk-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-814oxos9lf] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.risk-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-814oxos9lf] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-814oxos9lf] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-814oxos9lf],
.care-metrics strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-814oxos9lf],
.care-metrics small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.care-metrics[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-814oxos9lf] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-814oxos9lf],
.risk-adl-cell[b-814oxos9lf],
.dependency-living-cell[b-814oxos9lf],
.caregiver-cell[b-814oxos9lf],
.follow-up-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-814oxos9lf] {
    min-width:190px;
}

.register-age-cell strong[b-814oxos9lf],
.risk-adl-cell strong[b-814oxos9lf],
.dependency-living-cell strong[b-814oxos9lf],
.caregiver-cell strong[b-814oxos9lf],
.follow-up-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-814oxos9lf],
.risk-adl-cell small[b-814oxos9lf],
.dependency-living-cell small[b-814oxos9lf],
.caregiver-cell small[b-814oxos9lf],
.follow-up-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.register-age-cell em[b-814oxos9lf],
.caregiver-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-814oxos9lf],
.dependency-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.identity-chip[b-814oxos9lf],
.overdue-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.risk-chip.low[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-814oxos9lf] { color:#987634; background:#fff4df; }
.risk-chip.high[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-814oxos9lf] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.active[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.referred[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.overdue-chip[b-814oxos9lf] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-814oxos9lf] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-814oxos9lf] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-814oxos9lf] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-814oxos9lf] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-814oxos9lf] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.6;
}

.source-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-814oxos9lf],
.source-actions button[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-814oxos9lf] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-814oxos9lf] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.assessment-preview strong[b-814oxos9lf] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-814oxos9lf],
.reference-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-814oxos9lf],
.reference-grid > div[b-814oxos9lf],
.care-plan-grid > div[b-814oxos9lf] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-814oxos9lf],
.reference-grid span[b-814oxos9lf],
.care-plan-grid span[b-814oxos9lf] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.assessment-grid strong[b-814oxos9lf],
.reference-grid strong[b-814oxos9lf],
.care-plan-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.55;
}

.care-plan-main[b-814oxos9lf] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.90rem;
    line-height:1.7;
}

.care-plan-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.58 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:.96rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:.94rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-814oxos9lf] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-814oxos9lf] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-814oxos9lf] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-814oxos9lf] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-814oxos9lf] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-814oxos9lf],
    .assessment-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-814oxos9lf],
    .risk-overview[b-814oxos9lf],
    .dependency-grid[b-814oxos9lf],
    .care-metrics[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .assessment-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .care-plan-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:16.5px;
    line-height:1.62;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-814oxos9lf] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.field > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.completed > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.follow-up > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.referred > span[b-814oxos9lf] { background:#b55b82; }

.visit-type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-814oxos9lf],
.visit-type-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-814oxos9lf] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.visit-type-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-814oxos9lf] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-814oxos9lf] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-814oxos9lf],
.care-metrics strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-814oxos9lf],
.care-metrics small[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE */

.visit-date-cell[b-814oxos9lf],
.visit-type-cell[b-814oxos9lf],
.team-location-cell[b-814oxos9lf],
.result-cell[b-814oxos9lf],
.follow-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-814oxos9lf],
.result-cell[b-814oxos9lf] {
    min-width:230px;
}

.visit-date-cell strong[b-814oxos9lf],
.visit-type-cell strong[b-814oxos9lf],
.team-location-cell strong[b-814oxos9lf],
.result-cell strong[b-814oxos9lf],
.follow-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-814oxos9lf],
.visit-type-cell small[b-814oxos9lf],
.team-location-cell small[b-814oxos9lf],
.result-cell small[b-814oxos9lf],
.follow-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.58;
}

.visit-date-cell em[b-814oxos9lf],
.team-location-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.identity-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-814oxos9lf] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.referred[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.priority-text[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-814oxos9lf] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-814oxos9lf] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-814oxos9lf] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-814oxos9lf] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-814oxos9lf] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-814oxos9lf] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.65;
}

.source-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-814oxos9lf] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-814oxos9lf],
.reference-grid > div[b-814oxos9lf] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-814oxos9lf],
.reference-grid span[b-814oxos9lf] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-814oxos9lf],
.reference-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:.98rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-814oxos9lf],
    .visit-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-814oxos9lf],
    .visit-type-overview[b-814oxos9lf],
    .target-grid[b-814oxos9lf],
    .care-metrics[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .vital-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.65;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-814oxos9lf] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.review > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.eligible > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.paid > span[b-814oxos9lf] { background:#73569b; }

.type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-814oxos9lf],
.type-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-814oxos9lf] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-814oxos9lf],
.target-grid button[b-814oxos9lf] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.budget-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

/* TABLE */

.application-no-cell[b-814oxos9lf],
.welfare-type-cell[b-814oxos9lf],
.household-cell[b-814oxos9lf],
.amount-cell[b-814oxos9lf],
.officer-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-814oxos9lf],
.officer-cell[b-814oxos9lf] {
    min-width:210px;
}

.application-no-cell strong[b-814oxos9lf],
.welfare-type-cell strong[b-814oxos9lf],
.household-cell strong[b-814oxos9lf],
.amount-cell strong[b-814oxos9lf],
.officer-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-814oxos9lf],
.welfare-type-cell small[b-814oxos9lf],
.household-cell small[b-814oxos9lf],
.amount-cell small[b-814oxos9lf],
.officer-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.application-no-cell em[b-814oxos9lf],
.household-cell em[b-814oxos9lf],
.amount-cell em[b-814oxos9lf],
.officer-cell em[b-814oxos9lf],
.citizen-photo-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.source-group-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-814oxos9lf] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.source-group-chip[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-814oxos9lf] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-814oxos9lf],
.amount-preview[b-814oxos9lf] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-814oxos9lf] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-814oxos9lf] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-814oxos9lf],
.amount-preview > div[b-814oxos9lf] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-814oxos9lf],
.amount-preview small[b-814oxos9lf] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.amount-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-814oxos9lf],
.amount-preview strong[b-814oxos9lf] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-814oxos9lf],
.amount-preview span[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-document-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-814oxos9lf] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-814oxos9lf],
.amount-document-grid small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-document-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-814oxos9lf] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-814oxos9lf] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-814oxos9lf] {
    min-height:43px;
    font-size:.90rem;
}

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-814oxos9lf] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-814oxos9lf],
    .type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .type-overview[b-814oxos9lf],
    .budget-grid[b-814oxos9lf],
    .target-grid[b-814oxos9lf],
    .care-metrics[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .assessment-preview[b-814oxos9lf],
    .amount-preview[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.66;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-814oxos9lf] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.payment > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.suspended > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.expiring > span[b-814oxos9lf] { background:#73569b; }

.target-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-814oxos9lf],
.target-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-814oxos9lf] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.target-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-814oxos9lf],
.follow-grid button[b-814oxos9lf] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-metrics strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

.follow-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-814oxos9lf] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-814oxos9lf] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.registry-cell[b-814oxos9lf],
.benefit-cell[b-814oxos9lf],
.period-cell[b-814oxos9lf],
.amount-cell[b-814oxos9lf],
.payment-cycle-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-814oxos9lf] {
    min-width:225px;
}

.registry-cell strong[b-814oxos9lf],
.benefit-cell strong[b-814oxos9lf],
.period-cell strong[b-814oxos9lf],
.amount-cell strong[b-814oxos9lf],
.payment-cycle-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-814oxos9lf],
.benefit-cell small[b-814oxos9lf],
.period-cell small[b-814oxos9lf],
.amount-cell small[b-814oxos9lf],
.payment-cycle-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.registry-cell em[b-814oxos9lf],
.period-cell em[b-814oxos9lf],
.amount-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-814oxos9lf],
.cycle-chip[b-814oxos9lf],
.verify-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.source-group-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.benefit-chip.allowance[b-814oxos9lf] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-814oxos9lf] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-814oxos9lf] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-814oxos9lf] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.expired[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.source-group-chip[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-814oxos9lf] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-814oxos9lf] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-814oxos9lf] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-814oxos9lf] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-814oxos9lf] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* LARGE MUD TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-814oxos9lf] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-814oxos9lf] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-814oxos9lf],
    .target-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .target-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .condition-switch-grid[b-814oxos9lf],
    .amount-preview[b-814oxos9lf],
    .source-data-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .patient-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.66;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-814oxos9lf] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-814oxos9lf] { background:#687872; }
.status-overview-card.approval > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.processing > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.paid > span[b-814oxos9lf] { background:#34734b; }
.status-overview-card.failed > span[b-814oxos9lf] { background:#b54d43; }

.disbursement-progress[b-814oxos9lf] {
    margin-top:15px;
}

.disbursement-progress > div[b-814oxos9lf] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-814oxos9lf],
.amount-cell[b-814oxos9lf],
.progress-cell[b-814oxos9lf],
.date-cell[b-814oxos9lf],
.control-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-814oxos9lf] {
    min-width:245px;
}

.batch-cell strong[b-814oxos9lf],
.amount-cell strong[b-814oxos9lf],
.progress-cell strong[b-814oxos9lf],
.date-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-814oxos9lf],
.amount-cell small[b-814oxos9lf],
.progress-cell small[b-814oxos9lf],
.date-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.batch-cell em[b-814oxos9lf],
.amount-cell em[b-814oxos9lf],
.date-cell em[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-814oxos9lf] {
    min-width:180px;
}

.recipient-stack[b-814oxos9lf] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-814oxos9lf],
.recipient-stack span[b-814oxos9lf] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-814oxos9lf] {
    margin-left:0;
}

.recipient-stack img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.recipient-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.table-progress[b-814oxos9lf] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-814oxos9lf],
.approval-chip[b-814oxos9lf],
.reconcile-chip[b-814oxos9lf],
.cycle-chip[b-814oxos9lf],
.line-status-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.approved[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-814oxos9lf] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-814oxos9lf] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.control-cell[b-814oxos9lf] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-814oxos9lf] {
    align-items:center;
}

.selection-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-814oxos9lf] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-814oxos9lf] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-814oxos9lf] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-814oxos9lf] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.source-selection-summary strong[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-814oxos9lf] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-814oxos9lf] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-814oxos9lf],
.source-selection-table td[b-814oxos9lf] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.90rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-814oxos9lf] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.90rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-814oxos9lf] {
    background:#f0faf6;
}

.source-person-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-814oxos9lf] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-814oxos9lf],
.source-benefit-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-person-cell small[b-814oxos9lf],
.source-benefit-cell small[b-814oxos9lf],
.source-date[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.source-person-cell em[b-814oxos9lf] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.source-benefit-cell[b-814oxos9lf] {
    min-width:190px;
}

.source-amount[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-814oxos9lf] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.bank-readiness span.ready[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.source-document-buttons[b-814oxos9lf] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-814oxos9lf] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-814oxos9lf] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-814oxos9lf] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-814oxos9lf] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* DETAIL */

.batch-overview-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-814oxos9lf] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-814oxos9lf] {
    font-size:3.5rem;
}

.batch-overview-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-814oxos9lf] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.print-line-table-wrap[b-814oxos9lf] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-814oxos9lf] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-814oxos9lf],
.print-line-table td[b-814oxos9lf] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.90rem;
    vertical-align:top;
}

.print-line-table th[b-814oxos9lf] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-814oxos9lf],
.print-line-table td small[b-814oxos9lf] {
    display:block;
}

.print-line-table td small[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-814oxos9lf] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-814oxos9lf] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-814oxos9lf] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-814oxos9lf] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-814oxos9lf] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid strong[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.recipient-document-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-814oxos9lf] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-814oxos9lf] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-814oxos9lf] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-814oxos9lf] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-814oxos9lf] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-814oxos9lf],
    .recipient-detail-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-814oxos9lf] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-814oxos9lf] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .source-selection-summary[b-814oxos9lf],
    .amount-preview[b-814oxos9lf],
    .recipient-detail-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-814oxos9lf] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-814oxos9lf] {
        overflow-x:auto;
    }

    .source-selection-table[b-814oxos9lf] {
        min-width:1050px;
    }

    .batch-overview-panel[b-814oxos9lf],
    .recipient-detail-card[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-814oxos9lf] {
        width:100%;
        height:190px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .batch-overview-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.66;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf],
.type-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.full > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.overflow > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.maintenance > span[b-814oxos9lf] { background:#73569b; }

.type-overview[b-814oxos9lf] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-814oxos9lf],
.type-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-814oxos9lf] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-814oxos9lf] {
    margin-top:15px;
}

.fill-progress > div[b-814oxos9lf] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-814oxos9lf] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-814oxos9lf] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-814oxos9lf] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-814oxos9lf] {
    background:#987634;
}

.map-pin.full[b-814oxos9lf] {
    background:#c56b2a;
}

.map-pin.overflow[b-814oxos9lf] {
    background:#b54d43;
}

.map-pin.maintenance[b-814oxos9lf] {
    background:#73569b;
}

.map-pin.inactive[b-814oxos9lf] {
    background:#687872;
}

.map-pin span[b-814oxos9lf] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-814oxos9lf] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-814oxos9lf] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-814oxos9lf] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-814oxos9lf] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-814oxos9lf] { background:#987634; }
.map-board-legend i.full[b-814oxos9lf] { background:#b54d43; }
.map-board-legend i.maintenance[b-814oxos9lf] { background:#73569b; }

.map-board-caption[b-814oxos9lf] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-814oxos9lf],
.map-board-caption small[b-814oxos9lf] {
    display:block;
}

.map-board-caption strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.point-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-814oxos9lf] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-814oxos9lf] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.point-photo-cell em[b-814oxos9lf] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-814oxos9lf],
.bin-cell[b-814oxos9lf],
.fill-cell[b-814oxos9lf],
.collection-cell[b-814oxos9lf],
.sensor-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-814oxos9lf] {
    min-width:220px;
}

.location-cell strong[b-814oxos9lf],
.bin-cell strong[b-814oxos9lf],
.fill-cell strong[b-814oxos9lf],
.collection-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-814oxos9lf],
.bin-cell small[b-814oxos9lf],
.fill-cell small[b-814oxos9lf],
.collection-cell small[b-814oxos9lf],
.sensor-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell em[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.waste-type-chip[b-814oxos9lf],
.collection-chip[b-814oxos9lf],
.sensor-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.waste-type-chip.general[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-814oxos9lf] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-814oxos9lf] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-814oxos9lf] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.status-chip.active[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.full[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.table-progress[b-814oxos9lf] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-814oxos9lf] { background:var(--theme-primary); }
.table-progress.medium span[b-814oxos9lf] { background:#2f789f; }
.table-progress.high span[b-814oxos9lf] { background:#987634; }
.table-progress.critical span[b-814oxos9lf] { background:#b54d43; }

.repair-alert[b-814oxos9lf],
.clean-alert[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-814oxos9lf] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-814oxos9lf] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-814oxos9lf] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.fill-preview-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-814oxos9lf] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-814oxos9lf] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-814oxos9lf] { background:#2f789f; }
.fill-preview-bin.high span[b-814oxos9lf] { background:#987634; }
.fill-preview-bin.critical span[b-814oxos9lf] { background:#b54d43; }

.fill-preview-bin strong[b-814oxos9lf] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-814oxos9lf] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-814oxos9lf] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.source-photo-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-814oxos9lf] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-814oxos9lf] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.large-fill-indicator[b-814oxos9lf] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-814oxos9lf] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-814oxos9lf] { background:#2f789f; }
.large-fill-indicator.high > span[b-814oxos9lf] { background:#987634; }
.large-fill-indicator.critical > span[b-814oxos9lf] { background:#b54d43; }

.large-fill-indicator strong[b-814oxos9lf],
.large-fill-indicator small[b-814oxos9lf] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-814oxos9lf] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-814oxos9lf] {
    font-size:.90rem;
}

.detail-map-preview[b-814oxos9lf] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-814oxos9lf] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-814oxos9lf] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-814oxos9lf] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-814oxos9lf] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-814oxos9lf] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.collection-history-list small[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-button.collect[b-814oxos9lf] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-814oxos9lf] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-814oxos9lf],
    .type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-814oxos9lf] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-814oxos9lf] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-814oxos9lf] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .type-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .condition-switch-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-814oxos9lf],
    .fill-preview-card[b-814oxos9lf],
    .coordinate-preview[b-814oxos9lf],
    .collection-history-list article[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-814oxos9lf] {
        min-height:240px;
    }

    .large-fill-indicator[b-814oxos9lf],
    .fill-preview-bin[b-814oxos9lf],
    .coordinate-pin[b-814oxos9lf] {
        margin:0 auto;
    }

    .map-board[b-814oxos9lf] {
        min-height:500px;
    }

    .map-pin[b-814oxos9lf] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .point-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.68;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.received > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.inspecting > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.in-progress > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.resolved > span[b-814oxos9lf] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-814oxos9lf]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-814oxos9lf],
.pollution-type-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.pollution-type-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-814oxos9lf] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-814oxos9lf] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-814oxos9lf] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-814oxos9lf] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-814oxos9lf] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-814oxos9lf] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-814oxos9lf] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-814oxos9lf] {
    margin-top:18px;
}

.sla-progress > div[b-814oxos9lf] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-814oxos9lf] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-814oxos9lf] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-814oxos9lf] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-814oxos9lf] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-814oxos9lf] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-814oxos9lf] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-814oxos9lf] { background:#2f789f; }
.pollution-map-pin.medium[b-814oxos9lf] { background:#987634; }
.pollution-map-pin.high[b-814oxos9lf] { background:#c56b2a; }
.pollution-map-pin.critical[b-814oxos9lf] { background:#b54d43; }

.pollution-map-pin span[b-814oxos9lf] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-814oxos9lf] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-814oxos9lf] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-814oxos9lf] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-814oxos9lf] { background:#2f789f; }
.map-board-legend i.medium[b-814oxos9lf] { background:#987634; }
.map-board-legend i.high[b-814oxos9lf] { background:#c56b2a; }
.map-board-legend i.critical[b-814oxos9lf] { background:#b54d43; }

.map-board-caption[b-814oxos9lf] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-814oxos9lf],
.map-board-caption small[b-814oxos9lf] {
    display:block;
}

.map-board-caption strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-814oxos9lf] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.complaint-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.type-severity-cell[b-814oxos9lf],
.reporter-cell[b-814oxos9lf],
.location-cell[b-814oxos9lf],
.inspection-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-814oxos9lf],
.location-cell[b-814oxos9lf] {
    min-width:195px;
}

.reporter-cell strong[b-814oxos9lf],
.location-cell strong[b-814oxos9lf],
.inspection-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-814oxos9lf],
.location-cell small[b-814oxos9lf],
.inspection-cell small[b-814oxos9lf],
.status-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.reporter-cell em[b-814oxos9lf],
.location-cell em[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.pollution-type-chip[b-814oxos9lf],
.severity-chip[b-814oxos9lf],
.inspection-chip[b-814oxos9lf],
.status-chip[b-814oxos9lf],
.overdue-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.pollution-type-chip.air[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-814oxos9lf] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-814oxos9lf] { color:#987634; background:#fff4df; }
.severity-chip.high[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-814oxos9lf] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-814oxos9lf] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-814oxos9lf] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-814oxos9lf] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-814oxos9lf] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* FORM */

.anonymous-switch-card[b-814oxos9lf] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-814oxos9lf],
.anonymous-switch-card small[b-814oxos9lf] {
    display:block;
}

.anonymous-switch-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.coordinate-preview[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-814oxos9lf],
.map-board-grid[b-814oxos9lf] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-814oxos9lf] { background:#c56b2a; }
.coordinate-pin.critical[b-814oxos9lf] { background:#b54d43; }
.coordinate-pin.medium[b-814oxos9lf] { background:#987634; }

.coordinate-pin .mud-icon-root[b-814oxos9lf] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-814oxos9lf] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.source-point-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-814oxos9lf] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-condition-row[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-814oxos9lf] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:750;
}

.source-condition-row span.warning[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-814oxos9lf] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-814oxos9lf] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-814oxos9lf] { color:#987634; background:#fff4df; }

.measurement-preview small[b-814oxos9lf],
.measurement-preview strong[b-814oxos9lf],
.measurement-preview em[b-814oxos9lf] {
    display:block;
}

.measurement-preview small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-preview strong[b-814oxos9lf] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.source-photo-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-814oxos9lf] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-814oxos9lf] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.severity-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.25rem;
}

.severity-emblem strong[b-814oxos9lf] {
    font-size:1.10rem;
}

.severity-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.measurement-document-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-814oxos9lf] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-814oxos9lf],
.measurement-document-grid strong[b-814oxos9lf] {
    display:block;
}

.measurement-document-grid span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-814oxos9lf] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-814oxos9lf] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-814oxos9lf] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-814oxos9lf] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-814oxos9lf] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-814oxos9lf] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-814oxos9lf] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-814oxos9lf] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-814oxos9lf] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-814oxos9lf] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-814oxos9lf] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-814oxos9lf] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-814oxos9lf],
    .source-photo-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-814oxos9lf],
    .source-photo-preview button[b-814oxos9lf] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .pollution-type-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .measurement-preview[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-814oxos9lf],
    .coordinate-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .coordinate-pin[b-814oxos9lf] {
        margin:0 auto;
    }

    .pollution-map-board[b-814oxos9lf] {
        min-height:500px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .complaint-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.68;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.polluted > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.critical > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.restoring > span[b-814oxos9lf] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-814oxos9lf]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-814oxos9lf],
.institution-type-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-814oxos9lf] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-814oxos9lf] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-814oxos9lf] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-814oxos9lf] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-814oxos9lf] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-814oxos9lf] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-814oxos9lf] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.health-metric-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.health-metric-grid article[b-814oxos9lf] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.health-metric-grid article > span[b-814oxos9lf] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.health-metric-grid article.ph > span[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.health-metric-grid article.do > span[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.health-metric-grid article.bod > span[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.health-metric-grid article.turbidity > span[b-814oxos9lf] { color:#987634; background:#fff4df; }

.health-metric-grid small[b-814oxos9lf],
.health-metric-grid strong[b-814oxos9lf],
.health-metric-grid em[b-814oxos9lf] {
    display:block;
}

.health-metric-grid small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.health-metric-grid strong[b-814oxos9lf] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.health-metric-grid em[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-814oxos9lf] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-814oxos9lf] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-814oxos9lf] { background:var(--theme-primary); }
.education-map-pin.watch[b-814oxos9lf] { background:#987634; }
.education-map-pin.polluted[b-814oxos9lf] { background:#c56b2a; }
.education-map-pin.critical[b-814oxos9lf] { background:#b54d43; }
.education-map-pin.restoring[b-814oxos9lf] { background:#73569b; }
.education-map-pin.closed[b-814oxos9lf] { background:#687872; }

.education-map-pin span[b-814oxos9lf] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-814oxos9lf] { background:var(--theme-primary); }
.map-board-legend i.watch[b-814oxos9lf] { background:#987634; }
.map-board-legend i.polluted[b-814oxos9lf] { background:#c56b2a; }
.map-board-legend i.critical[b-814oxos9lf] { background:#b54d43; }
.map-board-legend i.restoring[b-814oxos9lf] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-814oxos9lf],
.latest-progress-cell[b-814oxos9lf],
.inspection-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-814oxos9lf],
.quality-status-chip[b-814oxos9lf],
.usage-chip[b-814oxos9lf],
.lab-chip[b-814oxos9lf],
.no-progress-chip[b-814oxos9lf],
.overdue-chip[b-814oxos9lf],
.follow-up-chip[b-814oxos9lf],
.complaint-count-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.canal[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-814oxos9lf] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-814oxos9lf] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-814oxos9lf] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.usage-chip[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-814oxos9lf],
.inspection-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-814oxos9lf],
.inspection-cell small[b-814oxos9lf],
.type-level-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-814oxos9lf] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.90rem;
}

.size-cell strong[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
}

.row-action.sample[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-814oxos9lf] { background:var(--theme-primary); }
.coordinate-pin.watch[b-814oxos9lf] { background:#987634; }
.coordinate-pin.polluted[b-814oxos9lf] { background:#c56b2a; }
.coordinate-pin.critical[b-814oxos9lf] { background:#b54d43; }
.coordinate-pin.restoring[b-814oxos9lf] { background:#73569b; }
.coordinate-pin.closed[b-814oxos9lf] { background:#687872; }

.coordinate-pin .mud-icon-root[b-814oxos9lf] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-814oxos9lf] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-814oxos9lf] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.linked-photo-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-814oxos9lf] {
    color:#73569b;
    font-size:.90rem;
    font-weight:800;
}

.linked-photo-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-photo-preview button[b-814oxos9lf] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.vaccine-form-modal[b-814oxos9lf] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.review-score-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.review-score-preview article[b-814oxos9lf] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.review-score-preview small[b-814oxos9lf],
.review-score-preview strong[b-814oxos9lf],
.review-score-preview span[b-814oxos9lf] {
    display:block;
}

.review-score-preview small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-814oxos9lf] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.review-score-preview span[b-814oxos9lf] {
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.review-score-preview article.ph[b-814oxos9lf] { border-top:4px solid #73569b; }
.review-score-preview article.do[b-814oxos9lf] { border-top:4px solid #2f789f; }
.review-score-preview article.bod[b-814oxos9lf] { border-top:4px solid #c56b2a; }
.review-score-preview article.cod[b-814oxos9lf] { border-top:4px solid #b54d43; }
.review-score-preview article.turbidity[b-814oxos9lf] { border-top:4px solid #987634; }
.review-score-preview article.coliform[b-814oxos9lf] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-814oxos9lf] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-814oxos9lf] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.25rem;
}

.education-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.measurement-document-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-814oxos9lf] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-814oxos9lf],
.measurement-document-grid strong[b-814oxos9lf] {
    display:block;
}

.measurement-document-grid span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-814oxos9lf] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.vaccine-history-panel[b-814oxos9lf],
.linked-complaint-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card-list[b-814oxos9lf],
.linked-complaint-list[b-814oxos9lf] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.vaccine-card[b-814oxos9lf] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.vaccine-card.good[b-814oxos9lf] { border-left-color:var(--theme-primary); }
.vaccine-card.watch[b-814oxos9lf] { border-left-color:#987634; }
.vaccine-card.polluted[b-814oxos9lf] { border-left-color:#c56b2a; }
.vaccine-card.critical[b-814oxos9lf] { border-left-color:#b54d43; }
.vaccine-card.restoring[b-814oxos9lf] { border-left-color:#73569b; }

.vaccine-card-head[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.vaccine-card-head strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.vaccine-card-head small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card-metrics[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.vaccine-card-metrics span[b-814oxos9lf] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.90rem;
}

.vaccine-card-metrics strong[b-814oxos9lf] {
    color:#2f789f;
}

.vaccine-card p[b-814oxos9lf] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.assessment-photo-actions[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

.linked-complaint-list article[b-814oxos9lf] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-814oxos9lf] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.90rem;
}

.linked-complaint-list p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-complaint-list a[b-814oxos9lf] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.90rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-814oxos9lf] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .institution-type-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .amount-document-grid[b-814oxos9lf],
    .progress-photo-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-814oxos9lf],
    .coordinate-preview[b-814oxos9lf],
    .linked-complaint-list article[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .coordinate-pin[b-814oxos9lf] {
        margin:0 auto;
    }

    .education-map-board[b-814oxos9lf] {
        min-height:500px;
    }

    .linked-complaint-list button[b-814oxos9lf] {
        height:210px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .education-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.68;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-814oxos9lf] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.diseased > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.treatment > span[b-814oxos9lf] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-814oxos9lf]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-814oxos9lf],
.institution-type-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-814oxos9lf] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-814oxos9lf] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-814oxos9lf] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-814oxos9lf] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-814oxos9lf] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-814oxos9lf] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-814oxos9lf] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.health-metric-grid article.carbon > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.photo > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.maintenance > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.treatment > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-814oxos9lf] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-814oxos9lf] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-814oxos9lf] { background:var(--theme-primary); }
.education-map-pin.watch[b-814oxos9lf] { background:#987634; }
.education-map-pin.diseased[b-814oxos9lf] { background:#c56b2a; }
.education-map-pin.hazardous[b-814oxos9lf] { background:#b54d43; }
.education-map-pin.treatment[b-814oxos9lf] { background:#73569b; }
.education-map-pin.removed[b-814oxos9lf] { background:#687872; }

.education-map-pin span[b-814oxos9lf] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-814oxos9lf] { background:var(--theme-primary); }
.map-board-legend i.watch[b-814oxos9lf] { background:#987634; }
.map-board-legend i.diseased[b-814oxos9lf] { background:#c56b2a; }
.map-board-legend i.hazardous[b-814oxos9lf] { background:#b54d43; }
.map-board-legend i.treatment[b-814oxos9lf] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-814oxos9lf],
.latest-progress-cell[b-814oxos9lf],
.maintenance-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-814oxos9lf],
.health-status-chip[b-814oxos9lf],
.risk-chip[b-814oxos9lf],
.health-score-chip[b-814oxos9lf],
.no-progress-chip[b-814oxos9lf],
.overdue-chip[b-814oxos9lf],
.urgent-chip[b-814oxos9lf],
.water-link-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-814oxos9lf] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-814oxos9lf] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-814oxos9lf] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-814oxos9lf] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-814oxos9lf] { color:#987634; background:#fff4df; }
.risk-chip.high[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-814oxos9lf] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-814oxos9lf],
.urgent-chip[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-814oxos9lf],
.latest-progress-cell strong[b-814oxos9lf],
.maintenance-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-814oxos9lf],
.latest-progress-cell small[b-814oxos9lf],
.maintenance-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-814oxos9lf] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.size-cell strong[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.size-cell em[b-814oxos9lf] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.90rem;
    font-style:normal;
}

.row-action.inspect[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-814oxos9lf] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-814oxos9lf] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* INSPECTION */

.vaccine-form-modal[b-814oxos9lf] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.good[b-814oxos9lf] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.watch[b-814oxos9lf] {
    border-top:4px solid #987634;
}

.review-score-preview article.diseased[b-814oxos9lf],
.review-score-preview article.high[b-814oxos9lf] {
    border-top:4px solid #c56b2a;
}

.review-score-preview article.hazardous[b-814oxos9lf],
.review-score-preview article.critical[b-814oxos9lf] {
    border-top:4px solid #b54d43;
}

.review-score-preview article.medium[b-814oxos9lf] {
    border-top:4px solid #987634;
}

.review-score-preview article.low[b-814oxos9lf] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-814oxos9lf] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-814oxos9lf] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.25rem;
}

.education-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card[b-814oxos9lf] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.medium[b-814oxos9lf],
.vaccine-card.watch[b-814oxos9lf] {
    border-left-color:#987634;
}

.vaccine-card.high[b-814oxos9lf],
.vaccine-card.diseased[b-814oxos9lf] {
    border-left-color:#c56b2a;
}

.vaccine-card.critical[b-814oxos9lf],
.vaccine-card.hazardous[b-814oxos9lf] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-814oxos9lf] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-814oxos9lf],
    .source-photo-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .institution-type-overview[b-814oxos9lf],
    .amount-metrics[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .progress-photo-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-814oxos9lf],
    .coordinate-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .coordinate-pin[b-814oxos9lf] {
        margin:0 auto;
    }

    .education-map-board[b-814oxos9lf] {
        min-height:500px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .education-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.72;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.full > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.maintenance > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.review > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.temp-closed > span[b-814oxos9lf] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-814oxos9lf]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-814oxos9lf],
.institution-type-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-814oxos9lf] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-814oxos9lf] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-814oxos9lf] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-814oxos9lf] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-814oxos9lf] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-814oxos9lf] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-814oxos9lf] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-814oxos9lf] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.health-metric-grid article.attendance > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.health > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.assessment > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.green > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-814oxos9lf] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-814oxos9lf] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-814oxos9lf] { background:var(--theme-primary); }
.education-map-pin.full[b-814oxos9lf] { background:#987634; }
.education-map-pin.maintenance[b-814oxos9lf] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-814oxos9lf] { background:#73569b; }
.education-map-pin.temp-closed[b-814oxos9lf],
.education-map-pin.inactive[b-814oxos9lf] { background:#b54d43; }

.education-map-pin span[b-814oxos9lf] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-814oxos9lf] { background:var(--theme-primary); }
.map-board-legend i.full[b-814oxos9lf] { background:#987634; }
.map-board-legend i.maintenance[b-814oxos9lf] { background:#c56b2a; }
.map-board-legend i.review[b-814oxos9lf] { background:#73569b; }
.map-board-legend i.closed[b-814oxos9lf] { background:#b54d43; }

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-814oxos9lf],
.latest-progress-cell[b-814oxos9lf],
.assessment-date-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-814oxos9lf],
.institution-status-chip[b-814oxos9lf],
.accreditation-chip[b-814oxos9lf],
.assessment-result-chip[b-814oxos9lf],
.no-progress-chip[b-814oxos9lf],
.overdue-chip[b-814oxos9lf],
.due-chip[b-814oxos9lf],
.green-link-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-814oxos9lf] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-814oxos9lf] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-814oxos9lf],
.assessment-result-chip.passed[b-814oxos9lf],
.assessment-result-chip.excellent[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-814oxos9lf],
.assessment-result-chip.conditional[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-814oxos9lf],
.assessment-result-chip.review[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-814oxos9lf],
.accreditation-chip.not-assessed[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-814oxos9lf],
.latest-progress-cell small[b-814oxos9lf],
.assessment-date-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.latest-progress-cell strong[b-814oxos9lf],
.assessment-date-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-814oxos9lf] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.occupancy-track[b-814oxos9lf] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.personnel-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-814oxos9lf] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.personnel-cell strong[b-814oxos9lf] {
    color:var(--theme-primary);
}

.personnel-cell em[b-814oxos9lf] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.90rem;
    font-style:normal;
}

.row-action.assess[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-814oxos9lf] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-814oxos9lf],
.capacity-preview strong[b-814oxos9lf] {
    display:block;
}

.capacity-preview small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.capacity-preview strong[b-814oxos9lf] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-814oxos9lf] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.vaccine-form-modal[b-814oxos9lf] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.excellent[b-814oxos9lf],
.review-score-preview article.passed[b-814oxos9lf] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.conditional[b-814oxos9lf] {
    border-top:4px solid #987634;
}

.review-score-preview article.review[b-814oxos9lf] {
    border-top:4px solid #b54d43;
}

.vaccine-card.excellent[b-814oxos9lf],
.vaccine-card.passed[b-814oxos9lf] {
    border-left-color:var(--theme-primary);
}

.vaccine-card.conditional[b-814oxos9lf] {
    border-left-color:#987634;
}

.vaccine-card.review[b-814oxos9lf] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-814oxos9lf] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-814oxos9lf] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.25rem;
}

.education-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-vaccine-button[b-814oxos9lf] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-814oxos9lf] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-814oxos9lf] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.04rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-814oxos9lf],
    .source-photo-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .institution-type-overview[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .progress-photo-grid[b-814oxos9lf],
    .capacity-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .education-map-board[b-814oxos9lf] {
        min-height:500px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .education-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.74;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-814oxos9lf] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.new > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.watch > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.transferred > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.graduated > span[b-814oxos9lf] { background:#73569b; }

.health-metric-grid article.new > span[b-814oxos9lf] {
    color:#c56b2a;
    background:#fff0df;
}

.health-metric-grid article.health > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.scholarship > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.photo > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-814oxos9lf],
.latest-progress-cell[b-814oxos9lf],
.care-cell[b-814oxos9lf] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-814oxos9lf],
.student-status-chip[b-814oxos9lf],
.health-chip[b-814oxos9lf],
.special-care-chip[b-814oxos9lf],
.scholarship-chip[b-814oxos9lf],
.learning-chip[b-814oxos9lf],
.no-progress-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.school-chip[b-814oxos9lf] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-814oxos9lf] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-814oxos9lf] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-814oxos9lf] { color:#987634; background:#fff4df; }
.health-chip.referred[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-814oxos9lf] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-814oxos9lf],
.learning-chip.good[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-814oxos9lf],
.latest-progress-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-814oxos9lf],
.latest-progress-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-cell[b-814oxos9lf] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.progress-track[b-814oxos9lf] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-814oxos9lf] { background:var(--theme-primary); }
.progress-track i.watch[b-814oxos9lf] { background:#987634; }
.progress-track i.risk[b-814oxos9lf] { background:#b54d43; }

.teacher-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-814oxos9lf],
.teacher-cell small[b-814oxos9lf] {
    display:block;
}

.teacher-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.progress[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-814oxos9lf] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-814oxos9lf] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-814oxos9lf] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.vaccine-form-modal[b-814oxos9lf] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.review-score-preview article[b-814oxos9lf] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.watch[b-814oxos9lf],
.review-score-preview article.pass[b-814oxos9lf] {
    border-top-color:#987634;
}

.review-score-preview article.risk[b-814oxos9lf],
.review-score-preview article.support[b-814oxos9lf] {
    border-top-color:#b54d43;
}

.review-score-preview small[b-814oxos9lf],
.review-score-preview strong[b-814oxos9lf],
.review-score-preview span[b-814oxos9lf] {
    display:block;
}

.review-score-preview small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-814oxos9lf] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.review-score-preview span[b-814oxos9lf] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-814oxos9lf] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.pass[b-814oxos9lf] {
    border-left-color:#2f789f;
}

.vaccine-card.support[b-814oxos9lf] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-814oxos9lf] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.pet-document-photo[b-814oxos9lf] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.05rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .progress-photo-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .vaccination-form-modal[b-814oxos9lf],
    .vaccine-form-modal[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   SCHOLARSHIP MANAGEMENT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.75;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.applications[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.approved[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.paid[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.balance[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.submitted > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.under-review > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.waiting-payment > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.partial > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.paid > span[b-814oxos9lf] { background:var(--theme-primary); }

.health-metric-grid article.review > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.waiting > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.partial > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.average > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.application-program-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:180px;
    flex-direction:column;
    gap:7px;
}

.application-program-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.99rem;
}

.application-program-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.scholarship-type-chip[b-814oxos9lf],
.scholarship-status-chip[b-814oxos9lf],
.priority-chip[b-814oxos9lf],
.special-care-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.scholarship-type-chip.need[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-type-chip.merit[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.scholarship-type-chip.disability[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.scholarship-type-chip.sport[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.scholarship-type-chip.culture[b-814oxos9lf] { color:#987634; background:#fff4df; }
.scholarship-type-chip.emergency[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.scholarship-status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.scholarship-status-chip.submitted[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.scholarship-status-chip.under-review[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.scholarship-status-chip.approved[b-814oxos9lf],
.scholarship-status-chip.paid[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-status-chip.waiting-payment[b-814oxos9lf] { color:#987634; background:#fff4df; }
.scholarship-status-chip.partial[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.scholarship-status-chip.rejected[b-814oxos9lf],
.scholarship-status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-814oxos9lf] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.special-care-chip[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.eligibility-cell[b-814oxos9lf],
.amount-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:205px;
}

.eligibility-cell span[b-814oxos9lf],
.amount-cell span[b-814oxos9lf] {
    display:flex;
    min-height:39px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.eligibility-cell strong[b-814oxos9lf],
.amount-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.eligibility-cell em[b-814oxos9lf] {
    grid-column:1 / -1;
}

.amount-cell span:nth-child(3)[b-814oxos9lf] {
    grid-column:1 / -1;
    color:#987634;
    background:#fffaf0;
}

.payment-progress-cell[b-814oxos9lf] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:9px;
}

.payment-progress-cell > div:first-child[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.payment-progress-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-progress-cell span[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.payment-track[b-814oxos9lf] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.payment-track i[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.payment-progress-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

.officer-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-814oxos9lf],
.officer-cell small[b-814oxos9lf] {
    display:block;
}

.officer-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.officer-cell small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.review[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-action.pay[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* APPLICATION FORM */

.linked-student-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-student-preview > button[b-814oxos9lf] {
    height:190px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:20px;
    cursor:zoom-in;
}

.linked-student-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-student-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-student-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.linked-student-preview p[b-814oxos9lf] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.93rem;
}

.linked-student-preview > div > div[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-student-preview > div > div span[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.document-upload-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.document-upload-card[b-814oxos9lf] {
    overflow:hidden;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.document-upload-heading[b-814oxos9lf] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-814oxos9lf] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.document-upload-heading strong[b-814oxos9lf],
.document-upload-heading small[b-814oxos9lf] {
    display:block;
}

.document-upload-heading strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.document-upload-heading small[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-814oxos9lf] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-814oxos9lf] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty .mud-icon-root[b-814oxos9lf] {
    font-size:2rem;
}

.document-empty strong[b-814oxos9lf] {
    font-size:.91rem;
}

.document-empty small[b-814oxos9lf] {
    font-size:.90rem;
}

.officer-grid[b-814oxos9lf] {
    margin-top:10px;
}

.privacy-warning[b-814oxos9lf] {
    margin-top:20px;
    font-size:.96rem !important;
}

/* REVIEW */

.vaccine-form-modal[b-814oxos9lf],
.attendance-form-modal[b-814oxos9lf] {
    width:min(1120px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-source-summary[b-814oxos9lf] {
    display:grid;
    grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.review-source-summary > div[b-814oxos9lf] {
    min-height:105px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.review-student[b-814oxos9lf] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.review-student img[b-814oxos9lf] {
    width:78px;
    height:78px;
    border-radius:19px;
    object-fit:cover;
}

.review-source-summary small[b-814oxos9lf],
.review-source-summary strong[b-814oxos9lf],
.review-source-summary span[b-814oxos9lf] {
    display:block;
}

.review-source-summary small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.review-source-summary strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1rem;
}

.review-source-summary span[b-814oxos9lf] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-score-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.review-score-preview article[b-814oxos9lf] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.conditional[b-814oxos9lf],
.review-score-preview article.requested[b-814oxos9lf] {
    border-top-color:#987634;
}

.review-score-preview article.review[b-814oxos9lf] {
    border-top-color:#b54d43;
}

.review-score-preview article.approved[b-814oxos9lf] {
    border-top-color:#73569b;
}

.review-score-preview small[b-814oxos9lf],
.review-score-preview strong[b-814oxos9lf],
.review-score-preview span[b-814oxos9lf] {
    display:block;
}

.review-score-preview small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-814oxos9lf] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.34rem;
}

.review-score-preview span[b-814oxos9lf] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-document-card[b-814oxos9lf],
.payment-document-card[b-814oxos9lf] {
    max-width:520px;
    margin:18px auto 0;
}

.review-save-button[b-814oxos9lf] {
    background:linear-gradient(135deg,#73569b,#584078) !important;
    color:#fff !important;
}

/* PAYMENT */

.payment-summary-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.payment-summary-grid article[b-814oxos9lf] {
    min-height:105px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.payment-summary-grid small[b-814oxos9lf],
.payment-summary-grid strong[b-814oxos9lf],
.payment-summary-grid span[b-814oxos9lf] {
    display:block;
}

.payment-summary-grid small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.payment-summary-grid strong[b-814oxos9lf] {
    margin-top:6px;
    color:var(--theme-primary);
    font-size:1.30rem;
}

.payment-summary-grid span[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.payment-save-button[b-814oxos9lf] {
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
    color:#fff !important;
}

/* VIEW */

.scholarship-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.scholarship-cover-photo[b-814oxos9lf] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.scholarship-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.scholarship-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.scholarship-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.40rem;
}

.scholarship-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.94rem;
}

.scholarship-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.scholarship-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.scholarship-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.scholarship-emblem.submitted[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.scholarship-emblem.under-review[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }
.scholarship-emblem.waiting-payment[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.scholarship-emblem.partial[b-814oxos9lf] { color:#2f789f; border-color:#d8eaf2; }
.scholarship-emblem.rejected[b-814oxos9lf],
.scholarship-emblem.cancelled[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }

.scholarship-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.3rem;
}

.scholarship-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.scholarship-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.pet-document-photo[b-814oxos9lf] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-814oxos9lf] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.view-attendance-button[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    gap:12px;
    padding:15px;
    border-left:5px solid var(--theme-primary);
    border-radius:13px;
    background:#f7fbf8;
}

.vaccine-card > span[b-814oxos9lf] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.vaccine-card > div > div[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.vaccine-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1rem;
}

.vaccine-card small[b-814oxos9lf],
.vaccine-card p[b-814oxos9lf],
.vaccine-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-814oxos9lf] {
    margin:5px 0;
}

.vaccine-card em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.history-empty[b-814oxos9lf] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.student > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.application > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.income > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.support > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.approval > span[b-814oxos9lf] { background:rgba(52,115,75,.90); }
.attachment-card.payment > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.96rem !important;
    line-height:1.74 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:67px;
    color:#26463c;
    font-size:.98rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.06rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1.02rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.04rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:1rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scholarship-cover-panel[b-814oxos9lf] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1100px) {
    .document-upload-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-source-summary[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-student-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .scholarship-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .review-source-summary[b-814oxos9lf],
    .review-score-preview[b-814oxos9lf],
    .payment-summary-grid[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.92rem !important;
    }

    .vaccination-form-modal[b-814oxos9lf],
    .vaccine-form-modal[b-814oxos9lf],
    .attendance-form-modal[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .scholarship-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   CHILDREN & YOUTH ACTIVITIES โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.76;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.activities[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.participants[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.budget[b-814oxos9lf] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.outcome[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.open > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.full > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.ongoing > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.completed > span[b-814oxos9lf] { background:#73569b; }
.status-overview-card.postponed > span[b-814oxos9lf] { background:#c56b2a; }

/* CATEGORY CARDS */

.category-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.category-overview-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:108px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.category-overview-card[b-814oxos9lf]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--category-soft,rgba(10,114,87,.08));
    content:"";
}

.category-overview-card:hover[b-814oxos9lf],
.category-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.category-overview-card > span[b-814oxos9lf] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--category-color);
    background:var(--category-soft);
}

.category-overview-card > div[b-814oxos9lf] {
    position:relative;
    z-index:2;
}

.category-overview-card small[b-814oxos9lf],
.category-overview-card strong[b-814oxos9lf],
.category-overview-card em[b-814oxos9lf] {
    display:block;
}

.category-overview-card small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.category-overview-card strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--category-color);
    font-size:1.25rem;
    font-weight:850;
}

.category-overview-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.category-overview-card.learning[b-814oxos9lf] {
    --category-color:var(--theme-primary);
    --category-soft:rgba(10,114,87,.13);
}

.category-overview-card.sport[b-814oxos9lf] {
    --category-color:#2f789f;
    --category-soft:rgba(47,120,159,.13);
}

.category-overview-card.art[b-814oxos9lf] {
    --category-color:#b3678a;
    --category-soft:rgba(179,103,138,.13);
}

.category-overview-card.environment[b-814oxos9lf] {
    --category-color:#39794f;
    --category-soft:rgba(57,121,79,.13);
}

.category-overview-card.volunteer[b-814oxos9lf] {
    --category-color:#c56b2a;
    --category-soft:rgba(197,107,42,.13);
}

.category-overview-card.digital[b-814oxos9lf] {
    --category-color:#73569b;
    --category-soft:rgba(115,86,155,.13);
}

/* METRICS */

.health-metric-grid article.upcoming > span[b-814oxos9lf] {
    color:#c56b2a;
    background:#fff0df;
}

.health-metric-grid article.full > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.ongoing > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.photo > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:102px minmax(0,1fr);
    min-width:380px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:102px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.03rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.schedule-location-cell[b-814oxos9lf],
.registration-cell[b-814oxos9lf],
.payment-progress-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:8px;
}

.schedule-location-cell > span[b-814oxos9lf] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.91rem;
    font-weight:800;
}

.schedule-location-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.schedule-location-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.54;
}

.registration-cell > div:first-child[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.registration-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1rem;
}

.registration-cell span[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.registration-track[b-814oxos9lf] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.registration-track i[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.registration-track i.available[b-814oxos9lf] { background:var(--theme-primary); }
.registration-track i.near-full[b-814oxos9lf] { background:#987634; }
.registration-track i.full[b-814oxos9lf] { background:#b54d43; }

.registration-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.budget-cell[b-814oxos9lf],
.outcome-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:215px;
}

.budget-cell span[b-814oxos9lf],
.outcome-cell span[b-814oxos9lf] {
    display:flex;
    min-height:40px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.budget-cell strong[b-814oxos9lf],
.outcome-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.budget-cell small[b-814oxos9lf],
.outcome-cell small[b-814oxos9lf] {
    grid-column:1 / -1;
    color:#71837a;
    font-size:.90rem;
}

.no-outcome-chip[b-814oxos9lf],
.activity-status-chip[b-814oxos9lf],
.priority-chip[b-814oxos9lf],
.category-chip[b-814oxos9lf],
.attendance-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.no-outcome-chip[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.activity-status-chip.draft[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.activity-status-chip.open[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.activity-status-chip.full[b-814oxos9lf] { color:#987634; background:#fff4df; }
.activity-status-chip.ongoing[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.activity-status-chip.completed[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.activity-status-chip.postponed[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.activity-status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-814oxos9lf] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.category-chip.learning[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.category-chip.sport[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.category-chip.art[b-814oxos9lf] { color:#b3678a; background:#faedf3; }
.category-chip.music[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.category-chip.environment[b-814oxos9lf] { color:#39794f; background:#eaf5ed; }
.category-chip.volunteer[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.category-chip.digital[b-814oxos9lf] { color:#356b9b; background:#e8f1f8; }
.category-chip.health[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.category-chip.culture[b-814oxos9lf] { color:#987634; background:#fff4df; }
.category-chip.career[b-814oxos9lf] { color:#4d7c68; background:#eaf3ef; }

.officer-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:215px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-814oxos9lf],
.officer-cell small[b-814oxos9lf] {
    display:block;
}

.officer-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.register[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

.row-action.attendance[b-814oxos9lf] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.complete[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM PREVIEW */

.activity-preview-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:17px 0 24px;
}

.activity-preview-grid article[b-814oxos9lf] {
    min-height:104px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.activity-preview-grid small[b-814oxos9lf],
.activity-preview-grid strong[b-814oxos9lf],
.activity-preview-grid span[b-814oxos9lf] {
    display:block;
}

.activity-preview-grid small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.activity-preview-grid strong[b-814oxos9lf] {
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.32rem;
}

.activity-preview-grid span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

/* UPLOAD */

.activity-upload-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:13px;
    margin-bottom:20px;
}

.activity-upload-card[b-814oxos9lf] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.activity-upload-heading[b-814oxos9lf] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.activity-upload-heading > span[b-814oxos9lf] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.activity-upload-heading strong[b-814oxos9lf],
.activity-upload-heading small[b-814oxos9lf] {
    display:block;
}

.activity-upload-heading strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.activity-upload-heading small[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.activity-upload-preview[b-814oxos9lf] {
    height:165px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.activity-upload-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-upload-empty[b-814oxos9lf] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.activity-upload-empty .mud-icon-root[b-814oxos9lf] {
    font-size:2rem;
}

.activity-upload-empty strong[b-814oxos9lf],
.activity-upload-empty small[b-814oxos9lf] {
    font-size:.90rem;
}

.privacy-warning[b-814oxos9lf] {
    margin-top:20px;
    font-size:.98rem !important;
}

/* PARTICIPANT */

.vaccine-form-modal[b-814oxos9lf],
.attendance-form-modal[b-814oxos9lf],
.completion-form-modal[b-814oxos9lf] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.participant-activity-summary[b-814oxos9lf],
.completion-summary-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.participant-activity-summary > div[b-814oxos9lf],
.completion-summary-grid article[b-814oxos9lf] {
    min-height:102px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.participant-activity-summary small[b-814oxos9lf],
.participant-activity-summary strong[b-814oxos9lf],
.completion-summary-grid small[b-814oxos9lf],
.completion-summary-grid strong[b-814oxos9lf],
.completion-summary-grid span[b-814oxos9lf] {
    display:block;
}

.participant-activity-summary small[b-814oxos9lf],
.completion-summary-grid small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.participant-activity-summary strong[b-814oxos9lf],
.completion-summary-grid strong[b-814oxos9lf] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.04rem;
}

.completion-summary-grid span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.linked-participant-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:155px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:15px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-participant-preview > img[b-814oxos9lf] {
    width:155px;
    height:155px;
    border-radius:22px;
    object-fit:cover;
}

.linked-participant-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-participant-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.25rem;
}

.linked-participant-preview p[b-814oxos9lf] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-participant-preview > div > div[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-participant-preview > div > div span[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.linked-participant-preview .special-care-note[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.consent-warning[b-814oxos9lf] {
    margin-top:18px;
    font-size:.96rem !important;
}

.register-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

/* ATTENDANCE */

.attendance-toolbar[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:15px;
    padding:14px 16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.attendance-toolbar strong[b-814oxos9lf],
.attendance-toolbar span[b-814oxos9lf] {
    display:block;
}

.attendance-toolbar strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:1.04rem;
}

.attendance-toolbar span[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.91rem;
}

.attendance-toolbar > div:last-child[b-814oxos9lf] {
    display:flex;
    gap:8px;
}

.attendance-toolbar button[b-814oxos9lf] {
    min-height:40px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.20);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.attendance-register-list[b-814oxos9lf] {
    display:flex;
    max-height:55vh;
    overflow:auto;
    flex-direction:column;
    gap:10px;
    padding-right:5px;
}

.attendance-row[b-814oxos9lf] {
    display:grid;
    grid-template-columns:64px minmax(180px,1fr) 180px 155px minmax(180px,1fr);
    align-items:center;
    gap:11px;
    padding:12px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:15px;
    background:#fff;
}

.attendance-row.attended[b-814oxos9lf] { border-left-color:var(--theme-primary); }
.attendance-row.late[b-814oxos9lf] { border-left-color:#987634; }
.attendance-row.absent[b-814oxos9lf] { border-left-color:#b54d43; }

.attendance-row > img[b-814oxos9lf] {
    width:64px;
    height:64px;
    border-radius:17px;
    object-fit:cover;
}

.attendance-person strong[b-814oxos9lf],
.attendance-person small[b-814oxos9lf] {
    display:block;
}

.attendance-person strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.attendance-person small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-recorder[b-814oxos9lf] {
    margin-top:16px !important;
}

.attendance-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#225c7a) !important;
}

/* COMPLETION */

.completion-score-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.completion-score-grid article[b-814oxos9lf] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.completion-score-grid article.watch[b-814oxos9lf] {
    border-top-color:#987634;
}

.completion-score-grid article.risk[b-814oxos9lf] {
    border-top-color:#b54d43;
}

.completion-score-grid small[b-814oxos9lf],
.completion-score-grid strong[b-814oxos9lf],
.completion-score-grid span[b-814oxos9lf] {
    display:block;
}

.completion-score-grid small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.completion-score-grid strong[b-814oxos9lf] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.35rem;
}

.completion-score-grid span[b-814oxos9lf] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.completion-photo-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.completion-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.activity-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.activity-cover-photo[b-814oxos9lf] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.activity-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.activity-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.activity-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.96rem;
    line-height:1.7;
}

.activity-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.activity-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.activity-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.activity-emblem.full[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.activity-emblem.ongoing[b-814oxos9lf] { color:#2f789f; border-color:#d8eaf2; }
.activity-emblem.completed[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }
.activity-emblem.postponed[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.activity-emblem.cancelled[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }

.activity-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.3rem;
}

.activity-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.activity-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.pet-document-photo[b-814oxos9lf] {
    width:128px;
    height:96px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:22px;
    background:#e7f5ef;
}

.pet-document-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-814oxos9lf] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.view-attendance-button[b-814oxos9lf] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-complete-button[b-814oxos9lf] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.result-score-strip[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

.result-score-strip article[b-814oxos9lf] {
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.result-score-strip small[b-814oxos9lf],
.result-score-strip strong[b-814oxos9lf] {
    display:block;
}

.result-score-strip small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.result-score-strip strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--theme-primary);
    font-size:1.16rem;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    gap:12px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card.attended[b-814oxos9lf] { border-left-color:var(--theme-primary); }
.vaccine-card.late[b-814oxos9lf] { border-left-color:#987634; }
.vaccine-card.absent[b-814oxos9lf] { border-left-color:#b54d43; }

.vaccine-card > img[b-814oxos9lf] {
    width:70px;
    height:70px;
    border-radius:18px;
    object-fit:cover;
}

.vaccine-card > div > div[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-card p[b-814oxos9lf],
.vaccine-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-814oxos9lf] {
    margin:5px 0;
}

.vaccine-card em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.attendance-chip.attended[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.attendance-chip.late[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.attendance-chip.absent[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.attendance-chip.not-recorded[b-814oxos9lf] {
    color:#687872;
    background:#edf1ef;
}

.history-empty[b-814oxos9lf] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.cover > span[b-814oxos9lf] { background:rgba(10,114,87,.90); }
.attachment-card.venue > span[b-814oxos9lf] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }
.attachment-card.schedule > span[b-814oxos9lf] { background:rgba(152,118,52,.90); }
.attachment-card.safety > span[b-814oxos9lf] { background:rgba(181,77,67,.90); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(57,121,79,.90); }
.attachment-card.report > span[b-814oxos9lf] { background:rgba(115,86,155,.90); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.75 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.07rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1650px) {
    .category-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-upload-grid[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width:1500px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .activity-cover-panel[b-814oxos9lf] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1150px) {
    .activity-upload-grid[b-814oxos9lf],
    .vaccine-card-list[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attendance-row[b-814oxos9lf] {
        grid-template-columns:60px minmax(180px,1fr) 170px;
    }

    .attendance-time-field[b-814oxos9lf],
    .attendance-note-field[b-814oxos9lf] {
        grid-column:auto / span 1;
    }

    .activity-cover-panel[b-814oxos9lf] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .activity-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .category-overview[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .activity-preview-grid[b-814oxos9lf],
    .participant-activity-summary[b-814oxos9lf],
    .completion-summary-grid[b-814oxos9lf],
    .completion-score-grid[b-814oxos9lf],
    .completion-photo-grid[b-814oxos9lf],
    .activity-upload-grid[b-814oxos9lf],
    .vaccine-card-list[b-814oxos9lf],
    .result-score-strip[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview > img[b-814oxos9lf] {
        width:100%;
        height:240px;
    }

    .attendance-toolbar[b-814oxos9lf] {
        align-items:flex-start;
        flex-direction:column;
    }

    .attendance-row[b-814oxos9lf] {
        grid-template-columns:58px minmax(0,1fr);
    }

    .attendance-status-select[b-814oxos9lf],
    .attendance-time-field[b-814oxos9lf],
    .attendance-note-field[b-814oxos9lf] {
        grid-column:1 / -1;
    }

    .activity-cover-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-cover-photo[b-814oxos9lf] {
        height:250px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .vaccination-form-modal[b-814oxos9lf],
    .vaccine-form-modal[b-814oxos9lf],
    .attendance-form-modal[b-814oxos9lf],
    .completion-form-modal[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .activity-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   PET REGISTRATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.76;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.total[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.dog[b-814oxos9lf] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.summary-card.vaccine[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.chip[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.pending > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.active > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.transferred > span[b-814oxos9lf] { background:#2f789f; }
.status-overview-card.lost > span[b-814oxos9lf] { background:#c56b2a; }
.status-overview-card.deceased > span[b-814oxos9lf] { background:#687872; }

.species-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:15px 0 0;
}

.species-overview-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    min-height:118px;
    overflow:hidden;
    align-items:center;
    gap:14px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 12px 28px rgba(5,62,46,.06);
    transition:.18s ease;
}

.species-overview-card:hover[b-814oxos9lf],
.species-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:var(--species-color);
    box-shadow:0 18px 38px rgba(5,62,46,.13);
}

.species-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:68px;
    height:68px;
    place-items:center;
    border-radius:19px;
    color:var(--species-color);
    background:var(--species-soft);
}

.species-overview-card small[b-814oxos9lf],
.species-overview-card strong[b-814oxos9lf],
.species-overview-card em[b-814oxos9lf] {
    display:block;
}

.species-overview-card small[b-814oxos9lf] {
    color:#71837a;
    font-size:.92rem;
    font-weight:700;
}

.species-overview-card strong[b-814oxos9lf] {
    margin-top:4px;
    color:var(--species-color);
    font-size:1.42rem;
    font-weight:850;
}

.species-overview-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.species-overview-card.dog[b-814oxos9lf] {
    --species-color:#c56b2a;
    --species-soft:#fff0df;
}

.species-overview-card.cat[b-814oxos9lf] {
    --species-color:#73569b;
    --species-soft:#f0eafb;
}

.species-overview-card.other[b-814oxos9lf] {
    --species-color:#2f789f;
    --species-soft:#e8f3f8;
}

.health-metric-grid article.due > span[b-814oxos9lf] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.overdue > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.neutered > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.photo > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:94px minmax(0,1fr);
    min-width:360px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:94px;
    height:94px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:25px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
    font-weight:850;
    line-height:1.55;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.owner-house-cell[b-814oxos9lf],
.breed-cell[b-814oxos9lf],
.vaccine-cell[b-814oxos9lf],
.identity-cell[b-814oxos9lf],
.status-cell[b-814oxos9lf] {
    display:flex;
    min-width:185px;
    flex-direction:column;
    gap:7px;
}

.owner-house-cell strong[b-814oxos9lf],
.breed-cell strong[b-814oxos9lf],
.vaccine-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.owner-house-cell span[b-814oxos9lf],
.owner-house-cell small[b-814oxos9lf],
.owner-house-cell em[b-814oxos9lf],
.breed-cell small[b-814oxos9lf],
.vaccine-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
    line-height:1.55;
}

.owner-house-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
}

.species-chip[b-814oxos9lf],
.pet-status-chip[b-814oxos9lf],
.vaccine-chip[b-814oxos9lf],
.warning-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.species-chip.dog[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.species-chip.cat[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.species-chip.other[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }

.pet-status-chip.pending[b-814oxos9lf] { color:#987634; background:#fff4df; }
.pet-status-chip.active[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.pet-status-chip.transferred[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }
.pet-status-chip.lost[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.pet-status-chip.deceased[b-814oxos9lf] { color:#687872; background:#edf1ef; }
.pet-status-chip.cancelled[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }

.vaccine-chip.current[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.vaccine-chip.due-soon[b-814oxos9lf] { color:#987634; background:#fff4df; }
.vaccine-chip.overdue[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.vaccine-chip.no-data[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.warning-chip[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.identity-cell span[b-814oxos9lf] {
    display:flex;
    min-height:38px;
    align-items:center;
    gap:7px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f7fbf8;
    font-size:.90rem;
}

.identity-cell small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
}

.officer-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-814oxos9lf],
.officer-cell small[b-814oxos9lf] {
    display:block;
}

.officer-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.vaccine[b-814oxos9lf] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

/* OWNER PREVIEW */

.linked-owner-preview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:125px minmax(0,1fr) 220px;
    align-items:center;
    gap:18px;
    margin:15px 0 24px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:19px;
    background:#f1f8f3;
}

.owner-preview-photo[b-814oxos9lf] {
    display:grid;
    width:125px;
    height:125px;
    overflow:hidden;
    place-items:center;
    border-radius:24px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.owner-preview-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.owner-preview-photo .mud-icon-root[b-814oxos9lf] {
    font-size:3.5rem;
}

.linked-owner-preview small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-owner-preview h3[b-814oxos9lf] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.28rem;
}

.linked-owner-preview p[b-814oxos9lf] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-owner-preview > div:nth-child(2) > div[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.linked-owner-preview > div:nth-child(2) > div span[b-814oxos9lf] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.house-preview-photo[b-814oxos9lf] {
    height:135px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:18px;
    cursor:zoom-in;
}

.house-preview-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* UPLOAD */

.pet-upload-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.pet-upload-card[b-814oxos9lf] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.pet-upload-heading[b-814oxos9lf] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.pet-upload-heading > span[b-814oxos9lf] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.pet-upload-heading strong[b-814oxos9lf],
.pet-upload-heading small[b-814oxos9lf] {
    display:block;
}

.pet-upload-heading strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.pet-upload-heading small[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.pet-upload-preview[b-814oxos9lf] {
    height:175px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.pet-upload-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-upload-empty[b-814oxos9lf] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.pet-upload-empty strong[b-814oxos9lf],
.pet-upload-empty small[b-814oxos9lf] {
    font-size:.90rem;
}

.privacy-warning[b-814oxos9lf] {
    margin-top:19px;
    font-size:.98rem !important;
}

/* VACCINE FORM */

.vaccine-form-modal[b-814oxos9lf] {
    width:min(1080px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.vaccine-pet-summary[b-814oxos9lf] {
    display:grid;
    grid-template-columns:110px 1.3fr 1fr 1fr;
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.vaccine-pet-summary > img[b-814oxos9lf] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.vaccine-pet-summary small[b-814oxos9lf],
.vaccine-pet-summary strong[b-814oxos9lf],
.vaccine-pet-summary span[b-814oxos9lf] {
    display:block;
}

.vaccine-pet-summary small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-pet-summary strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.vaccine-pet-summary span[b-814oxos9lf] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-upload-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 250px 150px;
    align-items:center;
    gap:13px;
    max-width:760px;
    margin:20px auto 0;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
}

.vaccine-upload-card > div:first-child[b-814oxos9lf] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
}

.vaccine-upload-card > div:first-child > span[b-814oxos9lf] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-upload-card strong[b-814oxos9lf],
.vaccine-upload-card small[b-814oxos9lf] {
    display:block;
}

.vaccine-upload-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-upload-card small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-upload-preview[b-814oxos9lf] {
    display:grid;
    height:130px;
    overflow:hidden;
    place-items:center;
    border-radius:14px;
    color:#71837a;
    background:var(--theme-bg);
}

.vaccine-upload-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.vaccine-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

/* VIEW */

.health-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.health-cover-photo[b-814oxos9lf] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.health-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.health-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.health-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.health-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.health-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.health-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.health-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.health-emblem.pending[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.health-emblem.transferred[b-814oxos9lf] { color:#2f789f; border-color:#d8eaf2; }
.health-emblem.lost[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.health-emblem.deceased[b-814oxos9lf] { color:#687872; border-color:#dfe6e2; }
.health-emblem.cancelled[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }

.health-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.4rem;
}

.health-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.health-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.pet-document-photo[b-814oxos9lf] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-814oxos9lf] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.vaccine-history-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px;
    border-left:5px solid #2f789f;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card > span[b-814oxos9lf] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:15px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-card > div > div[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.vaccine-card small[b-814oxos9lf],
.vaccine-card p[b-814oxos9lf],
.vaccine-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-814oxos9lf] {
    margin:5px 0;
}

.vaccine-card em[b-814oxos9lf] {
    color:#2f789f;
    font-style:normal;
}

.attachment-card.pet > span[b-814oxos9lf] { background:rgba(197,107,42,.92); }
.attachment-card.owner > span[b-814oxos9lf] { background:rgba(10,114,87,.92); }
.attachment-card.house > span[b-814oxos9lf] { background:rgba(77,124,104,.92); }
.attachment-card.vaccine > span[b-814oxos9lf] { background:rgba(47,120,159,.92); }
.attachment-card.chip > span[b-814oxos9lf] { background:rgba(115,86,155,.92); }
.attachment-card.neuter > span[b-814oxos9lf] { background:rgba(57,121,79,.92); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.07rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .pet-upload-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .health-cover-panel[b-814oxos9lf] {
        grid-template-columns:250px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .linked-owner-preview[b-814oxos9lf] {
        grid-template-columns:115px minmax(0,1fr);
    }

    .house-preview-photo[b-814oxos9lf] {
        grid-column:1 / -1;
        height:220px;
    }

    .vaccine-pet-summary[b-814oxos9lf] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .vaccine-pet-summary > div:last-child[b-814oxos9lf] {
        grid-column:2 / -1;
    }

    .vaccine-upload-card[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .health-cover-panel[b-814oxos9lf] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .health-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .species-overview[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .pet-upload-grid[b-814oxos9lf],
    .vaccine-card-list[b-814oxos9lf],
    .vaccine-pet-summary[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-owner-preview[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .owner-preview-photo[b-814oxos9lf] {
        width:100%;
        height:230px;
    }

    .health-cover-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .health-cover-photo[b-814oxos9lf] {
        height:280px;
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .vaccination-form-modal[b-814oxos9lf],
    .vaccine-form-modal[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .health-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}


/* =========================================================
   PET VACCINATION & DISEASE CONTROL โ€” PREMIUM LARGE TEXT
   ========================================================= */

.vaccination-page[b-814oxos9lf] {
    font-size:17px;
    line-height:1.76;
}

.vaccination-hero[b-814oxos9lf] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(61,145,122,.30), transparent 38%),
        linear-gradient(138deg, #1f6b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.pets[b-814oxos9lf] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.overdue[b-814oxos9lf] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.disease[b-814oxos9lf] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.stock[b-814oxos9lf] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-814oxos9lf] {
    grid-template-columns:repeat(5,minmax(0,1fr));
}

.status-overview-card.current > span[b-814oxos9lf] { background:var(--theme-primary); }
.status-overview-card.due-soon > span[b-814oxos9lf] { background:#987634; }
.status-overview-card.overdue > span[b-814oxos9lf] { background:#b54d43; }
.status-overview-card.no-data > span[b-814oxos9lf] { background:#687872; }

/* DISEASE STATUS */

.disease-overview[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.disease-overview-card[b-814oxos9lf] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:110px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.disease-overview-card:hover[b-814oxos9lf],
.disease-overview-card.selected[b-814oxos9lf] {
    transform:translateY(-3px);
    border-color:var(--disease-color);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.disease-overview-card > span[b-814oxos9lf] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--disease-color);
    background:var(--disease-soft);
}

.disease-overview-card small[b-814oxos9lf],
.disease-overview-card strong[b-814oxos9lf] {
    display:block;
}

.disease-overview-card small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.disease-overview-card strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--disease-color);
    font-size:1.28rem;
    font-weight:850;
}

.disease-overview-card.all[b-814oxos9lf] {
    --disease-color:var(--theme-primary);
    --disease-soft:#e7f5ef;
}

.disease-overview-card.normal[b-814oxos9lf] {
    --disease-color:var(--theme-primary);
    --disease-soft:#e7f5ef;
}

.disease-overview-card.watch[b-814oxos9lf] {
    --disease-color:#987634;
    --disease-soft:#fff4df;
}

.disease-overview-card.suspected[b-814oxos9lf] {
    --disease-color:#c56b2a;
    --disease-soft:#fff0df;
}

.disease-overview-card.quarantine[b-814oxos9lf] {
    --disease-color:#b54d43;
    --disease-soft:#fff0ee;
}

.disease-overview-card.treating[b-814oxos9lf] {
    --disease-color:#73569b;
    --disease-soft:#f0eafb;
}

/* CAMPAIGNS */

.campaign-panel[b-814oxos9lf] {
    margin-top:18px;
    padding:20px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:23px;
    background:
        radial-gradient(circle at 95% 0%, rgba(10,114,87,.08), transparent 25%),
        linear-gradient(145deg,#fff,#f6faf7);
    box-shadow:0 16px 38px rgba(5,62,46,.07);
}

.campaign-heading[b-814oxos9lf] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:17px;
}

.campaign-heading small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.campaign-heading h2[b-814oxos9lf] {
    margin:4px 0 0;
    color:#2d463c;
    font-size:1.42rem;
}

.campaign-heading p[b-814oxos9lf] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.95rem;
}

.campaign-add-button[b-814oxos9lf],
.campaign-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

.campaign-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}

.campaign-card[b-814oxos9lf] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:#fff;
    box-shadow:0 12px 28px rgba(5,62,46,.07);
    transition:.18s ease;
}

.campaign-card:hover[b-814oxos9lf] {
    transform:translateY(-3px);
    box-shadow:0 20px 40px rgba(5,62,46,.13);
}

.campaign-photo[b-814oxos9lf] {
    position:relative;
    display:block;
    width:100%;
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    background:#edf5f1;
    cursor:zoom-in;
}

.campaign-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.campaign-status[b-814oxos9lf] {
    position:absolute;
    top:12px;
    right:12px;
    display:inline-flex;
    min-height:36px;
    align-items:center;
    padding:0 12px;
    border-radius:999px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    box-shadow:0 7px 18px rgba(0,0,0,.14);
}

.campaign-status.draft[b-814oxos9lf] { background:#687872; }
.campaign-status.open[b-814oxos9lf] { background:var(--theme-primary); }
.campaign-status.ongoing[b-814oxos9lf] { background:#2f789f; }
.campaign-status.completed[b-814oxos9lf] { background:#73569b; }
.campaign-status.cancelled[b-814oxos9lf] { background:#b54d43; }

.campaign-content[b-814oxos9lf] {
    padding:15px;
}

.campaign-content > small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.campaign-content h3[b-814oxos9lf] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.05rem;
    line-height:1.55;
}

.campaign-meta[b-814oxos9lf] {
    display:flex;
    flex-direction:column;
    gap:7px;
    margin-top:12px;
}

.campaign-meta span[b-814oxos9lf] {
    display:flex;
    align-items:center;
    gap:7px;
    color:#71837a;
    font-size:.90rem;
}

.campaign-progress[b-814oxos9lf] {
    margin-top:14px;
    padding:12px;
    border-radius:14px;
    background:#f5faf7;
}

.campaign-progress > div:first-child[b-814oxos9lf],
.campaign-progress > div:last-child[b-814oxos9lf] {
    display:flex;
    justify-content:space-between;
    gap:9px;
}

.campaign-progress span[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.campaign-progress strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.progress-track[b-814oxos9lf] {
    height:10px;
    overflow:hidden;
    margin:8px 0;
    border-radius:999px;
    background:var(--theme-border);
}

.progress-track i[b-814oxos9lf] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.campaign-actions[b-814oxos9lf] {
    display:flex;
    gap:8px;
    margin-top:13px;
}

.campaign-actions button[b-814oxos9lf] {
    display:inline-flex;
    min-height:40px;
    flex:1;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(10,114,87,.18);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.campaign-actions button:disabled[b-814oxos9lf] {
    opacity:.45;
    cursor:not-allowed;
}

/* METRICS */

.health-metric-grid article.current > span[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.month > span[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.treatment > span[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.rabies > span[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

/* TABLE */

.pet-photo-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    min-width:350px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-814oxos9lf] {
    width:92px;
    height:92px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:24px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-814oxos9lf] {
    display:block;
    color:var(--theme-ink);
    font-size:1.07rem;
    font-weight:850;
    line-height:1.55;
}

.pet-photo-cell small[b-814oxos9lf],
.pet-photo-cell em[b-814oxos9lf] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.pet-photo-cell em[b-814oxos9lf] {
    color:var(--theme-primary);
    font-style:normal;
}

.owner-cell[b-814oxos9lf],
.last-vaccine-cell[b-814oxos9lf],
.due-cell[b-814oxos9lf],
.disease-cell[b-814oxos9lf],
.follow-up-cell[b-814oxos9lf] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:7px;
}

.owner-cell strong[b-814oxos9lf],
.last-vaccine-cell strong[b-814oxos9lf],
.due-cell strong[b-814oxos9lf],
.disease-cell strong[b-814oxos9lf],
.follow-up-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.owner-cell span[b-814oxos9lf],
.owner-cell small[b-814oxos9lf],
.last-vaccine-cell small[b-814oxos9lf],
.due-cell small[b-814oxos9lf],
.disease-cell small[b-814oxos9lf],
.follow-up-cell small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.last-vaccine-cell > span[b-814oxos9lf],
.follow-up-cell > span[b-814oxos9lf] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.vaccine-chip[b-814oxos9lf],
.disease-chip[b-814oxos9lf],
.species-chip[b-814oxos9lf] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.vaccine-chip.current[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.vaccine-chip.due-soon[b-814oxos9lf] { color:#987634; background:#fff4df; }
.vaccine-chip.overdue[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.vaccine-chip.no-data[b-814oxos9lf] { color:#687872; background:#edf1ef; }

.disease-chip.normal[b-814oxos9lf] { color:var(--theme-primary); background:#e7f5ef; }
.disease-chip.watch[b-814oxos9lf] { color:#987634; background:#fff4df; }
.disease-chip.suspected[b-814oxos9lf] { color:#c56b2a; background:#fff0df; }
.disease-chip.quarantine[b-814oxos9lf] { color:#b54d43; background:#fff0ee; }
.disease-chip.treating[b-814oxos9lf] { color:#73569b; background:#f0eafb; }
.disease-chip.resolved[b-814oxos9lf] { color:#2f789f; background:#e8f3f8; }

.species-chip[b-814oxos9lf] {
    color:#2f789f;
    background:#e8f3f8;
}

.officer-cell[b-814oxos9lf] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-814oxos9lf] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-814oxos9lf],
.officer-cell small[b-814oxos9lf] {
    display:block;
}

.officer-cell strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-814oxos9lf] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.vaccine[b-814oxos9lf] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.disease[b-814oxos9lf] {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-action.follow[b-814oxos9lf] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* MODALS */

.vaccination-form-modal[b-814oxos9lf],
.disease-form-modal[b-814oxos9lf],
.follow-up-form-modal[b-814oxos9lf],
.campaign-form-modal[b-814oxos9lf] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.modal-icon.danger[b-814oxos9lf] {
    color:#b54d43;
    background:#fff0ee;
}

.modal-icon.follow[b-814oxos9lf] {
    color:#73569b;
    background:#f0eafb;
}

.modal-icon.campaign[b-814oxos9lf] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.selected-pet-summary[b-814oxos9lf],
.follow-up-case-summary[b-814oxos9lf] {
    display:grid;
    grid-template-columns:110px repeat(3,minmax(0,1fr));
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.selected-pet-summary > img[b-814oxos9lf],
.follow-up-case-summary > img[b-814oxos9lf] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.selected-pet-summary small[b-814oxos9lf],
.selected-pet-summary strong[b-814oxos9lf],
.selected-pet-summary span[b-814oxos9lf],
.follow-up-case-summary small[b-814oxos9lf],
.follow-up-case-summary strong[b-814oxos9lf],
.follow-up-case-summary span[b-814oxos9lf] {
    display:block;
}

.selected-pet-summary small[b-814oxos9lf],
.follow-up-case-summary small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.selected-pet-summary strong[b-814oxos9lf],
.follow-up-case-summary strong[b-814oxos9lf] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.selected-pet-summary span[b-814oxos9lf],
.follow-up-case-summary span[b-814oxos9lf] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.disease-summary[b-814oxos9lf] {
    border-color:rgba(181,77,67,.14);
    background:#fff8f7;
}

.document-upload-card[b-814oxos9lf] {
    max-width:540px;
    margin:20px auto 0;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 24px rgba(5,62,46,.05);
}

.document-upload-heading[b-814oxos9lf] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-814oxos9lf] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.document-upload-heading strong[b-814oxos9lf],
.document-upload-heading small[b-814oxos9lf] {
    display:block;
}

.document-upload-heading strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.document-upload-heading small[b-814oxos9lf] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-814oxos9lf] {
    height:210px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-814oxos9lf] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty strong[b-814oxos9lf],
.document-empty small[b-814oxos9lf] {
    font-size:.90rem;
}

.disease-upload-grid[b-814oxos9lf],
.campaign-upload-grid[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:20px;
}

.disease-upload-grid .document-upload-card[b-814oxos9lf],
.campaign-upload-grid .document-upload-card[b-814oxos9lf] {
    max-width:none;
    margin:0;
}

.follow-up-photo-card[b-814oxos9lf] {
    max-width:620px;
}

.zoonotic-warning[b-814oxos9lf] {
    margin-top:18px;
    font-size:.97rem !important;
}

.vaccination-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

.disease-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#b54d43,#8f342d) !important;
}

.follow-up-save-button[b-814oxos9lf] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.health-cover-panel[b-814oxos9lf] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.health-cover-photo[b-814oxos9lf] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.health-cover-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.health-cover-content small[b-814oxos9lf] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.health-cover-content h2[b-814oxos9lf] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.health-cover-content p[b-814oxos9lf] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.health-cover-meta[b-814oxos9lf] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.health-cover-meta span[b-814oxos9lf] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.health-emblem[b-814oxos9lf] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.health-emblem.watch[b-814oxos9lf] { color:#987634; border-color:#f2e6c9; }
.health-emblem.suspected[b-814oxos9lf] { color:#c56b2a; border-color:#f8ddc7; }
.health-emblem.quarantine[b-814oxos9lf] { color:#b54d43; border-color:#f4d7d3; }
.health-emblem.treating[b-814oxos9lf] { color:#73569b; border-color:#e8def4; }

.health-emblem .mud-icon-root[b-814oxos9lf] {
    font-size:2.4rem;
}

.health-emblem strong[b-814oxos9lf] {
    font-size:1.05rem;
    text-align:center;
}

.health-emblem small[b-814oxos9lf] {
    font-size:.90rem;
}

.pet-document-photo[b-814oxos9lf] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-814oxos9lf] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-814oxos9lf] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-disease-button[b-814oxos9lf] {
    color:#b54d43 !important;
    border-color:rgba(181,77,67,.28) !important;
}

.view-follow-button[b-814oxos9lf] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.disease-document-list[b-814oxos9lf] {
    display:grid;
    gap:10px;
    margin-top:14px;
}

.disease-document-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:1.5fr repeat(3,minmax(0,1fr));
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #987634;
    border-radius:13px;
    background:#f7fbf8;
}

.disease-document-card.quarantine[b-814oxos9lf] {
    border-left-color:#b54d43;
}

.disease-document-card.treating[b-814oxos9lf] {
    border-left-color:#73569b;
}

.disease-document-card.resolved[b-814oxos9lf] {
    border-left-color:var(--theme-primary);
}

.disease-document-card strong[b-814oxos9lf],
.disease-document-card span[b-814oxos9lf],
.disease-document-card small[b-814oxos9lf] {
    display:block;
}

.disease-document-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.disease-document-card span[b-814oxos9lf],
.disease-document-card small[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.record-card-list[b-814oxos9lf] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.record-card[b-814oxos9lf] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px;
    border-left:5px solid #2f789f;
    border-radius:14px;
    background:#f7fbf8;
}

.record-card > span[b-814oxos9lf] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:15px;
    color:#2f789f;
    background:#e8f3f8;
}

.record-card > div > div[b-814oxos9lf] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.record-card strong[b-814oxos9lf] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.record-card small[b-814oxos9lf],
.record-card p[b-814oxos9lf],
.record-card em[b-814oxos9lf] {
    color:#71837a;
    font-size:.90rem;
}

.record-card p[b-814oxos9lf] {
    margin:5px 0;
}

.record-card em[b-814oxos9lf] {
    color:#2f789f;
    font-style:normal;
}

.attachment-card.pet > span[b-814oxos9lf] { background:rgba(197,107,42,.92); }
.attachment-card.owner > span[b-814oxos9lf] { background:rgba(10,114,87,.92); }
.attachment-card.house > span[b-814oxos9lf] { background:rgba(77,124,104,.92); }
.attachment-card.vaccine > span[b-814oxos9lf] { background:rgba(47,120,159,.92); }
.attachment-card.chip > span[b-814oxos9lf] { background:rgba(115,86,155,.92); }
.attachment-card.disease > span[b-814oxos9lf] { background:rgba(181,77,67,.92); }
.attachment-card.medical > span[b-814oxos9lf] { background:rgba(115,86,155,.92); }
.attachment-card.result > span[b-814oxos9lf] { background:rgba(57,121,79,.92); }

/* LARGE TEXT */

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.vaccination-page[b-814oxos9lf]  .mud-input,
.vaccination-page[b-814oxos9lf]  .mud-select-input {
    font-size:1.07rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.vaccination-page[b-814oxos9lf]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.vaccination-page[b-814oxos9lf]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1550px) {
    .campaign-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .disease-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-814oxos9lf] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1100px) {
    .selected-pet-summary[b-814oxos9lf],
    .follow-up-case-summary[b-814oxos9lf] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .selected-pet-summary > div:last-child[b-814oxos9lf],
    .follow-up-case-summary > div:last-child[b-814oxos9lf] {
        grid-column:2 / -1;
    }

    .health-cover-panel[b-814oxos9lf] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .health-emblem[b-814oxos9lf] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .disease-document-card[b-814oxos9lf] {
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width:780px) {
    .status-overview[b-814oxos9lf],
    .disease-overview[b-814oxos9lf],
    .campaign-grid[b-814oxos9lf],
    .follow-grid[b-814oxos9lf],
    .health-metric-grid[b-814oxos9lf],
    .reference-grid[b-814oxos9lf],
    .measurement-document-grid[b-814oxos9lf],
    .selected-pet-summary[b-814oxos9lf],
    .follow-up-case-summary[b-814oxos9lf],
    .disease-upload-grid[b-814oxos9lf],
    .campaign-upload-grid[b-814oxos9lf],
    .record-card-list[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .campaign-heading[b-814oxos9lf] {
        flex-direction:column;
    }

    .health-cover-panel[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .health-cover-photo[b-814oxos9lf] {
        height:280px;
    }

    .disease-document-card[b-814oxos9lf] {
        grid-template-columns:minmax(0,1fr);
    }

    .vaccination-page[b-814oxos9lf]  .vaccination-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .vaccination-form-modal[b-814oxos9lf],
    .disease-form-modal[b-814oxos9lf],
    .follow-up-form-modal[b-814oxos9lf],
    .campaign-form-modal[b-814oxos9lf],
    .vaccination-view-modal[b-814oxos9lf] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #pet-health-print-area[b-814oxos9lf],
    #pet-health-print-area *[b-814oxos9lf] {
        visibility:visible !important;
    }

    #pet-health-print-area[b-814oxos9lf] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .vaccination-view-modal[b-814oxos9lf] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-814oxos9lf],
    .document-status-strip[b-814oxos9lf],
    .health-cover-panel[b-814oxos9lf],
    .document-section[b-814oxos9lf],
    .document-footer[b-814oxos9lf] {
        break-inside:avoid;
    }
}
/* /Components/Pages/02Specialized/07Pets/StrayAnimalReports.razor.rz.scp.css */
:root[b-mctvjw20ir] {
    --ha-green: var(--theme-primary);
    --ha-deep: var(--theme-dark);
    --ha-gold: var(--theme-accent);
    --ha-blue: #2f789f;
    --ha-purple: #73569b;
    --ha-red: #b54d43;
    --ha-orange: #c46a2b;
    --ha-text: var(--theme-ink);
    --ha-muted: var(--theme-muted);
    --ha-border: rgba(10,114,87,.10);
    --ha-shadow: 0 14px 35px rgba(5,62,46,.07);
}

.stray-page[b-mctvjw20ir] {
    min-height: 100vh;
    padding: 18px 0 34px;
    color: var(--ha-text);
    background:
        radial-gradient(circle at 0% 0%, rgba(10,114,87,.07), transparent 30rem),
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.06), transparent 24rem),
        var(--theme-bg);
    font-family: 'Kanit', sans-serif;
}

.stray-page[b-mctvjw20ir]  .stray-container {
    width: 100%;
    padding-inline: 18px !important;
}

/* HERO */

.stray-hero[b-mctvjw20ir] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) 270px;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(199,163,93,.29), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(72,166,113,.24), transparent 36%),
        linear-gradient(138deg, #155448 0%, #0a3c31 56%, #05271f 100%);
    box-shadow: 0 22px 55px rgba(5,62,46,.19);
}

.hero-pattern[b-mctvjw20ir] {
    position: absolute;
    inset: 0;
    opacity: .20;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-gold-line[b-mctvjw20ir] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(#f1d89b, #a87c32, #f1d89b);
}

.hero-content[b-mctvjw20ir],
.hero-action-panel[b-mctvjw20ir] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-mctvjw20ir] {
    display: inline-grid;
    grid-template-columns: 46px minmax(0,1fr);
    align-items: center;
    gap: 10px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.07);
}

.hero-badge > span[b-mctvjw20ir] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: #f2d999;
    background: rgba(242,217,153,.12);
}

.hero-badge div[b-mctvjw20ir] {
    display: flex;
    flex-direction: column;
}

.hero-badge small[b-mctvjw20ir] {
    color: #d8ede6;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.hero-badge strong[b-mctvjw20ir] {
    margin-top: 3px;
    font-size: .94rem;
}

.stray-hero h1[b-mctvjw20ir] {
    margin: 17px 0 0;
    font-size: clamp(1.45rem, 3vw, 2.35rem);
    line-height: 1.15;
}

.stray-hero p[b-mctvjw20ir] {
    max-width: 940px;
    margin: 10px 0 0;
    color: rgba(255,255,255,.79);
    font-size: .96rem;
    line-height: 1.85;
}

.hero-meta[b-mctvjw20ir] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 15px;
}

.hero-meta span[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
    color: rgba(255,255,255,.84);
    background: rgba(255,255,255,.06);
    font-size: .90rem;
    font-weight: 650;
}

.hero-action-panel[b-mctvjw20ir] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
}

.hero-status[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: 12px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.055);
}

.status-dot[b-mctvjw20ir] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #34d78b;
    box-shadow: 0 0 0 5px rgba(52,215,139,.12);
}

.hero-status div[b-mctvjw20ir] {
    display: flex;
    flex-direction: column;
}

.hero-status strong[b-mctvjw20ir] {
    font-size: .90rem;
}

.hero-status small[b-mctvjw20ir] {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: .90rem;
}

.stray-page[b-mctvjw20ir]  .hero-add-button,
.stray-page[b-mctvjw20ir]  .toolbar-add-button,
.stray-page[b-mctvjw20ir]  .save-button {
    color: #fff !important;
    background: linear-gradient(145deg,var(--theme-accent),#987634) !important;
    border-radius: 11px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.stray-page[b-mctvjw20ir]  .hero-add-button {
    min-height: 41px;
}

.hero-transaction-button[b-mctvjw20ir],
.hero-refresh-button[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.06);
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    text-decoration: none;
}

.hero-transaction-button[b-mctvjw20ir] {
    color: #f4dda6;
    border-color: rgba(242,217,153,.24);
    background: rgba(242,217,153,.08);
}

.hero-refresh-button[b-mctvjw20ir] {
    cursor: pointer;
}

.hero-refresh-button:disabled[b-mctvjw20ir] {
    opacity: .55;
    cursor: wait;
}

.stray-page[b-mctvjw20ir]  .page-loading {
    margin-top: 10px !important;
    border-radius: 999px;
}

.stray-page[b-mctvjw20ir]  .page-error {
    margin-top: 12px !important;
    font-family: 'Kanit',sans-serif;
}

/* SUMMARY */

.summary-grid[b-mctvjw20ir] {
    margin-top: 2px !important;
}

.summary-card[b-mctvjw20ir] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0,1fr);
    min-height: 116px;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background:
        radial-gradient(circle at 100% 0%, var(--soft), transparent 16rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.summary-card.system[b-mctvjw20ir] {
    --accent: var(--theme-primary);
    --soft: #e7f5ef;
    --border: rgba(10,114,87,.18);
}

.summary-card.actual[b-mctvjw20ir] {
    --accent: #2f789f;
    --soft: #e8f3f8;
    --border: rgba(47,120,159,.18);
}

.summary-card.difference[b-mctvjw20ir] {
    --accent: #b54d43;
    --soft: #fff0ee;
    --border: rgba(181,77,67,.18);
}

.summary-card.match[b-mctvjw20ir] {
    --accent: #987634;
    --soft: #fff4df;
    --border: rgba(152,118,52,.18);
}

.summary-line[b-mctvjw20ir] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--accent);
}

.summary-icon[b-mctvjw20ir] {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 16px;
    color: var(--accent);
    background: var(--soft);
}

.summary-card > div[b-mctvjw20ir] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.summary-card small[b-mctvjw20ir] {
    color: #788982;
    font-size: .90rem;
    font-weight: 650;
}

.summary-card p[b-mctvjw20ir] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin: 5px 0 0;
}

.summary-card p strong[b-mctvjw20ir] {
    color: var(--theme-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.summary-card p span[b-mctvjw20ir] {
    color: #798a83;
    font-size: .90rem;
}

.summary-card em[b-mctvjw20ir] {
    margin-top: 6px;
    color: var(--accent);
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

/* STATUS */

.status-overview[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: repeat(8,minmax(0,1fr));
    gap: 8px;
    margin-top: 14px;
}

.status-overview-card[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    min-height: 72px;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 13px;
    color: #44584f;
    background: #fff;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(5,62,46,.045);
    transition: .16s ease;
}

.status-overview-card:hover[b-mctvjw20ir],
.status-overview-card.selected[b-mctvjw20ir] {
    transform: translateY(-2px);
    border-color: rgba(10,114,87,.26);
    box-shadow: 0 12px 26px rgba(5,62,46,.09);
}

.status-overview-card.selected[b-mctvjw20ir] {
    background: #f5faf7;
}

.status-overview-card > span[b-mctvjw20ir] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: var(--theme-primary);
}

.status-overview-card.draft > span[b-mctvjw20ir] { background:#687872; }
.status-overview-card.reviewing > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.difference > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.approved > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.closed > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.voided > span[b-mctvjw20ir] { background:#687872; }
.status-overview-card.today > span[b-mctvjw20ir] { background:#73569b; }

.status-overview-card div[b-mctvjw20ir] {
    display: flex;
    flex-direction: column;
}

.status-overview-card small[b-mctvjw20ir] {
    color: var(--theme-muted);
    font-size: .90rem;
}

.status-overview-card strong[b-mctvjw20ir] {
    margin-top: 3px;
    color: var(--theme-ink);
    font-size: 1.02rem;
}

/* INSIGHT */

.insight-grid[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: minmax(0,1.3fr) minmax(320px,.7fr);
    gap: 14px;
    margin-top: 14px;
}

.insight-panel[b-mctvjw20ir] {
    padding: 15px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 18rem),
        #fff;
    box-shadow: var(--ha-shadow);
}

.insight-heading[b-mctvjw20ir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.insight-heading small[b-mctvjw20ir] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.insight-heading h2[b-mctvjw20ir] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.12rem;
}

.insight-heading > span[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e7f5ef;
    font-size: .90rem;
    font-weight: 700;
}

.variance-grid[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.variance-card[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr);
    min-height: 78px;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 12px;
    background: #f9fbfa;
    font-family: 'Kanit',sans-serif;
    text-align: left;
    cursor: pointer;
}

.variance-card > span[b-mctvjw20ir] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
}

.variance-card.cash > span[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.variance-card.bank > span[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.variance-card.unresolved > span[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.variance-card strong[b-mctvjw20ir] {
    display: block;
    color: #3c5047;
    font-size: .90rem;
}

.variance-card small[b-mctvjw20ir] {
    display: block;
    margin-top: 4px;
    color: var(--theme-muted);
    font-size: .90rem;
}

.closing-progress[b-mctvjw20ir] {
    margin-top: 13px;
}

.progress-track[b-mctvjw20ir] {
    height: 15px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2ef;
    box-shadow: inset 0 1px 3px rgba(5,62,46,.12);
}

.progress-track > span[b-mctvjw20ir] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#178466,#38b886);
}

.progress-metrics[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
}

.progress-metrics > div[b-mctvjw20ir] {
    min-height: 65px;
    padding: 9px;
    border: 1px solid rgba(10,114,87,.07);
    border-radius: 10px;
    background: #f9fbfa;
}

.progress-metrics small[b-mctvjw20ir] {
    display: block;
    color: #87958f;
    font-size: .90rem;
}

.progress-metrics strong[b-mctvjw20ir] {
    display: block;
    margin-top: 6px;
    color: #354940;
    font-size: .90rem;
}

/* FILTER & TABLE */

.filter-panel[b-mctvjw20ir],
.stray-list-panel[b-mctvjw20ir] {
    margin-top: 14px;
    border: 1px solid var(--ha-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--ha-shadow);
}

.filter-panel[b-mctvjw20ir] {
    padding: 15px;
}

.filter-heading[b-mctvjw20ir],
.list-toolbar[b-mctvjw20ir] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.filter-heading span[b-mctvjw20ir],
.panel-kicker[b-mctvjw20ir] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.filter-heading h2[b-mctvjw20ir],
.list-toolbar h2[b-mctvjw20ir] {
    margin: 3px 0 0;
    color: var(--theme-ink);
    font-size: 1.15rem;
}

.filter-heading p[b-mctvjw20ir],
.list-toolbar p[b-mctvjw20ir] {
    margin: 4px 0 0;
    color: #7c8d86;
    font-size: .90rem;
    line-height: 1.65;
}

.clear-filter-button[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 10px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-family: 'Kanit',sans-serif;
    font-size: .90rem;
    font-weight: 700;
    cursor: pointer;
}

.filter-grid[b-mctvjw20ir] {
    margin-top: 8px !important;
}

.stray-page[b-mctvjw20ir]  .premium-field,
.stray-page[b-mctvjw20ir]  .form-field {
    font-family: 'Kanit',sans-serif !important;
}

.stray-page[b-mctvjw20ir]  .search-button {
    min-height: 56px;
    color: #fff !important;
    background: linear-gradient(145deg,#178466,#0a5543) !important;
    border-radius: 10px !important;
    font-family: 'Kanit',sans-serif !important;
    font-size: .90rem !important;
    text-transform: none !important;
}

.filter-summary[b-mctvjw20ir] {
    display: flex;
    min-height: 56px;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(10,114,87,.08);
    border-radius: 11px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.filter-summary span[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-radius: 999px;
    color: #65766f;
    background: #fff;
    font-size: .90rem;
}

.filter-summary strong[b-mctvjw20ir] {
    color: var(--theme-primary);
}

.stray-list-panel[b-mctvjw20ir] {
    overflow: hidden;
}

.list-toolbar[b-mctvjw20ir] {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.07), transparent 16rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.stray-page[b-mctvjw20ir]  .toolbar-add-button {
    min-height: 39px;
}

.empty-state[b-mctvjw20ir] {
    display: flex;
    min-height: 330px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: var(--theme-muted);
}

.empty-state > span[b-mctvjw20ir] {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #e7f5ef;
}

.empty-state h3[b-mctvjw20ir] {
    margin: 5px 0 0;
    color: #40544b;
    font-size: 1.04rem;
}

.empty-state p[b-mctvjw20ir] {
    margin: 0;
    font-size: .90rem;
}

.stray-page[b-mctvjw20ir]  .stray-table {
    font-family: 'Kanit',sans-serif;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head {
    background: #f1f7f4;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding: 10px 8px;
    border-bottom: 1px solid rgba(10,114,87,.07);
    color: #465951;
    font-size: .90rem;
    vertical-align: middle;
}

.reconcile-code-photo-cell[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    min-width: 185px;
    align-items: center;
    gap: 8px;
}

.reconcile-photo-mini[b-mctvjw20ir] {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 12px;
    color: var(--theme-primary);
    background: #eaf6f1;
}

.reconcile-photo-mini button[b-mctvjw20ir] {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

.reconcile-photo-mini img[b-mctvjw20ir] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reconcile-code-photo-cell strong[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(10,114,87,.12);
    border-radius: 8px;
    color: var(--theme-primary);
    background: #edf7f3;
    font-size: .90rem;
    font-weight: 760;
    white-space: nowrap;
}

.reconcile-code-photo-cell small[b-mctvjw20ir] {
    display: block;
    margin-top: 4px;
    color: #987634;
    font-size: .90rem;
}

.date-shift-cell[b-mctvjw20ir],
.counter-cashier-cell[b-mctvjw20ir],
.money-cell[b-mctvjw20ir],
.difference-cell[b-mctvjw20ir],
.transaction-status-cell[b-mctvjw20ir] {
    display: flex;
    min-width: 128px;
    flex-direction: column;
}

.counter-cashier-cell[b-mctvjw20ir] {
    min-width: 175px;
}

.date-shift-cell strong[b-mctvjw20ir],
.counter-cashier-cell strong[b-mctvjw20ir],
.money-cell strong[b-mctvjw20ir],
.difference-cell strong[b-mctvjw20ir],
.transaction-status-cell strong[b-mctvjw20ir] {
    color: #3c5047;
    font-size: .90rem;
    line-height: 1.48;
}

.date-shift-cell small[b-mctvjw20ir],
.counter-cashier-cell small[b-mctvjw20ir],
.money-cell small[b-mctvjw20ir],
.difference-cell small[b-mctvjw20ir] {
    margin-top: 3px;
    color: #84928d;
    font-size: .90rem;
}

.date-shift-cell em[b-mctvjw20ir],
.counter-cashier-cell em[b-mctvjw20ir] {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-style: normal;
    font-weight: 650;
}

.money-cell.system strong[b-mctvjw20ir] { color:var(--theme-primary); }
.money-cell.actual strong[b-mctvjw20ir] { color:#2f789f; }

.difference-cell.matched strong[b-mctvjw20ir] { color:#34734b; }
.difference-cell.over strong[b-mctvjw20ir] { color:#987634; }
.difference-cell.short strong[b-mctvjw20ir] { color:#b54d43; }

.status-chip[b-mctvjw20ir],
.match-chip[b-mctvjw20ir] {
    display: inline-flex;
    width: fit-content;
    min-height: 23px;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: .90rem;
    font-weight: 700;
}

.status-chip i[b-mctvjw20ir] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.reviewing[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.difference[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.approved[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.closed[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.voided[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.match-chip.matched[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.match-chip.difference[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.transaction-status-cell[b-mctvjw20ir] {
    align-items: flex-start;
    gap: 5px;
}

.row-actions[b-mctvjw20ir] {
    display: flex;
    min-width: 184px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.stray-page[b-mctvjw20ir]  .row-action {
    width: 32px;
    height: 32px;
    border-radius: 9px !important;
}

.stray-page[b-mctvjw20ir]  .row-action.view {
    color:#2f789f !important;
    background:#edf6fb !important;
}

.stray-page[b-mctvjw20ir]  .row-action.edit {
    color:#987634 !important;
    background:#fff7e8 !important;
}

.stray-page[b-mctvjw20ir]  .row-action.print {
    color:#73569b !important;
    background:#f0eafb !important;
}

.stray-page[b-mctvjw20ir]  .row-action.delete {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-transaction-action[b-mctvjw20ir] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(10,114,87,.14);
    border-radius: 9px;
    color: var(--theme-primary);
    background: #edf7f3;
    text-decoration: none;
}

.pagination-bar[b-mctvjw20ir] {
    display: flex;
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid rgba(10,114,87,.08);
    color: #7c8d86;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .90rem;
}

/* MODALS */

.modal-backdrop[b-mctvjw20ir],
.image-preview-backdrop[b-mctvjw20ir] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(3,20,16,.74);
    backdrop-filter: blur(6px);
}

.report-form-modal[b-mctvjw20ir],
.stray-view-modal[b-mctvjw20ir],
.delete-modal[b-mctvjw20ir],
.image-preview-modal[b-mctvjw20ir] {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0,0,0,.34);
}

.modal-header[b-mctvjw20ir],
.view-toolbar[b-mctvjw20ir],
.image-preview-header[b-mctvjw20ir] {
    display: flex;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10,114,87,.08);
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.modal-heading[b-mctvjw20ir] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-mctvjw20ir] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg,#178466,#0a5543);
}

.modal-heading small[b-mctvjw20ir],
.view-toolbar small[b-mctvjw20ir],
.image-preview-header small[b-mctvjw20ir] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.modal-heading h2[b-mctvjw20ir],
.view-toolbar h2[b-mctvjw20ir],
.image-preview-header h3[b-mctvjw20ir] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.modal-heading p[b-mctvjw20ir] {
    margin:3px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.modal-body[b-mctvjw20ir],
.view-scroll[b-mctvjw20ir] {
    max-height: calc(100vh - 150px);
    overflow: auto;
    padding: 15px;
}

.view-scroll[b-mctvjw20ir] {
    background: #e9efec;
}

.modal-footer[b-mctvjw20ir] {
    display:flex;
    min-height:65px;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:10px 14px;
    border-top:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.stray-page[b-mctvjw20ir]  .cancel-button,
.stray-page[b-mctvjw20ir]  .save-button,
.stray-page[b-mctvjw20ir]  .delete-confirm-button {
    min-height:39px;
    border-radius:10px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.form-section-title[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin:16px 0 9px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.form-section-title.transaction-preview-title[b-mctvjw20ir] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.form-section-title > span[b-mctvjw20ir] {
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.form-section-title strong[b-mctvjw20ir] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.form-section-title small[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.open-transactions-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

/* FORM SOURCE */

.source-summary-panel[b-mctvjw20ir] {
    margin-top: 12px;
    padding: 13px;
    border: 1px solid rgba(47,120,159,.11);
    border-radius: 15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        #f6fbfd;
}

.source-summary-heading[b-mctvjw20ir],
.calculation-heading[b-mctvjw20ir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-summary-heading small[b-mctvjw20ir],
.calculation-heading small[b-mctvjw20ir] {
    color: #987634;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.source-summary-heading h3[b-mctvjw20ir],
.calculation-heading h3[b-mctvjw20ir] {
    margin: 3px 0 0;
    color: #354940;
    font-size: 1.05rem;
}

.source-summary-heading > span[b-mctvjw20ir],
.calculation-heading > span[b-mctvjw20ir] {
    display: inline-flex;
    min-height: 27px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #2f789f;
    background: #e8f3f8;
    font-size: .90rem;
    font-weight: 700;
}

.calculation-heading > span.matched[b-mctvjw20ir] {
    color:#34734b;
    background:#e7f5ec;
}

.calculation-heading > span.difference[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.source-summary-grid[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 8px;
    margin-top: 11px;
}

.source-summary-grid > div[b-mctvjw20ir] {
    min-height: 70px;
    padding: 9px;
    border: 1px solid rgba(47,120,159,.08);
    border-radius: 10px;
    background: #fff;
}

.source-summary-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.source-summary-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.system-amount-grid[b-mctvjw20ir] {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    gap: 8px;
}

.system-amount-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
}

.system-amount-card > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.system-amount-card.qr > span[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.system-amount-card.transfer > span[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.system-amount-card.card > span[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.system-amount-card.cheque > span[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.system-amount-card.other > span[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.system-amount-card.refund > span[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.system-amount-card small[b-mctvjw20ir] {
    display:block;
    color:#84928d;
    font-size:.90rem;
}

.system-amount-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.reconciliation-calculation-preview[b-mctvjw20ir] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(152,118,52,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(199,163,93,.12), transparent 18rem),
        #fffbf3;
}

.calculation-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.calculation-grid > div[b-mctvjw20ir] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(152,118,52,.08);
    border-radius:11px;
    background:#fff;
}

.calculation-grid > div.matched[b-mctvjw20ir] {
    border-color:rgba(10,114,87,.12);
    background:#f2faf6;
}

.calculation-grid > div.over[b-mctvjw20ir] {
    border-color:rgba(152,118,52,.12);
    background:#fff9ed;
}

.calculation-grid > div.short[b-mctvjw20ir] {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(145deg,#b54d43,#8f342e);
}

.calculation-grid span[b-mctvjw20ir] {
    display:block;
    color:#8b7b74;
    font-size:.90rem;
}

.calculation-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#3f5249;
    font-size:1.02rem;
}

.calculation-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:2px;
    color:#8a9791;
    font-size:.90rem;
}

.calculation-grid .short span[b-mctvjw20ir],
.calculation-grid .short strong[b-mctvjw20ir],
.calculation-grid .short small[b-mctvjw20ir] {
    color:#fff;
}

/* PHOTO UPLOAD */

.photo-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.photo-upload-card[b-mctvjw20ir] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
}

.photo-upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.photo-upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:11px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.photo-upload-heading strong[b-mctvjw20ir] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.photo-upload-heading small[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
}

.photo-preview[b-mctvjw20ir] {
    display:grid;
    min-height:170px;
    place-items:center;
    overflow:hidden;
    background:#edf3f0;
}

.photo-preview img[b-mctvjw20ir] {
    width:100%;
    height:170px;
    object-fit:cover;
}

.photo-empty[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#84928d;
}

.photo-empty strong[b-mctvjw20ir] {
    color:#40544b;
    font-size:.90rem;
}

.photo-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.photo-upload-actions[b-mctvjw20ir] {
    display:flex;
    gap:7px;
    padding:9px;
}

.file-picker-button[b-mctvjw20ir],
.remove-photo-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border-radius:9px;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    cursor:pointer;
}

.file-picker-button[b-mctvjw20ir] {
    position:relative;
    overflow:hidden;
    color:var(--theme-primary);
    border:1px solid rgba(10,114,87,.14);
    background:#edf7f3;
}

.file-picker-button input[b-mctvjw20ir] {
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}

.remove-photo-button[b-mctvjw20ir] {
    color:#b54d43;
    border:1px solid rgba(181,77,67,.14);
    background:#fff0ee;
}

/* SOURCE TRANSACTIONS */

.source-transaction-table[b-mctvjw20ir],
.detail-transaction-table[b-mctvjw20ir] {
    overflow-x:auto;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
}

.source-transaction-header[b-mctvjw20ir],
.source-transaction-row[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px 50px;
    min-width:850px;
    align-items:center;
}

.source-transaction-header[b-mctvjw20ir] {
    min-height:40px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.source-transaction-header span[b-mctvjw20ir],
.source-transaction-row > span[b-mctvjw20ir] {
    padding:7px;
    font-size:.90rem;
}

.source-transaction-row[b-mctvjw20ir] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
    background:#fff;
}

.source-transaction-row:last-child[b-mctvjw20ir] {
    border-bottom:0;
}

.mini-photo-button[b-mctvjw20ir] {
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:0;
    border-radius:8px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:zoom-in;
}

.source-transaction-empty[b-mctvjw20ir],
.source-transaction-more[b-mctvjw20ir] {
    padding:14px;
    color:#7c8d86;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size:.90rem;
    text-align:center;
}

.mock-rule-warning[b-mctvjw20ir] {
    margin-top:12px !important;
    font-family:'Kanit',sans-serif;
    font-size:.90rem !important;
}

/* VIEW & PRINT */

.stray-view-modal[b-mctvjw20ir] {
    width:min(1180px,calc(100vw - 28px));
}

.view-toolbar > div:last-child[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
}

.view-transaction-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:9px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.stray-page[b-mctvjw20ir]  .view-edit-button,
.stray-page[b-mctvjw20ir]  .view-print-button {
    min-height:36px;
    border-radius:9px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    text-transform:none !important;
}

.stray-page[b-mctvjw20ir]  .view-print-button {
    color:#fff !important;
    background:linear-gradient(145deg,#73569b,#523976) !important;
}

.print-stray-profile[b-mctvjw20ir] {
    width:min(900px,100%);
    margin:0 auto;
    padding:34px 38px;
    border:1px solid rgba(10,72,56,.12);
    border-radius:4px;
    color:#263c33;
    background:#fff;
    font-family:'Kanit',sans-serif;
    box-shadow:0 22px 55px rgba(5,62,46,.14);
}

.document-header[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr) 190px;
    align-items:center;
    gap:14px;
    padding-bottom:18px;
    border-bottom:3px double var(--theme-primary);
}

.municipal-seal[b-mctvjw20ir] {
    display:grid;
    width:78px;
    height:78px;
    place-items:center;
    border:3px solid var(--theme-primary);
    border-radius:50%;
    color:var(--theme-primary);
    background:#f3faf7;
}

.document-organization[b-mctvjw20ir] {
    text-align:center;
}

.document-organization small[b-mctvjw20ir] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.11em;
}

.document-organization h1[b-mctvjw20ir] {
    margin:5px 0 0;
    color:#173e35;
    font-size:1.50rem;
}

.document-organization p[b-mctvjw20ir] {
    margin:5px 0 0;
    color:#64766e;
    font-size:.90rem;
}

.document-number-box[b-mctvjw20ir] {
    padding:10px;
    border:1px solid rgba(10,114,87,.15);
    border-radius:10px;
    background:#f5faf8;
    text-align:center;
}

.document-number-box span[b-mctvjw20ir],
.document-number-box small[b-mctvjw20ir] {
    display:block;
    color:#778980;
    font-size:.90rem;
}

.document-number-box strong[b-mctvjw20ir] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
    word-break:break-word;
}

.document-status-strip[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(125px,.8fr) minmax(110px,.7fr) repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:center;
    margin-top:14px;
    padding:10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.document-status-strip > div[b-mctvjw20ir] {
    padding-left:9px;
    border-left:1px solid rgba(10,114,87,.10);
}

.document-status-strip > div span[b-mctvjw20ir] {
    display:block;
    color:#83918b;
    font-size:.90rem;
}

.document-status-strip > div strong[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#354940;
    font-size:.90rem;
}

.scope-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    gap:12px;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.scope-panel small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.scope-panel h2[b-mctvjw20ir] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.scope-panel p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
}

.scope-reference-box[b-mctvjw20ir] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.scope-reference-box span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.scope-reference-box strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#987634;
    font-size:.90rem;
}

.scope-reference-box small[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#2f789f;
}

.amount-comparison-section[b-mctvjw20ir],
.transaction-summary-section[b-mctvjw20ir],
.source-transaction-section[b-mctvjw20ir],
.review-section[b-mctvjw20ir] {
    margin-top:16px;
}

.section-title[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:8px;
    margin-bottom:10px;
}

.section-title > span[b-mctvjw20ir] {
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(145deg,#178466,#0a5543);
    font-size:.90rem;
    font-weight:800;
}

.section-title small[b-mctvjw20ir] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-title h3[b-mctvjw20ir] {
    margin:2px 0 0;
    color:var(--theme-ink);
    font-size:.98rem;
}

.comparison-table[b-mctvjw20ir] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:10px;
}

.comparison-header[b-mctvjw20ir],
.comparison-row[b-mctvjw20ir],
.comparison-total[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px 150px 150px;
    min-width:620px;
    align-items:center;
}

.comparison-header[b-mctvjw20ir] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.comparison-header span[b-mctvjw20ir],
.comparison-row span[b-mctvjw20ir],
.comparison-total span[b-mctvjw20ir] {
    padding:8px 9px;
    font-size:.90rem;
}

.comparison-row[b-mctvjw20ir] {
    min-height:48px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.comparison-row span:not(:first-child)[b-mctvjw20ir],
.comparison-total span:not(:first-child)[b-mctvjw20ir] {
    border-left:1px solid rgba(10,114,87,.06);
    text-align:right;
}

.comparison-total[b-mctvjw20ir] {
    min-height:48px;
    color:#173e35;
    background:#f1f7f4;
    font-weight:700;
}

.difference-text.matched[b-mctvjw20ir] { color:#34734b; }
.difference-text.over[b-mctvjw20ir] { color:#987634; }
.difference-text.short[b-mctvjw20ir] { color:#b54d43; }

.transaction-summary-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
}

.transaction-summary-grid article[b-mctvjw20ir] {
    min-height:86px;
    padding:11px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    background:#f9fbfa;
}

.transaction-summary-grid article.posted[b-mctvjw20ir] { background:#f2faf6; }
.transaction-summary-grid article.pending[b-mctvjw20ir] { background:#fff9ed; }
.transaction-summary-grid article.failed[b-mctvjw20ir] { background:#fff7f5; }
.transaction-summary-grid article.photo[b-mctvjw20ir] { background:#f4fafc; }

.transaction-summary-grid span[b-mctvjw20ir] {
    display:block;
    color:#84928c;
    font-size:.90rem;
}

.transaction-summary-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#354940;
    font-size:1.04rem;
}

.transaction-summary-grid small[b-mctvjw20ir] {
    display:block;
    color:#798a83;
    font-size:.90rem;
}

.detail-transaction-header[b-mctvjw20ir],
.detail-transaction-row[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:70px 190px minmax(180px,1fr) 130px 110px 100px;
    min-width:780px;
    align-items:center;
}

.detail-transaction-header[b-mctvjw20ir] {
    min-height:42px;
    color:#fff;
    background:linear-gradient(145deg,#17725a,#0a5543);
}

.detail-transaction-header span[b-mctvjw20ir],
.detail-transaction-row span[b-mctvjw20ir] {
    padding:8px 7px;
    font-size:.90rem;
}

.detail-transaction-row[b-mctvjw20ir] {
    min-height:50px;
    border-bottom:1px solid rgba(10,114,87,.07);
}

.review-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.review-grid > div[b-mctvjw20ir] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.review-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.review-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
}

.review-note-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:8px;
}

.review-note-grid > div[b-mctvjw20ir] {
    min-height:95px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.review-note-grid strong[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
}

.review-note-grid p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.document-footer[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 110px;
    gap:12px;
    align-items:center;
    margin-top:16px;
    padding-top:14px;
    border-top:3px double var(--theme-primary);
}

.document-footer strong[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.document-footer p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#62756c;
    font-size:.90rem;
    line-height:1.6;
}

.qr-placeholder[b-mctvjw20ir] {
    display:grid;
    min-height:90px;
    place-items:center;
    border:1px dashed rgba(10,114,87,.24);
    border-radius:9px;
    color:var(--theme-primary);
    background:#f5faf8;
}

.qr-placeholder span[b-mctvjw20ir] {
    font-size:.90rem;
    font-weight:700;
}

.mock-document-label[b-mctvjw20ir] {
    margin-top:12px;
    padding:6px;
    border-radius:7px;
    color:#ad4037;
    background:#fff0ee;
    font-size:.90rem;
    font-weight:700;
    text-align:center;
}

/* HISTORY & ATTACHMENT */

.history-panel[b-mctvjw20ir],
.attachment-panel[b-mctvjw20ir] {
    width:min(900px,100%);
    margin:14px auto 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#fff;
}

.section-heading[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 10px;
}

.section-heading small[b-mctvjw20ir] {
    color:#987634;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.section-heading h3[b-mctvjw20ir] {
    margin:3px 0 0;
    color:#34483f;
    font-size:1.03rem;
}

.section-heading > span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:700;
}

.history-list[b-mctvjw20ir] {
    display:grid;
    gap:7px;
}

.history-item[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.history-item > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.history-item > div > div[b-mctvjw20ir] {
    display:flex;
    justify-content:space-between;
    gap:8px;
}

.history-item strong[b-mctvjw20ir] {
    color:#3c5047;
    font-size:.90rem;
}

.history-item small[b-mctvjw20ir],
.history-item em[b-mctvjw20ir] {
    color:#84928d;
    font-size:.90rem;
    font-style:normal;
}

.history-item p[b-mctvjw20ir] {
    margin:4px 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.55;
}

.attachment-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.attachment-card[b-mctvjw20ir] {
    position:relative;
    min-height:145px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    background:#fff;
    cursor:zoom-in;
}

.attachment-card img[b-mctvjw20ir] {
    width:100%;
    height:145px;
    object-fit:cover;
}

.attachment-card > span[b-mctvjw20ir] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    backdrop-filter:blur(7px);
}

.attachment-card.cash-count > span[b-mctvjw20ir] { background:rgba(10,114,87,.89); }
.attachment-card.bank-statement > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.deposit-slip > span[b-mctvjw20ir] { background:rgba(152,118,52,.89); }
.attachment-card.approval > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.transaction > span[b-mctvjw20ir] { background:rgba(52,115,75,.89); }

.attachment-empty[b-mctvjw20ir] {
    grid-column:1 / -1;
    display:flex;
    min-height:180px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:1px dashed rgba(10,114,87,.18);
    border-radius:11px;
    color:#7c8d86;
}

/* IMAGE PREVIEW & DELETE */

.image-preview-modal[b-mctvjw20ir] {
    width:min(1120px,calc(100vw - 28px));
}

.image-preview-body[b-mctvjw20ir] {
    display:grid;
    min-height:420px;
    max-height:calc(100vh - 110px);
    overflow:auto;
    place-items:center;
    padding:12px;
    background:#edf2ef;
}

.image-preview-body img[b-mctvjw20ir] {
    display:block;
    max-width:100%;
    max-height:calc(100vh - 145px);
    border-radius:12px;
    object-fit:contain;
    box-shadow:0 18px 40px rgba(5,62,46,.16);
}

.delete-modal[b-mctvjw20ir] {
    width:min(470px,calc(100vw - 28px));
    padding:22px;
    text-align:center;
}

.delete-icon[b-mctvjw20ir] {
    display:grid;
    width:66px;
    height:66px;
    margin:0 auto;
    place-items:center;
    border-radius:20px;
    color:#b54d43;
    background:#fff0ee;
}

.delete-modal h2[b-mctvjw20ir] {
    margin:13px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.delete-modal p[b-mctvjw20ir] {
    margin:8px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.7;
}

.delete-modal p strong[b-mctvjw20ir] {
    color:#b54d43;
}

.delete-warning[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    gap:6px;
    margin-top:12px;
    padding:10px;
    border:1px solid rgba(181,77,67,.12);
    border-radius:10px;
    color:#9b5149;
    background:#fff7f5;
    font-size:.90rem;
    line-height:1.55;
    text-align:left;
}

.delete-actions[b-mctvjw20ir] {
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:15px;
}

.stray-page[b-mctvjw20ir]  .delete-confirm-button {
    color:#fff !important;
    background:linear-gradient(145deg,#c85b50,#963b34) !important;
}

/* RESPONSIVE */

@media (max-width: 1500px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .system-amount-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .photo-upload-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .insight-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-summary-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .calculation-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .attachment-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .stray-hero[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-action-panel[b-mctvjw20ir] {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hero-status[b-mctvjw20ir] {
        grid-column:1 / -1;
    }

    .document-header[b-mctvjw20ir] {
        grid-template-columns:70px minmax(0,1fr);
    }

    .document-number-box[b-mctvjw20ir] {
        grid-column:1 / -1;
    }

    .document-status-strip[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scope-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .stray-page[b-mctvjw20ir] {
        padding-top:10px;
    }

    .stray-page[b-mctvjw20ir]  .stray-container {
        padding-inline:10px !important;
    }

    .stray-hero[b-mctvjw20ir] {
        padding:18px 15px;
        border-radius:17px;
    }

    .filter-heading[b-mctvjw20ir],
    .list-toolbar[b-mctvjw20ir],
    .source-summary-heading[b-mctvjw20ir],
    .calculation-heading[b-mctvjw20ir],
    .view-toolbar[b-mctvjw20ir],
    .section-heading[b-mctvjw20ir] {
        align-items:flex-start;
        flex-direction:column;
    }

    .status-overview[b-mctvjw20ir],
    .variance-grid[b-mctvjw20ir],
    .progress-metrics[b-mctvjw20ir],
    .source-summary-grid[b-mctvjw20ir],
    .system-amount-grid[b-mctvjw20ir],
    .calculation-grid[b-mctvjw20ir],
    .photo-upload-grid[b-mctvjw20ir],
    .transaction-summary-grid[b-mctvjw20ir],
    .review-grid[b-mctvjw20ir],
    .review-note-grid[b-mctvjw20ir],
    .attachment-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.transaction-preview-title[b-mctvjw20ir] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .open-transactions-button[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
    }

    .view-toolbar > div:last-child[b-mctvjw20ir] {
        width:100%;
    }

    .print-stray-profile[b-mctvjw20ir] {
        padding:22px 18px;
    }

    .document-footer[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 560px) {
    .hero-action-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-status[b-mctvjw20ir] {
        grid-column:auto;
    }

    .status-overview[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .view-transaction-button[b-mctvjw20ir] {
        width:100%;
    }

    .document-header[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .municipal-seal[b-mctvjw20ir] {
        margin:0 auto;
    }
}

/* PRINT */

@media print {
    @page {
        size:A4 portrait;
        margin:10mm;
    }

    body *[b-mctvjw20ir] {
        visibility:hidden !important;
    }

    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .no-print[b-mctvjw20ir] {
        display:none !important;
    }

    .modal-backdrop[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir],
    .view-scroll[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        padding:0 !important;
        border:0 !important;
        background:#fff !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .scope-panel[b-mctvjw20ir],
    .amount-comparison-section[b-mctvjw20ir],
    .transaction-summary-section[b-mctvjw20ir],
    .source-transaction-section[b-mctvjw20ir],
    .review-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }

    .mock-document-label[b-mctvjw20ir] {
        border:1px solid #999;
        color:#555;
        background:#fff;
    }
}


/* HEALTH APPOINTMENT โ€” PREMIUM SPECIFIC */

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 4%, rgba(98,194,180,.24), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.24), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-accent-line[b-mctvjw20ir] {
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(#9ce0d0,#4ba997,#9ce0d0);
}

.stray-page[b-mctvjw20ir]  .hero-add-button,
.stray-page[b-mctvjw20ir]  .toolbar-add-button,
.stray-page[b-mctvjw20ir]  .save-button {
    color:#fff !important;
    background:linear-gradient(145deg,#2f9d87,var(--theme-primary)) !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-size:.90rem !important;
    font-weight:700 !important;
    text-transform:none !important;
}

.hero-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:11px;
    color:#d9f0e7;
    background:rgba(255,255,255,.07);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

.summary-card.today[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.upcoming[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.priority[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.completed[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview-card.requested > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.confirmed > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.checked-in > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.in-service > span[b-mctvjw20ir] { background:#c46a2b; }
.status-overview-card.completed > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.cancelled > span[b-mctvjw20ir] { background:#b54d43; }

.service-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.service-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    min-height:82px;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(5,62,46,.045);
    transition:.16s ease;
}

.service-overview-card:hover[b-mctvjw20ir],
.service-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 13px 27px rgba(5,62,46,.09);
}

.service-overview-card.selected[b-mctvjw20ir] {
    background:#f4faf7;
}

.service-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:50px;
    height:50px;
    place-items:center;
    border-radius:14px;
}

.service-overview-card.checkup > span[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.service-overview-card.vaccine > span[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.service-overview-card.dental > span[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.service-overview-card.mch > span[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.service-overview-card.elderly > span[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.service-overview-card.home > span[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }

.service-overview-card small[b-mctvjw20ir] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.service-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.focus-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}

.focus-grid button[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    min-height:72px;
    align-items:center;
    gap:8px;
    padding:9px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:#f9fbfa;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.focus-grid button > span[b-mctvjw20ir] {
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border-radius:12px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.focus-grid strong[b-mctvjw20ir] {
    display:block;
    color:#3c5047;
    font-size:.90rem;
}

.focus-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:var(--theme-muted);
    font-size:.90rem;
}

/* TABLE */

.citizen-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:185px;
    align-items:center;
    gap:8px;
}

.citizen-photo-mini[b-mctvjw20ir] {
    display:grid;
    width:52px;
    height:52px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.12);
    border-radius:14px;
    color:var(--theme-primary);
    background:#eaf6f1;
}

.citizen-photo-mini button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-photo-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.citizen-photo-cell small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#7e8f87;
    font-size:.90rem;
}

.appointment-time-cell[b-mctvjw20ir],
.service-unit-cell[b-mctvjw20ir],
.provider-location-cell[b-mctvjw20ir],
.queue-priority-cell[b-mctvjw20ir],
.reason-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:130px;
    flex-direction:column;
}

.provider-location-cell[b-mctvjw20ir],
.reason-cell[b-mctvjw20ir] {
    min-width:180px;
}

.appointment-time-cell strong[b-mctvjw20ir],
.service-unit-cell strong[b-mctvjw20ir],
.provider-location-cell strong[b-mctvjw20ir],
.queue-priority-cell strong[b-mctvjw20ir],
.reason-cell strong[b-mctvjw20ir] {
    color:#3c5047;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell small[b-mctvjw20ir],
.service-unit-cell small[b-mctvjw20ir],
.provider-location-cell small[b-mctvjw20ir],
.queue-priority-cell small[b-mctvjw20ir],
.reason-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:3px;
    color:#84928d;
    font-size:.90rem;
    line-height:1.5;
}

.appointment-time-cell em[b-mctvjw20ir],
.provider-location-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:21px;
    align-items:center;
    margin-top:5px;
    padding:0 7px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:650;
}

.service-chip[b-mctvjw20ir],
.priority-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:23px;
    align-items:center;
    gap:5px;
    padding:0 7px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.service-unit-cell .service-chip[b-mctvjw20ir] {
    margin-bottom:5px;
}

.service-chip.general-checkup[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.service-chip.vaccination[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.service-chip.dental[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.service-chip.maternal-child[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.service-chip.elderly-screening[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.service-chip.chronic-disease[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.service-chip.physiotherapy[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.service-chip.home-visit[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.service-chip.mental-health[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.service-chip.nutrition[b-mctvjw20ir] { color:#987634; background:#fff4df; }

.priority-chip[b-mctvjw20ir] {
    margin-top:5px;
}

.priority-chip.normal[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.priority-chip.elderly[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.priority-chip.disabled[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.priority-chip.pregnant[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.priority-chip.urgent[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.status-chip.requested[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.confirmed[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.checked-in[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.in-service[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.status-chip.completed[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.no-show[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.rescheduled[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }

.status-cell[b-mctvjw20ir] {
    align-items:flex-start;
    gap:5px;
}

/* CITIZEN SOURCE */

.citizen-source-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
    margin:12px 0 16px;
    padding:12px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.citizen-source-photo[b-mctvjw20ir] {
    display:grid;
    min-height:205px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:#eaf3ef;
}

.citizen-source-photo button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.citizen-source-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.citizen-source-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.citizen-source-heading small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.citizen-source-heading h3[b-mctvjw20ir] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.citizen-source-heading p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#7c8d86;
    font-size:.90rem;
}

.identity-chip[b-mctvjw20ir] {
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:700;
}

.identity-chip.verified[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.identity-chip.review[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.identity-chip.pending[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.identity-chip.rejected[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.identity-chip.expired[b-mctvjw20ir],
.identity-chip.not-found[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.citizen-source-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
    margin-top:11px;
}

.citizen-source-grid > div[b-mctvjw20ir] {
    min-height:64px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:10px;
    background:#fff;
}

.citizen-source-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.citizen-source-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.citizen-address[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    gap:5px;
    margin-top:8px;
    color:#6d7f77;
    font-size:.90rem;
}

.citizen-source-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:9px;
}

.citizen-source-actions button[b-mctvjw20ir],
.citizen-source-actions a[b-mctvjw20ir] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 8px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:8px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* PREVIEW & CONSENT */

.appointment-preview[b-mctvjw20ir] {
    margin:14px 0 17px;
    padding:14px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:15px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.10), transparent 18rem),
        #f6fbfd;
}

.preview-heading[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.preview-heading small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.08em;
}

.preview-heading h3[b-mctvjw20ir] {
    margin:3px 0 0;
    color:#354940;
    font-size:1.05rem;
}

.preview-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.preview-grid > div[b-mctvjw20ir] {
    min-height:76px;
    padding:10px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:11px;
    background:#fff;
}

.preview-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.preview-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:#354940;
    font-size:.90rem;
}

.consent-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:11px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* SOURCE PHOTOS */

.form-section-title.source-photo-title[b-mctvjw20ir] {
    grid-template-columns:40px minmax(0,1fr) auto;
}

.source-photo-count[b-mctvjw20ir] {
    display:inline-flex !important;
    width:auto !important;
    min-width:72px;
    height:30px !important;
    padding:0 8px;
    border-radius:999px !important;
    color:#2f789f !important;
    background:#e8f3f8 !important;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.source-photo-card[b-mctvjw20ir] {
    position:relative;
    min-height:190px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.09);
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-card img[b-mctvjw20ir] {
    width:100%;
    height:190px;
    object-fit:cover;
}

.source-photo-card > span[b-mctvjw20ir] {
    position:absolute;
    inset:auto 7px 7px 7px;
    display:inline-flex;
    min-height:27px;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#fff;
    background:rgba(5,50,40,.83);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
}

.source-photo-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.89); }
.source-photo-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }

/* PRINT APPOINTMENT */

.patient-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:105px minmax(0,1fr) 220px;
    gap:12px;
    align-items:center;
    margin-top:14px;
    padding:13px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:11px;
    background:#f5fafc;
}

.patient-photo[b-mctvjw20ir] {
    width:100px;
    height:100px;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:22px;
    box-shadow:0 8px 18px rgba(5,62,46,.12);
}

.patient-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.patient-content small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:700;
    letter-spacing:.06em;
}

.patient-content h2[b-mctvjw20ir] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.10rem;
}

.patient-content p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#6f8078;
    font-size:.90rem;
    line-height:1.5;
}

.identity-box[b-mctvjw20ir] {
    padding:11px;
    border-radius:10px;
    background:#fff;
}

.identity-box span[b-mctvjw20ir],
.identity-box small[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.identity-box strong[b-mctvjw20ir] {
    display:block;
    margin:5px 0;
    color:var(--theme-primary);
    font-size:.90rem;
}

.service-section[b-mctvjw20ir],
.reason-section[b-mctvjw20ir],
.reminder-section[b-mctvjw20ir] {
    margin-top:16px;
}

.reference-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.reference-grid > div[b-mctvjw20ir] {
    min-height:67px;
    padding:9px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:9px;
    background:#f9fbfa;
}

.reference-grid span[b-mctvjw20ir],
.timeline-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.reference-grid strong[b-mctvjw20ir],
.timeline-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#354940;
    font-size:.90rem;
    word-break:break-word;
}

.note-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
}

.note-grid > div[b-mctvjw20ir] {
    min-height:115px;
    padding:10px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:9px;
    background:#f4fafc;
}

.note-grid span[b-mctvjw20ir] {
    display:block;
    color:#87958f;
    font-size:.90rem;
}

.note-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.note-grid p[b-mctvjw20ir] {
    margin:5px 0 0;
    color:#5e7068;
    font-size:.90rem;
    line-height:1.6;
}

.timeline-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.timeline-grid > div[b-mctvjw20ir] {
    min-height:82px;
    padding:10px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.timeline-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#84928d;
    font-size:.90rem;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mctvjw20ir] { background:rgba(52,115,75,.89); }
.attachment-card.appointment > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.other > span[b-mctvjw20ir] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .service-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .citizen-source-grid[b-mctvjw20ir],
    .preview-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .citizen-source-panel[b-mctvjw20ir] {
        grid-template-columns:180px minmax(0,1fr);
    }

    .patient-panel[b-mctvjw20ir] {
        grid-template-columns:90px minmax(0,1fr);
    }

    .identity-box[b-mctvjw20ir] {
        grid-column:1 / -1;
    }

    .reference-grid[b-mctvjw20ir],
    .timeline-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .service-overview[b-mctvjw20ir],
    .focus-grid[b-mctvjw20ir],
    .citizen-source-grid[b-mctvjw20ir],
    .preview-grid[b-mctvjw20ir],
    .consent-grid[b-mctvjw20ir],
    .source-photo-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .note-grid[b-mctvjw20ir],
    .timeline-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .citizen-source-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .form-section-title.source-photo-title[b-mctvjw20ir] {
        grid-template-columns:40px minmax(0,1fr);
    }

    .source-photo-count[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100% !important;
    }

    .patient-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
        text-align:center;
    }

    .patient-photo[b-mctvjw20ir] {
        margin:0 auto;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .service-section[b-mctvjw20ir],
    .reason-section[b-mctvjw20ir],
    .reminder-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   LARGE READABLE TEXT UPDATE
   เธ›เธฃเธฑเธšเธชเธณเธซเธฃเธฑเธšเธˆเธญ Desktop / Tablet เนƒเธซเน‰เธ•เธฑเธงเธญเธฑเธเธฉเธฃเธญเนˆเธฒเธ™เธ‡เนˆเธฒเธขเธ‚เธถเน‰เธ™
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size: 16px;
    line-height: 1.55;
}

.stray-page[b-mctvjw20ir]  .mud-typography,
.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-input-label,
.stray-page[b-mctvjw20ir]  .mud-select,
.stray-page[b-mctvjw20ir]  .mud-list-item-text,
.stray-page[b-mctvjw20ir]  .mud-button-label,
.stray-page[b-mctvjw20ir]  .mud-table-cell,
.stray-page[b-mctvjw20ir]  .mud-checkbox label {
    font-family: 'Kanit', sans-serif !important;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size: .92rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size: .90rem !important;
    font-weight: 600 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size: .90rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size: .90rem !important;
    font-weight: 700 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding: 15px 12px !important;
    font-size: .90rem !important;
    line-height: 1.55 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height: 54px;
    color: #26463c;
    font-size: .90rem !important;
    font-weight: 800 !important;
    white-space: nowrap;
}

.summary-card[b-mctvjw20ir] {
    min-height: 138px;
    grid-template-columns: 66px minmax(0,1fr);
    padding: 19px;
}

.summary-icon[b-mctvjw20ir] {
    width: 66px;
    height: 66px;
    border-radius: 18px;
}

.status-overview-card[b-mctvjw20ir] {
    min-height: 88px;
    grid-template-columns: 50px minmax(0,1fr);
    padding: 12px;
}

.status-overview-card > span[b-mctvjw20ir] {
    width: 50px;
    height: 50px;
}

.service-overview-card[b-mctvjw20ir] {
    min-height: 96px;
    grid-template-columns: 58px minmax(0,1fr);
    padding: 13px;
}

.service-overview-card > span[b-mctvjw20ir] {
    width: 58px;
    height: 58px;
}

.focus-grid button[b-mctvjw20ir] {
    min-height: 88px;
    grid-template-columns: 54px minmax(0,1fr);
    padding: 12px;
}

.focus-grid button > span[b-mctvjw20ir] {
    width: 54px;
    height: 54px;
}

.filter-panel[b-mctvjw20ir],
.stray-list-panel[b-mctvjw20ir],
.insight-panel[b-mctvjw20ir] {
    border-radius: 20px;
}

.filter-panel[b-mctvjw20ir] {
    padding: 20px;
}

.list-toolbar[b-mctvjw20ir] {
    padding: 19px 20px;
}

.filter-heading p[b-mctvjw20ir],
.list-toolbar p[b-mctvjw20ir] {
    max-width: 980px;
    line-height: 1.75;
}

.citizen-photo-cell[b-mctvjw20ir] {
    grid-template-columns: 62px minmax(0,1fr);
    min-width: 215px;
    gap: 11px;
}

.citizen-photo-mini[b-mctvjw20ir] {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}

.appointment-time-cell[b-mctvjw20ir],
.service-unit-cell[b-mctvjw20ir],
.provider-location-cell[b-mctvjw20ir],
.queue-priority-cell[b-mctvjw20ir],
.reason-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    min-width: 155px;
}

.provider-location-cell[b-mctvjw20ir],
.reason-cell[b-mctvjw20ir] {
    min-width: 215px;
}

.service-chip[b-mctvjw20ir],
.priority-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.identity-chip[b-mctvjw20ir] {
    min-height: 30px;
    padding: 0 10px;
    line-height: 1.25;
}

.row-actions[b-mctvjw20ir] {
    min-width: 205px;
    gap: 7px;
}

.stray-page[b-mctvjw20ir]  .row-action {
    width: 38px;
    height: 38px;
    border-radius: 11px !important;
}

.pagination-bar[b-mctvjw20ir] {
    min-height: 72px;
    padding: 13px 18px;
}

.modal-header[b-mctvjw20ir],
.view-toolbar[b-mctvjw20ir],
.image-preview-header[b-mctvjw20ir] {
    min-height: 82px;
    padding: 14px 19px;
}

.modal-body[b-mctvjw20ir],
.view-scroll[b-mctvjw20ir] {
    padding: 20px;
}

.modal-footer[b-mctvjw20ir] {
    min-height: 76px;
    padding: 13px 18px;
}

.form-section-title[b-mctvjw20ir] {
    min-height: 65px;
    padding: 12px;
    margin: 20px 0 12px;
}

.form-section-title > span[b-mctvjw20ir] {
    width: 46px;
    height: 46px;
}

.citizen-source-grid > div[b-mctvjw20ir],
.preview-grid > div[b-mctvjw20ir],
.reference-grid > div[b-mctvjw20ir],
.timeline-grid > div[b-mctvjw20ir] {
    min-height: 82px;
    padding: 12px;
}

.photo-upload-heading[b-mctvjw20ir] {
    padding: 13px;
}

.photo-preview[b-mctvjw20ir] {
    min-height: 200px;
}

.photo-preview img[b-mctvjw20ir] {
    height: 200px;
}

.history-item[b-mctvjw20ir] {
    padding: 12px;
}

.attachment-card[b-mctvjw20ir],
.attachment-card img[b-mctvjw20ir] {
    min-height: 175px;
    height: 175px;
}

/* เธ›เธฃเธฑเธšเน€เธ‰เธžเธฒเธฐเธˆเธญเน€เธฅเน‡เธ เน„เธกเนˆเนƒเธซเน‰เนƒเธซเธเนˆเธˆเธ™เธฅเน‰เธ™ */
@media (max-width: 780px) {
    .stray-page[b-mctvjw20ir] {
        font-size: 15px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding: 12px 10px !important;
        font-size: .90rem !important;
    }

    .summary-card[b-mctvjw20ir] {
        min-height: 122px;
    }

    .status-overview-card[b-mctvjw20ir],
    .service-overview-card[b-mctvjw20ir] {
        min-height: 82px;
    }

    .modal-body[b-mctvjw20ir],
    .view-scroll[b-mctvjw20ir] {
        padding: 13px;
    }
}

/* เธ‚เธ™เธฒเธ”เน€เธญเธเธชเธฒเธฃเธžเธดเธกเธžเนŒเนƒเธซเน‰เธขเธฑเธ‡เธญเนˆเธฒเธ™เธ‡เนˆเธฒเธข เนเธ•เนˆเน„เธกเนˆเธฅเน‰เธ™ A4 */
@media print {
    #stray-report-print-area[b-mctvjw20ir] {
        font-size: 10.5pt !important;
        line-height: 1.45 !important;
    }

    #stray-report-print-area h1[b-mctvjw20ir] {
        font-size: 18pt !important;
    }

    #stray-report-print-area h2[b-mctvjw20ir] {
        font-size: 14pt !important;
    }

    #stray-report-print-area h3[b-mctvjw20ir] {
        font-size: 12pt !important;
    }
}


/* =========================================================
   HEALTH SERVICE HISTORY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 4%, rgba(104,202,180,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.completed[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.follow-up[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.satisfaction[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.completed > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.follow-up > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.referred > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.cancelled > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.month > span[b-mctvjw20ir] { background:#73569b; }

.service-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.service-overview-card.chronic > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.service-overview-card.rehab > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.care-metrics[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mctvjw20ir] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.care-metrics small[b-mctvjw20ir] {
    display:block;
    color:#7c8d86;
    font-size:.90rem;
}

.care-metrics strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.25rem;
}

/* TABLE CELLS */

.history-date-cell[b-mctvjw20ir],
.service-unit-cell[b-mctvjw20ir],
.provider-location-cell[b-mctvjw20ir],
.result-cell[b-mctvjw20ir],
.follow-score-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.provider-location-cell[b-mctvjw20ir],
.result-cell[b-mctvjw20ir] {
    min-width:230px;
}

.history-date-cell strong[b-mctvjw20ir],
.service-unit-cell strong[b-mctvjw20ir],
.provider-location-cell strong[b-mctvjw20ir],
.result-cell strong[b-mctvjw20ir],
.follow-score-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:700;
    line-height:1.55;
}

.history-date-cell small[b-mctvjw20ir],
.service-unit-cell small[b-mctvjw20ir],
.provider-location-cell small[b-mctvjw20ir],
.result-cell small[b-mctvjw20ir],
.follow-score-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.history-date-cell em[b-mctvjw20ir],
.provider-location-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:27px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.follow-score-cell > span[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    gap:5px;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#987634;
    background:#fff4df;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.completed[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mctvjw20ir] {
    display:inline-grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE APPOINTMENT */

.source-appointment-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-citizen-photo[b-mctvjw20ir] {
    display:grid;
    min-height:220px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#eaf3ef;
}

.source-citizen-photo button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-citizen-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mctvjw20ir] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-heading p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mctvjw20ir] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mctvjw20ir] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mctvjw20ir],
.source-actions button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

/* CONSENT & PHOTOS */

.consent-box[b-mctvjw20ir] {
    margin:14px 0;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-photo-grid[b-mctvjw20ir] {
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:14px;
}

.source-photo-card[b-mctvjw20ir] {
    min-height:180px;
}

.source-photo-card img[b-mctvjw20ir] {
    height:180px;
}

/* PRINT DOCUMENT */

.document-section[b-mctvjw20ir] {
    margin-top:18px;
}

.vital-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px;
}

.vital-grid > div[b-mctvjw20ir],
.quality-grid > div[b-mctvjw20ir],
.follow-up-grid > div[b-mctvjw20ir] {
    min-height:78px;
    padding:11px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mctvjw20ir],
.quality-grid span[b-mctvjw20ir],
.follow-up-grid span[b-mctvjw20ir] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-mctvjw20ir],
.quality-grid strong[b-mctvjw20ir],
.follow-up-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.vital-summary[b-mctvjw20ir] {
    margin-top:9px;
    padding:11px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:10px;
    color:#40544b;
    background:#f4fafc;
    font-size:.90rem;
    line-height:1.65;
}

.follow-up-grid[b-mctvjw20ir],
.quality-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

/* MODAL LARGE READABILITY */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.55 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:.94rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.90rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:.92rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.referral > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.health-record > span[b-mctvjw20ir] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mctvjw20ir] { background:rgba(152,118,52,.89); }
.attachment-card.other > span[b-mctvjw20ir] { background:rgba(104,120,114,.89); }

.view-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:700;
    text-decoration:none;
}

@media (max-width: 1450px) {
    .status-overview[b-mctvjw20ir],
    .service-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mctvjw20ir],
    .vital-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 1050px) {
    .source-appointment-panel[b-mctvjw20ir] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .follow-up-grid[b-mctvjw20ir],
    .quality-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 780px) {
    .status-overview[b-mctvjw20ir],
    .service-overview[b-mctvjw20ir],
    .care-metrics[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .source-photo-grid[b-mctvjw20ir],
    .vital-grid[b-mctvjw20ir],
    .follow-up-grid[b-mctvjw20ir],
    .quality-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-appointment-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   ELDERLY CARE โ€” PREMIUM LARGE READABLE TEXT
   ========================================================= */

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 4%, rgba(218,190,112,.25), transparent 30%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.20), transparent 36%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.risk[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.dependency[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.follow-up[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.follow-up > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.referred > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.overdue > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.inactive > span[b-mctvjw20ir] { background:#687872; }

.risk-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.risk-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:96px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:16px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.risk-overview-card:hover[b-mctvjw20ir],
.risk-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.25);
    box-shadow:0 15px 30px rgba(5,62,46,.10);
}

.risk-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.risk-overview-card.low > span[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.risk-overview-card.medium > span[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.risk-overview-card.high > span[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.risk-overview-card.critical > span[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.risk-overview-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.risk-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.dependency-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.dependency-grid button[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    min-height:88px;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.dependency-grid button > span[b-mctvjw20ir] {
    display:grid;
    width:54px;
    height:54px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.dependency-grid strong[b-mctvjw20ir],
.care-metrics strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.dependency-grid small[b-mctvjw20ir],
.care-metrics small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.care-metrics[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.care-metrics > div[b-mctvjw20ir] {
    min-height:88px;
    padding:14px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

/* TABLE */

.register-age-cell[b-mctvjw20ir],
.risk-adl-cell[b-mctvjw20ir],
.dependency-living-cell[b-mctvjw20ir],
.caregiver-cell[b-mctvjw20ir],
.follow-up-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:165px;
    flex-direction:column;
}

.caregiver-cell[b-mctvjw20ir] {
    min-width:190px;
}

.register-age-cell strong[b-mctvjw20ir],
.risk-adl-cell strong[b-mctvjw20ir],
.dependency-living-cell strong[b-mctvjw20ir],
.caregiver-cell strong[b-mctvjw20ir],
.follow-up-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.90rem;
    font-weight:750;
    line-height:1.55;
}

.register-age-cell small[b-mctvjw20ir],
.risk-adl-cell small[b-mctvjw20ir],
.dependency-living-cell small[b-mctvjw20ir],
.caregiver-cell small[b-mctvjw20ir],
.follow-up-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:5px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.55;
}

.register-age-cell em[b-mctvjw20ir],
.caregiver-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:28px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:700;
}

.risk-chip[b-mctvjw20ir],
.dependency-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.identity-chip[b-mctvjw20ir],
.overdue-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    gap:5px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.risk-chip.low[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.risk-chip.medium[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.risk-chip.high[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.risk-chip.critical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.dependency-chip.independent[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.dependency-chip.partial[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.dependency-chip.homebound[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.dependency-chip.bedridden[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.active[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.inactive[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.overdue-chip[b-mctvjw20ir] {
    margin-top:7px;
    color:#b54d43;
    background:#fff0ee;
}

.row-source-action[b-mctvjw20ir] {
    display:inline-grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:16px;
    margin:14px 0 20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.08), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mctvjw20ir] {
    display:grid;
    min-height:230px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mctvjw20ir] {
    margin:5px 0 0;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.source-heading p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:14px;
}

.source-data-grid > div[b-mctvjw20ir] {
    min-height:84px;
    padding:12px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:12px;
    background:#fff;
}

.source-data-grid span[b-mctvjw20ir] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin-top:10px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.6;
}

.source-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.source-actions a[b-mctvjw20ir],
.source-actions button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
    cursor:pointer;
}

/* ASSESSMENT PREVIEW */

.assessment-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:15px 0 20px;
    padding:14px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:16px;
    background:#f5fafc;
}

.assessment-preview > div[b-mctvjw20ir] {
    min-height:100px;
    padding:14px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:13px;
    background:#fff;
}

.assessment-preview small[b-mctvjw20ir] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.assessment-preview strong[b-mctvjw20ir] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.12rem;
}

.assessment-preview span[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

/* PRINT */

.assessment-grid[b-mctvjw20ir],
.reference-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.assessment-grid > div[b-mctvjw20ir],
.reference-grid > div[b-mctvjw20ir],
.care-plan-grid > div[b-mctvjw20ir] {
    min-height:80px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.assessment-grid span[b-mctvjw20ir],
.reference-grid span[b-mctvjw20ir],
.care-plan-grid span[b-mctvjw20ir] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.assessment-grid strong[b-mctvjw20ir],
.reference-grid strong[b-mctvjw20ir],
.care-plan-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.55;
}

.care-plan-main[b-mctvjw20ir] {
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f4faf7;
    font-size:.90rem;
    line-height:1.7;
}

.care-plan-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:9px;
}

/* LARGE TEXT FOR MUDBLAZOR */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:16px 13px !important;
    font-size:.90rem !important;
    line-height:1.58 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:58px;
    color:#26463c;
    font-size:.90rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:.96rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.92rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:.94rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.90rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.89); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.home > span[b-mctvjw20ir] { background:rgba(52,115,75,.89); }
.attachment-card.caregiver > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.visit > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.assessment > span[b-mctvjw20ir] { background:rgba(152,118,52,.89); }
.attachment-card.health > span[b-mctvjw20ir] { background:rgba(52,115,75,.89); }
.attachment-card.service > span[b-mctvjw20ir] { background:rgba(47,120,159,.89); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(115,86,155,.89); }
.attachment-card.appointment > span[b-mctvjw20ir] { background:rgba(152,118,52,.89); }

@media (max-width: 1450px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .risk-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .source-data-grid[b-mctvjw20ir],
    .assessment-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:190px minmax(0,1fr);
    }

    .assessment-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mctvjw20ir],
    .risk-overview[b-mctvjw20ir],
    .dependency-grid[b-mctvjw20ir],
    .care-metrics[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .assessment-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .care-plan-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:13px 10px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.5pt !important;
        line-height:1.45 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   HOME VISIT & COMMUNITY HEALTH โ€” LARGE PREMIUM TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:16.5px;
    line-height:1.62;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 4%, rgba(102,196,171,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.today[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.field[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-mctvjw20ir] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.follow[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.planned > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.field > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.completed > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.follow-up > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.referred > span[b-mctvjw20ir] { background:#b55b82; }

.visit-type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.visit-type-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
    transition:.18s ease;
}

.visit-type-overview-card:hover[b-mctvjw20ir],
.visit-type-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.28);
    box-shadow:0 16px 32px rgba(5,62,46,.10);
}

.visit-type-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.visit-type-overview-card.home > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.visit-type-overview-card.elderly > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.visit-type-overview-card.disabled > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.visit-type-overview-card.chronic > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.visit-type-overview-card.community > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.visit-type-overview-card.vaccine > span[b-mctvjw20ir] {
    color:#34734b;
    background:#e7f5ec;
}

.visit-type-overview-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.visit-type-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.target-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-grid button[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:92px;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.target-grid button > span[b-mctvjw20ir] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-grid strong[b-mctvjw20ir],
.care-metrics strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
}

.target-grid small[b-mctvjw20ir],
.care-metrics small[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE */

.visit-date-cell[b-mctvjw20ir],
.visit-type-cell[b-mctvjw20ir],
.team-location-cell[b-mctvjw20ir],
.result-cell[b-mctvjw20ir],
.follow-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.team-location-cell[b-mctvjw20ir],
.result-cell[b-mctvjw20ir] {
    min-width:230px;
}

.visit-date-cell strong[b-mctvjw20ir],
.visit-type-cell strong[b-mctvjw20ir],
.team-location-cell strong[b-mctvjw20ir],
.result-cell strong[b-mctvjw20ir],
.follow-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.91rem;
    font-weight:750;
    line-height:1.58;
}

.visit-date-cell small[b-mctvjw20ir],
.visit-type-cell small[b-mctvjw20ir],
.team-location-cell small[b-mctvjw20ir],
.result-cell small[b-mctvjw20ir],
.follow-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.58;
}

.visit-date-cell em[b-mctvjw20ir],
.team-location-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:30px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.visit-type-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.identity-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:33px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.visit-type-chip.home-health[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.visit-type-chip.elderly-followup[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.visit-type-chip.disabled-support[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.visit-type-chip.chronic-disease[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.visit-type-chip.maternal-child[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.visit-type-chip.vaccination-outreach[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.visit-type-chip.rehabilitation[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.mental-health[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.visit-type-chip.community-screening[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.visit-type-chip.health-education[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.visit-type-chip.environmental-health[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.planned[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.assigned[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.en-route[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.completed[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.follow-up[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.referred[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.priority-text[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:4px 9px;
    border-radius:999px;
    font-weight:750;
}

.priority-text.normal[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.priority-text.priority[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.priority-text.urgent[b-mctvjw20ir] { color:#c46a2b; background:#fff2e7; }
.priority-text.critical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.row-source-action[b-mctvjw20ir] {
    display:inline-grid;
    width:41px;
    height:41px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* SOURCE PROFILE */

.source-profile-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:17px;
    margin:15px 0 21px;
    padding:16px;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(47,120,159,.09), transparent 18rem),
        color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-profile-photo[b-mctvjw20ir] {
    display:grid;
    min-height:238px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.09);
    border-radius:17px;
    background:#eaf3ef;
}

.source-profile-photo button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.source-profile-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.source-heading small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.source-heading h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.source-heading p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-data-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.source-data-grid > div[b-mctvjw20ir] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-data-grid span[b-mctvjw20ir] {
    display:block;
    color:var(--theme-muted);
    font-size:.90rem;
}

.source-data-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-address[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:11px;
    color:#5d7067;
    font-size:.90rem;
    line-height:1.65;
}

.source-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:13px;
}

.source-actions a[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* MAP */

.map-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.map-panel iframe[b-mctvjw20ir] {
    width:100%;
    min-height:360px;
    margin-top:13px;
    border:0;
    border-radius:14px;
    background:#edf3f0;
}

.map-panel .section-heading a[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    padding:0 12px;
    border-radius:10px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* PRINT */

.vital-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:9px;
}

.vital-grid > div[b-mctvjw20ir],
.reference-grid > div[b-mctvjw20ir] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:10px;
    background:#f9fbfa;
}

.vital-grid span[b-mctvjw20ir],
.reference-grid span[b-mctvjw20ir] {
    display:block;
    color:#7e8f87;
    font-size:.90rem;
}

.vital-grid strong[b-mctvjw20ir],
.reference-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-ink);
    font-size:.90rem;
    line-height:1.58;
}

/* LARGE MUD TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 14px !important;
    font-size:.90rem !important;
    line-height:1.62 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:62px;
    color:#26463c;
    font-size:.92rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.96rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:.98rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.94rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.before > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.during > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.after > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.environment > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.home > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.previous > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.assessment > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.disabled-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.certificate > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.device > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.accessibility > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.health > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }

@media (max-width: 1450px) {
    .status-overview[b-mctvjw20ir],
    .visit-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .vital-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 980px) {
    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:195px minmax(0,1fr);
    }
}

@media (max-width: 780px) {
    .status-overview[b-mctvjw20ir],
    .visit-type-overview[b-mctvjw20ir],
    .target-grid[b-mctvjw20ir],
    .care-metrics[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .vital-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   SOCIAL WELFARE APPLICATION โ€” LARGE PREMIUM TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.65;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.20), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.total[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.review[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.approved[b-mctvjw20ir] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.paid[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.document > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.review > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.eligible > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.approved > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.paid > span[b-mctvjw20ir] { background:#73569b; }

.type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-mctvjw20ir],
.type-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.elderly > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.disabled > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card.income > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.emergency > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.housing > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-overview-card.family > span[b-mctvjw20ir] {
    color:#b55b82;
    background:#fdebf3;
}

.type-overview-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.budget-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.budget-grid > div[b-mctvjw20ir],
.target-grid button[b-mctvjw20ir] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.budget-grid small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.budget-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.budget-grid span[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

/* TABLE */

.application-no-cell[b-mctvjw20ir],
.welfare-type-cell[b-mctvjw20ir],
.household-cell[b-mctvjw20ir],
.amount-cell[b-mctvjw20ir],
.officer-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:175px;
    flex-direction:column;
}

.welfare-type-cell[b-mctvjw20ir],
.officer-cell[b-mctvjw20ir] {
    min-width:210px;
}

.application-no-cell strong[b-mctvjw20ir],
.welfare-type-cell strong[b-mctvjw20ir],
.household-cell strong[b-mctvjw20ir],
.amount-cell strong[b-mctvjw20ir],
.officer-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.application-no-cell small[b-mctvjw20ir],
.welfare-type-cell small[b-mctvjw20ir],
.household-cell small[b-mctvjw20ir],
.amount-cell small[b-mctvjw20ir],
.officer-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.application-no-cell em[b-mctvjw20ir],
.household-cell em[b-mctvjw20ir],
.amount-cell em[b-mctvjw20ir],
.officer-cell em[b-mctvjw20ir],
.citizen-photo-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.type-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.source-group-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.type-chip.elderly-allowance[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.type-chip.disability-allowance[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.type-chip.newborn-grant[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }
.type-chip.low-income[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.type-chip.emergency-relief[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.type-chip.funeral-assistance[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.type-chip.housing-repair[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.type-chip.caregiver-support[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.type-chip.education-support[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.type-chip.livelihood-support[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.type-chip.vulnerable-family[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.submitted[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.document-pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.under-review[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.eligible[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.approved[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.paid[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.source-group-chip[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.missing-document[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    margin-top:8px !important;
    padding:5px 9px;
    border-radius:999px;
    color:#b54d43 !important;
    background:#fff0ee;
    font-weight:750;
}

.row-source-action[b-mctvjw20ir] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* ASSESSMENT & AMOUNT */

.assessment-preview[b-mctvjw20ir],
.amount-preview[b-mctvjw20ir] {
    display:grid;
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:17px;
    background:#f5fafc;
}

.assessment-preview[b-mctvjw20ir] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.amount-preview[b-mctvjw20ir] {
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-color:rgba(10,114,87,.13);
    background:#f5faf7;
}

.assessment-preview > div[b-mctvjw20ir],
.amount-preview > div[b-mctvjw20ir] {
    min-height:106px;
    padding:15px;
    border:1px solid rgba(47,120,159,.08);
    border-radius:14px;
    background:#fff;
}

.assessment-preview small[b-mctvjw20ir],
.amount-preview small[b-mctvjw20ir] {
    display:block;
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.amount-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
}

.assessment-preview strong[b-mctvjw20ir],
.amount-preview strong[b-mctvjw20ir] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.18rem;
}

.assessment-preview span[b-mctvjw20ir],
.amount-preview span[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-document-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:11px;
}

.amount-document-grid > div[b-mctvjw20ir] {
    min-height:105px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:12px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-document-grid span[b-mctvjw20ir],
.amount-document-grid small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-document-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.22rem;
}

/* SOURCE */

.source-profile-panel[b-mctvjw20ir] {
    grid-template-columns:240px minmax(0,1fr);
}

.source-data-grid[b-mctvjw20ir] {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.source-actions a[b-mctvjw20ir] {
    min-height:43px;
    font-size:.90rem;
}

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.65 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

/* ATTACHMENTS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-mctvjw20ir] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.service > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.appointment > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.income > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mctvjw20ir],
    .type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .amount-preview[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:195px minmax(0,1fr);
    }

    .assessment-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .type-overview[b-mctvjw20ir],
    .budget-grid[b-mctvjw20ir],
    .target-grid[b-mctvjw20ir],
    .care-metrics[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .assessment-preview[b-mctvjw20ir],
    .amount-preview[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-profile-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE BENEFICIARY REGISTRY โ€” LARGE PREMIUM TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.66;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.30), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.hero-link-row[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.hero-source-button.secondary[b-mctvjw20ir] {
    color:#315a73;
    border-color:rgba(47,120,159,.22);
    background:#e8f3f8;
}

.summary-card.active[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.payment[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.monthly[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.verified[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.pending > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.payment > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.suspended > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.expiring > span[b-mctvjw20ir] { background:#73569b; }

.target-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.target-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.target-overview-card:hover[b-mctvjw20ir],
.target-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.target-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.target-overview-card.elderly > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.target-overview-card.disabled > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.target-overview-card.mixed > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.target-overview-card.child > span[b-mctvjw20ir] {
    color:#b55b82;
    background:#fdebf3;
}

.target-overview-card.income > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.target-overview-card.family > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.target-overview-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.target-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-metrics[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.amount-metrics > div[b-mctvjw20ir],
.follow-grid button[b-mctvjw20ir] {
    min-height:96px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.amount-metrics small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.amount-metrics strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.35rem;
}

.amount-metrics span[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#72847b;
    font-size:.90rem;
}

.follow-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.follow-grid button[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    align-items:center;
    gap:11px;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
}

.follow-grid button > span[b-mctvjw20ir] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.follow-grid strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
}

.follow-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.registry-cell[b-mctvjw20ir],
.benefit-cell[b-mctvjw20ir],
.period-cell[b-mctvjw20ir],
.amount-cell[b-mctvjw20ir],
.payment-cycle-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.benefit-cell[b-mctvjw20ir] {
    min-width:225px;
}

.registry-cell strong[b-mctvjw20ir],
.benefit-cell strong[b-mctvjw20ir],
.period-cell strong[b-mctvjw20ir],
.amount-cell strong[b-mctvjw20ir],
.payment-cycle-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:750;
    line-height:1.62;
}

.registry-cell small[b-mctvjw20ir],
.benefit-cell small[b-mctvjw20ir],
.period-cell small[b-mctvjw20ir],
.amount-cell small[b-mctvjw20ir],
.payment-cycle-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.registry-cell em[b-mctvjw20ir],
.period-cell em[b-mctvjw20ir],
.amount-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.benefit-chip[b-mctvjw20ir],
.cycle-chip[b-mctvjw20ir],
.verify-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.source-group-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.benefit-chip.allowance[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.benefit-chip.social-assistance[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.benefit-chip.emergency[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.benefit-chip.housing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.care-support[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.benefit-chip.education[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.benefit-chip.occupation[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.benefit-chip.health[b-mctvjw20ir] { color:#b55b82; background:#fdebf3; }

.cycle-chip.not-due[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }

.verify-chip.pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.verify-chip.verified[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.verify-chip.failed[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.verify-chip.expired[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.status-chip.pending-activation[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.active[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.payment-hold[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.suspended[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.expired[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.terminated[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.source-group-chip[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.row-source-action[b-mctvjw20ir] {
    display:inline-grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid rgba(10,114,87,.14);
    border-radius:12px;
    color:var(--theme-primary);
    background:#edf7f3;
    text-decoration:none;
}

/* FORM */

.condition-switch-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-mctvjw20ir] {
    display:flex;
    min-height:100px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.amount-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-mctvjw20ir] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-mctvjw20ir] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-mctvjw20ir] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* LARGE MUD TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.view-source-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:43px;
    align-items:center;
    gap:7px;
    padding:0 14px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:11px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.view-source-button.secondary[b-mctvjw20ir] {
    color:#2f789f;
    border-color:rgba(47,120,159,.15);
    background:#e8f3f8;
}

/* ATTACHMENT COLORS */

.attachment-card.member > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.id-card > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.house > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.caregiver > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.disabled-card > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.certificate > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.device > span[b-mctvjw20ir] { background:rgba(196,106,43,.90); }
.attachment-card.visit > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.environment > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.assessment > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.income > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.application > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.household > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.beneficiary-card > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.verification > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.payment > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mctvjw20ir],
    .target-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .target-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .condition-switch-grid[b-mctvjw20ir],
    .amount-preview[b-mctvjw20ir],
    .source-data-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .hero-link-row[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .patient-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   WELFARE DISBURSEMENT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.66;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(115,86,155,.22), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.payable[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.paid[b-mctvjw20ir] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.outstanding[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.failed[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.draft > span[b-mctvjw20ir] { background:#687872; }
.status-overview-card.approval > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.processing > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.paid > span[b-mctvjw20ir] { background:#34734b; }
.status-overview-card.failed > span[b-mctvjw20ir] { background:#b54d43; }

.disbursement-progress[b-mctvjw20ir] {
    margin-top:15px;
}

.disbursement-progress > div[b-mctvjw20ir] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.disbursement-progress > div > span[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#44a580);
}

/* TABLE CELLS */

.batch-cell[b-mctvjw20ir],
.amount-cell[b-mctvjw20ir],
.progress-cell[b-mctvjw20ir],
.date-cell[b-mctvjw20ir],
.control-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:178px;
    flex-direction:column;
}

.batch-cell[b-mctvjw20ir] {
    min-width:245px;
}

.batch-cell strong[b-mctvjw20ir],
.amount-cell strong[b-mctvjw20ir],
.progress-cell strong[b-mctvjw20ir],
.date-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
    font-weight:780;
    line-height:1.62;
}

.batch-cell small[b-mctvjw20ir],
.amount-cell small[b-mctvjw20ir],
.progress-cell small[b-mctvjw20ir],
.date-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:6px;
    color:#72847b;
    font-size:.90rem;
    line-height:1.62;
}

.batch-cell em[b-mctvjw20ir],
.amount-cell em[b-mctvjw20ir],
.date-cell em[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:31px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.recipient-cell[b-mctvjw20ir] {
    min-width:180px;
}

.recipient-stack[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.recipient-stack button[b-mctvjw20ir],
.recipient-stack span[b-mctvjw20ir] {
    display:grid;
    width:38px;
    height:38px;
    overflow:hidden;
    place-items:center;
    margin-left:-8px;
    padding:0;
    border:3px solid #fff;
    border-radius:50%;
    background:#e7f5ef;
}

.recipient-stack button:first-child[b-mctvjw20ir] {
    margin-left:0;
}

.recipient-stack img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-stack span[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.recipient-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.recipient-cell small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.table-progress[b-mctvjw20ir] {
    height:10px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#6bb69a);
}

.failed-line[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    color:#b54d43;
    background:#fff0ee;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

/* CHIPS */

.status-chip[b-mctvjw20ir],
.approval-chip[b-mctvjw20ir],
.reconcile-chip[b-mctvjw20ir],
.cycle-chip[b-mctvjw20ir],
.line-status-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.approval-pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.approved[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.processing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.paid[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.partial[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.failed[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.approval-chip.pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.approval-chip.approved[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.approval-chip.rejected[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.approval-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.reconcile-chip.not-started[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.reconcile-chip.pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.reconcile-chip.reconciled[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.reconcile-chip.difference[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.reconcile-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.cycle-chip.not-due[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.cycle-chip.due[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.cycle-chip.processing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.cycle-chip.paid[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.cycle-chip.overdue[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.cycle-chip.hold[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }

.line-status-chip.pending[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.line-status-chip.ready[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.line-status-chip.processing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.line-status-chip.paid[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.line-status-chip.failed[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.line-status-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.control-cell[b-mctvjw20ir] {
    gap:7px;
}

/* BENEFICIARY SELECTION */

.beneficiary-selection-title[b-mctvjw20ir] {
    align-items:center;
}

.selection-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-left:auto;
}

.selection-actions button[b-mctvjw20ir] {
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(10,114,87,.16);
    border-radius:10px;
    color:var(--theme-primary);
    background:#edf7f3;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.selection-actions button.clear[b-mctvjw20ir] {
    color:#b54d43;
    border-color:rgba(181,77,67,.16);
    background:#fff0ee;
}

.source-selection-panel[b-mctvjw20ir] {
    margin:15px 0 22px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 12px 30px rgba(5,62,46,.055);
}

.source-selection-summary[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(10,114,87,.08);
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-selection-summary > div[b-mctvjw20ir] {
    min-height:82px;
    padding:12px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:#fff;
}

.source-selection-summary small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.source-selection-summary strong[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.13rem;
}

.source-selection-table-wrap[b-mctvjw20ir] {
    max-height:520px;
    overflow:auto;
}

.source-selection-table[b-mctvjw20ir] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.source-selection-table th[b-mctvjw20ir],
.source-selection-table td[b-mctvjw20ir] {
    padding:13px 12px;
    border-bottom:1px solid rgba(10,114,87,.07);
    color:#40544b;
    font-size:.90rem;
    text-align:left;
    vertical-align:middle;
}

.source-selection-table th[b-mctvjw20ir] {
    position:sticky;
    z-index:2;
    top:0;
    color:#26463c;
    background:#eef7f3;
    font-size:.90rem;
    font-weight:800;
}

.source-selection-table tr.selected td[b-mctvjw20ir] {
    background:#f0faf6;
}

.source-person-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    min-width:230px;
    align-items:center;
    gap:10px;
}

.source-person-cell button[b-mctvjw20ir] {
    width:52px;
    height:52px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.source-person-cell img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-person-cell strong[b-mctvjw20ir],
.source-benefit-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.source-person-cell small[b-mctvjw20ir],
.source-benefit-cell small[b-mctvjw20ir],
.source-date[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.source-person-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:3px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.source-benefit-cell[b-mctvjw20ir] {
    min-width:190px;
}

.source-amount[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.92rem;
    white-space:nowrap;
}

.bank-readiness span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    gap:5px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.bank-readiness span.ready[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.bank-readiness span.missing[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.bank-readiness small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.source-document-buttons[b-mctvjw20ir] {
    display:flex;
    gap:5px;
}

.source-document-buttons button[b-mctvjw20ir] {
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    cursor:pointer;
}

/* FORM PREVIEW */

.amount-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:16px 0 21px;
    padding:15px;
    border:1px solid rgba(10,114,87,.13);
    border-radius:17px;
    background:#f5faf7;
}

.amount-preview > div[b-mctvjw20ir] {
    min-height:108px;
    padding:15px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:14px;
    background:#fff;
}

.amount-preview small[b-mctvjw20ir] {
    display:block;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.amount-preview strong[b-mctvjw20ir] {
    display:block;
    margin-top:8px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.amount-preview span[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#71837a;
    font-size:.90rem;
}

/* DETAIL */

.batch-overview-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:17px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.batch-overview-icon[b-mctvjw20ir] {
    display:grid;
    width:120px;
    height:120px;
    place-items:center;
    border-radius:25px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.batch-overview-icon .mud-icon-root[b-mctvjw20ir] {
    font-size:3.5rem;
}

.batch-overview-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.batch-overview-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.batch-overview-content p[b-mctvjw20ir] {
    margin:8px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.batch-overview-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:14px;
}

.batch-overview-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.print-line-table-wrap[b-mctvjw20ir] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
}

.print-line-table[b-mctvjw20ir] {
    width:100%;
    border-collapse:collapse;
    font-family:'Kanit',sans-serif;
}

.print-line-table th[b-mctvjw20ir],
.print-line-table td[b-mctvjw20ir] {
    padding:11px 10px;
    border-bottom:1px solid rgba(10,114,87,.08);
    color:#40544b;
    font-size:.90rem;
    vertical-align:top;
}

.print-line-table th[b-mctvjw20ir] {
    color:#26463c;
    background:#eef7f3;
    font-weight:800;
}

.print-line-table td strong[b-mctvjw20ir],
.print-line-table td small[b-mctvjw20ir] {
    display:block;
}

.print-line-table td small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
}

.print-line-table tfoot td[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#f5faf7;
    font-weight:800;
}

.recipient-detail-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.recipient-detail-list[b-mctvjw20ir] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.recipient-detail-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f9fbfa;
}

.recipient-detail-card.failed[b-mctvjw20ir] {
    border-color:rgba(181,77,67,.18);
    background:#fff8f7;
}

.recipient-detail-card.paid[b-mctvjw20ir] {
    border-color:rgba(52,115,75,.18);
    background:#f6fbf7;
}

.recipient-detail-photo[b-mctvjw20ir] {
    width:100px;
    height:100px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.recipient-detail-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.recipient-detail-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.recipient-detail-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1rem;
}

.recipient-detail-heading small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.recipient-detail-grid > div[b-mctvjw20ir] {
    min-height:70px;
    padding:10px;
    border:1px solid rgba(10,114,87,.07);
    border-radius:11px;
    background:#fff;
}

.recipient-detail-grid span[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.recipient-detail-grid strong[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:var(--theme-ink);
    font-size:.90rem;
}

.recipient-document-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.recipient-document-actions button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

/* WORKFLOW BUTTONS */

.workflow-button[b-mctvjw20ir] {
    min-height:43px !important;
    border-radius:11px !important;
    font-family:'Kanit',sans-serif !important;
    font-weight:750 !important;
}

.workflow-button.submit[b-mctvjw20ir] {
    background:#987634 !important;
    color:#fff !important;
}

.workflow-button.approve[b-mctvjw20ir] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.process[b-mctvjw20ir] {
    background:#2f789f !important;
    color:#fff !important;
}

.workflow-button.paid[b-mctvjw20ir] {
    background:#34734b !important;
    color:#fff !important;
}

/* LARGE MUD TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

/* ATTACHMENT COLORS */

.attachment-card.batch > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.approval > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.bank > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.reconciliation > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }

@media (max-width:1450px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .source-selection-summary[b-mctvjw20ir],
    .recipient-detail-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:980px) {
    .amount-preview[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .batch-overview-panel[b-mctvjw20ir] {
        grid-template-columns:100px minmax(0,1fr);
    }

    .batch-overview-icon[b-mctvjw20ir] {
        width:100px;
        height:100px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .source-selection-summary[b-mctvjw20ir],
    .amount-preview[b-mctvjw20ir],
    .recipient-detail-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .selection-actions[b-mctvjw20ir] {
        width:100%;
        margin-left:0;
    }

    .source-selection-table-wrap[b-mctvjw20ir] {
        overflow-x:auto;
    }

    .source-selection-table[b-mctvjw20ir] {
        min-width:1050px;
    }

    .batch-overview-panel[b-mctvjw20ir],
    .recipient-detail-card[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .recipient-detail-photo[b-mctvjw20ir] {
        width:100%;
        height:190px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .batch-overview-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   ENVIRONMENT & WASTE POINT โ€” LARGE PREMIUM TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.66;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(215,187,90,.28), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(52,132,94,.28), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.points[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.full[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.collection[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.sensor[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir],
.type-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.near-full > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.full > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.overflow > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.maintenance > span[b-mctvjw20ir] { background:#73569b; }

.type-overview[b-mctvjw20ir] {
    display:grid;
    gap:11px;
    margin-top:15px;
}

.type-overview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:60px minmax(0,1fr);
    min-height:104px;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:#fff;
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.type-overview-card:hover[b-mctvjw20ir],
.type-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-2px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.type-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
}

.type-overview-card.general > span[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.type-overview-card.recyclable > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-overview-card.organic > span[b-mctvjw20ir] {
    color:#34734b;
    background:#e7f5ec;
}

.type-overview-card.hazardous > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.type-overview-card.bulky > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.type-overview-card.mixed > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.type-overview-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
}

.type-overview-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.fill-progress[b-mctvjw20ir] {
    margin-top:15px;
}

.fill-progress > div[b-mctvjw20ir] {
    height:17px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
}

.fill-progress > div > span[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#e2ad49,#b54d43);
}

/* TOOLBAR */

.toolbar-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    align-items:center;
}

.map-view-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

/* MAP BOARD */

.map-board[b-mctvjw20ir] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.map-board-grid[b-mctvjw20ir] {
    position:absolute;
    inset:0;
    opacity:.8;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%),
        repeating-linear-gradient(0deg, transparent 0 84px, rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px, 390px 270px, 100% 100%, 100% 100%;
}

.map-pin[b-mctvjw20ir] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:5px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.map-pin.near-full[b-mctvjw20ir] {
    background:#987634;
}

.map-pin.full[b-mctvjw20ir] {
    background:#c56b2a;
}

.map-pin.overflow[b-mctvjw20ir] {
    background:#b54d43;
}

.map-pin.maintenance[b-mctvjw20ir] {
    background:#73569b;
}

.map-pin.inactive[b-mctvjw20ir] {
    background:#687872;
}

.map-pin span[b-mctvjw20ir] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-mctvjw20ir] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:530px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-mctvjw20ir] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-mctvjw20ir] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.active[b-mctvjw20ir] { background:var(--theme-primary); }
.map-board-legend i.near-full[b-mctvjw20ir] { background:#987634; }
.map-board-legend i.full[b-mctvjw20ir] { background:#b54d43; }
.map-board-legend i.maintenance[b-mctvjw20ir] { background:#73569b; }

.map-board-caption[b-mctvjw20ir] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-mctvjw20ir],
.map-board-caption small[b-mctvjw20ir] {
    display:block;
}

.map-board-caption strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.point-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    min-width:285px;
    align-items:center;
    gap:12px;
}

.point-photo-mini[b-mctvjw20ir] {
    display:grid;
    width:72px;
    height:72px;
    overflow:hidden;
    place-items:center;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.point-photo-mini button[b-mctvjw20ir] {
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.point-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.point-photo-cell small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.point-photo-cell em[b-mctvjw20ir] {
    display:inline-flex;
    min-height:29px;
    align-items:center;
    margin-top:6px;
    padding:0 9px;
    border-radius:999px;
    color:var(--theme-primary);
    background:#e7f5ef;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.location-cell[b-mctvjw20ir],
.bin-cell[b-mctvjw20ir],
.fill-cell[b-mctvjw20ir],
.collection-cell[b-mctvjw20ir],
.sensor-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:170px;
    flex-direction:column;
}

.location-cell[b-mctvjw20ir] {
    min-width:220px;
}

.location-cell strong[b-mctvjw20ir],
.bin-cell strong[b-mctvjw20ir],
.fill-cell strong[b-mctvjw20ir],
.collection-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.93rem;
    font-weight:760;
    line-height:1.58;
}

.location-cell small[b-mctvjw20ir],
.bin-cell small[b-mctvjw20ir],
.fill-cell small[b-mctvjw20ir],
.collection-cell small[b-mctvjw20ir],
.sensor-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.waste-type-chip[b-mctvjw20ir],
.collection-chip[b-mctvjw20ir],
.sensor-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.waste-type-chip.general[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.waste-type-chip.recyclable[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.waste-type-chip.organic[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.waste-type-chip.hazardous[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.waste-type-chip.bulky[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.waste-type-chip.mixed[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }

.collection-chip.scheduled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.collection-chip.due[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.collection-chip.collecting[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.collection-chip.collected[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.collection-chip.missed[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.collection-chip.cancelled[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.sensor-chip.online[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.sensor-chip.offline[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.sensor-chip.maintenance[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.sensor-chip.no-sensor[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.status-chip.active[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.near-full[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.full[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.status-chip.overflow[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.maintenance[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.inactive[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.table-progress[b-mctvjw20ir] {
    height:11px;
    overflow:hidden;
    margin-top:8px;
    border-radius:999px;
    background:var(--theme-border);
}

.table-progress span[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:999px;
}

.table-progress.low span[b-mctvjw20ir] { background:var(--theme-primary); }
.table-progress.medium span[b-mctvjw20ir] { background:#2f789f; }
.table-progress.high span[b-mctvjw20ir] { background:#987634; }
.table-progress.critical span[b-mctvjw20ir] { background:#b54d43; }

.repair-alert[b-mctvjw20ir],
.clean-alert[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:29px;
    align-items:center;
    margin-top:7px;
    padding:0 9px;
    border-radius:999px;
    font-size:.90rem;
    font-style:normal;
    font-weight:750;
}

.repair-alert[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.clean-alert[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

/* FORM MAP & FILL */

.coordinate-preview[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:130px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 22px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-mctvjw20ir] {
    position:absolute;
    inset:0;
    opacity:.68;
    background:
        linear-gradient(32deg, transparent 46%, rgba(255,255,255,.95) 47%, rgba(255,255,255,.95) 53%, transparent 54%),
        linear-gradient(-28deg, transparent 46%, rgba(255,255,255,.88) 47%, rgba(255,255,255,.88) 53%, transparent 54%);
    background-size:280px 190px, 340px 230px;
}

.coordinate-pin[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:96px;
    height:96px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 12px 28px rgba(10,114,87,.25);
    transform:rotate(-12deg);
}

.coordinate-pin .mud-icon-root[b-mctvjw20ir] {
    transform:rotate(12deg);
    font-size:2.7rem;
}

.coordinate-preview > div:last-child[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-mctvjw20ir] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.fill-preview-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:140px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.fill-preview-bin[b-mctvjw20ir] {
    position:relative;
    width:120px;
    height:170px;
    overflow:hidden;
    border:5px solid var(--theme-ink);
    border-radius:18px 18px 24px 24px;
    background:var(--theme-border);
}

.fill-preview-bin span[b-mctvjw20ir] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.fill-preview-bin.medium span[b-mctvjw20ir] { background:#2f789f; }
.fill-preview-bin.high span[b-mctvjw20ir] { background:#987634; }
.fill-preview-bin.critical span[b-mctvjw20ir] { background:#b54d43; }

.fill-preview-bin strong[b-mctvjw20ir] {
    position:absolute;
    z-index:2;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:1.35rem;
    text-shadow:0 2px 8px rgba(0,0,0,.35);
}

.fill-preview-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fill-preview-content h3[b-mctvjw20ir] {
    margin:7px 0 0;
    color:var(--theme-ink);
    font-size:1.32rem;
}

.fill-preview-content p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.condition-switch-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin:15px 0 21px;
}

.condition-switch-grid label[b-mctvjw20ir] {
    display:flex;
    min-height:98px;
    align-items:center;
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.condition-switch-grid strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.91rem;
}

.condition-switch-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.source-photo-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-mctvjw20ir] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.point-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 135px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.point-cover-photo[b-mctvjw20ir] {
    min-height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.point-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.point-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.point-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.point-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.point-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.point-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.large-fill-indicator[b-mctvjw20ir] {
    position:relative;
    display:flex;
    width:120px;
    height:180px;
    overflow:hidden;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    border:5px solid var(--theme-ink);
    border-radius:20px 20px 28px 28px;
    background:var(--theme-border);
}

.large-fill-indicator > span[b-mctvjw20ir] {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    background:var(--theme-primary);
}

.large-fill-indicator.medium > span[b-mctvjw20ir] { background:#2f789f; }
.large-fill-indicator.high > span[b-mctvjw20ir] { background:#987634; }
.large-fill-indicator.critical > span[b-mctvjw20ir] { background:#b54d43; }

.large-fill-indicator strong[b-mctvjw20ir],
.large-fill-indicator small[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.large-fill-indicator strong[b-mctvjw20ir] {
    font-size:1.45rem;
}

.large-fill-indicator small[b-mctvjw20ir] {
    font-size:.90rem;
}

.detail-map-preview[b-mctvjw20ir] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
}

.detail-map-preview img[b-mctvjw20ir] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.detail-map-preview a[b-mctvjw20ir] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.collection-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.collection-history-list[b-mctvjw20ir] {
    display:grid;
    gap:12px;
    margin-top:14px;
}

.collection-history-list article[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:14px;
    padding:13px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:14px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.collection-history-list button[b-mctvjw20ir] {
    width:120px;
    height:95px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.collection-history-list img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.collection-history-list strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.collection-history-list p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.collection-history-list small[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-button.collect[b-mctvjw20ir] {
    background:var(--theme-primary) !important;
    color:#fff !important;
}

.workflow-button.repair[b-mctvjw20ir] {
    background:#73569b !important;
    color:#fff !important;
}

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.66 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

.attachment-card.point > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.source > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }

@media (max-width:1450px) {
    .status-overview[b-mctvjw20ir],
    .type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .condition-switch-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .point-cover-panel[b-mctvjw20ir] {
        grid-template-columns:250px minmax(0,1fr) 120px;
    }
}

@media (max-width:980px) {
    .point-cover-panel[b-mctvjw20ir] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .large-fill-indicator[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        height:100px;
        border-radius:18px;
    }

    .source-photo-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-photo-preview button[b-mctvjw20ir] {
        height:210px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .type-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .condition-switch-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-panel[b-mctvjw20ir],
    .fill-preview-card[b-mctvjw20ir],
    .coordinate-preview[b-mctvjw20ir],
    .collection-history-list article[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .point-cover-photo[b-mctvjw20ir] {
        min-height:240px;
    }

    .large-fill-indicator[b-mctvjw20ir],
    .fill-preview-bin[b-mctvjw20ir],
    .coordinate-pin[b-mctvjw20ir] {
        margin:0 auto;
    }

    .map-board[b-mctvjw20ir] {
        min-height:500px;
    }

    .map-pin[b-mctvjw20ir] {
        grid-template-columns:24px auto;
        min-height:42px;
        padding:5px 8px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .point-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   POLLUTION COMPLAINT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.68;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(47,120,159,.23), transparent 38%),
        linear-gradient(138deg, #17665a 0%, #0b4b40 54%, #06312a 100%);
}

.summary-card.active[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.critical[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.resolved[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.new > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.received > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.inspecting > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.in-progress > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.resolved > span[b-mctvjw20ir] { background:#34734b; }

/* POLLUTION TYPE CARDS */

.pollution-type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.pollution-type-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:18px;
    color:#40544b;
    background:
        linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.pollution-type-card[b-mctvjw20ir]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.pollution-type-card:hover[b-mctvjw20ir],
.pollution-type-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.30);
    box-shadow:0 17px 34px rgba(5,62,46,.11);
}

.pollution-type-card > span[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.pollution-type-card > div[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.pollution-type-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.pollution-type-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.pollution-type-card.air[b-mctvjw20ir] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.12);
}

.pollution-type-card.water[b-mctvjw20ir] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.12);
}

.pollution-type-card.noise[b-mctvjw20ir] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.12);
}

.pollution-type-card.odor[b-mctvjw20ir] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.pollution-type-card.dust[b-mctvjw20ir] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.12);
}

.pollution-type-card.waste[b-mctvjw20ir] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.12);
}

.pollution-type-card.chemical[b-mctvjw20ir] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.12);
}

/* INSIGHT */

.sla-progress[b-mctvjw20ir] {
    margin-top:18px;
}

.sla-progress > div[b-mctvjw20ir] {
    height:18px;
    overflow:hidden;
    padding:3px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:999px;
    background:#eaf2ee;
    box-shadow:inset 0 2px 5px rgba(31,75,57,.07);
}

.sla-progress > div > span[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--theme-primary),#2f789f);
    box-shadow:0 4px 10px rgba(10,114,87,.20);
}

.focus-panel .follow-grid[b-mctvjw20ir] {
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin-top:17px;
}

.focus-panel .follow-grid button[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    min-height:78px;
    align-items:center;
    gap:13px;
    padding:11px 14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,color-mix(in srgb, var(--theme-bg) 58%, white));
    box-shadow:0 9px 20px rgba(5,62,46,.05);
}

.focus-panel .follow-grid button:nth-child(1) > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.focus-panel .follow-grid button:nth-child(2) > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.focus-panel .follow-grid button:nth-child(3) > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.focus-panel .follow-grid button > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:15px;
}

.focus-panel .follow-grid strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
}

.focus-panel .follow-grid small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TOOLBAR & MAP */

.toolbar-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
}

.map-view-button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:44px;
    align-items:center;
    gap:7px;
    padding:0 15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:12px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.pollution-map-board[b-mctvjw20ir] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,236,230,.86),rgba(238,247,243,.86)),
        #eaf2ee;
}

.pollution-map-pin[b-mctvjw20ir] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#687872;
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.pollution-map-pin.low[b-mctvjw20ir] { background:#2f789f; }
.pollution-map-pin.medium[b-mctvjw20ir] { background:#987634; }
.pollution-map-pin.high[b-mctvjw20ir] { background:#c56b2a; }
.pollution-map-pin.critical[b-mctvjw20ir] { background:#b54d43; }

.pollution-map-pin span[b-mctvjw20ir] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend[b-mctvjw20ir] {
    position:absolute;
    z-index:4;
    top:18px;
    left:18px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    padding:10px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:12px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-legend span[b-mctvjw20ir] {
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#40544b;
    font-size:.90rem;
}

.map-board-legend i[b-mctvjw20ir] {
    width:12px;
    height:12px;
    border-radius:50%;
}

.map-board-legend i.low[b-mctvjw20ir] { background:#2f789f; }
.map-board-legend i.medium[b-mctvjw20ir] { background:#987634; }
.map-board-legend i.high[b-mctvjw20ir] { background:#c56b2a; }
.map-board-legend i.critical[b-mctvjw20ir] { background:#b54d43; }

.map-board-caption[b-mctvjw20ir] {
    position:absolute;
    z-index:4;
    right:18px;
    bottom:18px;
    max-width:430px;
    padding:13px 15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 20px rgba(5,62,46,.09);
}

.map-board-caption strong[b-mctvjw20ir],
.map-board-caption small[b-mctvjw20ir] {
    display:block;
}

.map-board-caption strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.map-board-caption small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* TABLE CELLS */

.complaint-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.complaint-photo-mini[b-mctvjw20ir] {
    width:76px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.complaint-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.96rem;
    font-weight:800;
    line-height:1.55;
}

.complaint-photo-cell small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.complaint-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.type-severity-cell[b-mctvjw20ir],
.reporter-cell[b-mctvjw20ir],
.location-cell[b-mctvjw20ir],
.inspection-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.reporter-cell[b-mctvjw20ir],
.location-cell[b-mctvjw20ir] {
    min-width:195px;
}

.reporter-cell strong[b-mctvjw20ir],
.location-cell strong[b-mctvjw20ir],
.inspection-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.92rem;
    font-weight:760;
}

.reporter-cell small[b-mctvjw20ir],
.location-cell small[b-mctvjw20ir],
.inspection-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.reporter-cell em[b-mctvjw20ir],
.location-cell em[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-style:normal;
}

.pollution-type-chip[b-mctvjw20ir],
.severity-chip[b-mctvjw20ir],
.inspection-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.overdue-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.pollution-type-chip.air[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.pollution-type-chip.water[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.pollution-type-chip.noise[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.pollution-type-chip.odor[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.pollution-type-chip.dust[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.pollution-type-chip.waste[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.pollution-type-chip.chemical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.pollution-type-chip.other[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.severity-chip.low[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.severity-chip.medium[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.severity-chip.high[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.severity-chip.critical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.inspection-chip.not-assigned[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.inspection-chip.assigned[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.inspection-chip.on-site[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.inspection-chip.sample-sent[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.inspection-chip.complete[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }

.status-chip.new[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.status-chip.received[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.inspecting[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.in-progress[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.waiting-external[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.status-chip.resolved[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.status-chip.rejected[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.status-chip.closed[b-mctvjw20ir] { color:var(--theme-ink); background:#e8eeeb; }

.overdue-chip[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.overdue-text[b-mctvjw20ir] {
    color:#b54d43 !important;
    font-weight:750;
}

.officer-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    min-width:220px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-mctvjw20ir] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.90rem;
}

.officer-cell small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

/* FORM */

.anonymous-switch-card[b-mctvjw20ir] {
    display:flex;
    min-height:92px;
    align-items:center;
    gap:14px;
    margin:12px 0 18px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.anonymous-switch-card strong[b-mctvjw20ir],
.anonymous-switch-card small[b-mctvjw20ir] {
    display:block;
}

.anonymous-switch-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.anonymous-switch-card small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.coordinate-preview[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#eaf2ee;
}

.coordinate-map-grid[b-mctvjw20ir],
.map-board-grid[b-mctvjw20ir] {
    position:absolute;
    inset:0;
    opacity:.72;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        linear-gradient(-28deg,transparent 46%,rgba(255,255,255,.88) 47%,rgba(255,255,255,.88) 53%,transparent 54%),
        repeating-linear-gradient(0deg,transparent 0 84px,rgba(74,113,95,.09) 85px 87px),
        repeating-linear-gradient(90deg,transparent 0 120px,rgba(74,113,95,.09) 121px 123px);
    background-size:310px 220px,390px 270px,100% 100%,100% 100%;
}

.coordinate-pin[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.high[b-mctvjw20ir] { background:#c56b2a; }
.coordinate-pin.critical[b-mctvjw20ir] { background:#b54d43; }
.coordinate-pin.medium[b-mctvjw20ir] { background:#987634; }

.coordinate-pin .mud-icon-root[b-mctvjw20ir] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-mctvjw20ir] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.source-point-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-point-preview > button[b-mctvjw20ir] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.source-point-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.source-point-preview small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.source-point-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.source-point-preview p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-condition-row[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.source-condition-row span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:750;
}

.source-condition-row span.warning[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.source-condition-row span.danger[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.measurement-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:11px;
    margin:14px 0 22px;
}

.measurement-preview article[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    min-height:108px;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:16px;
    background:#f9fbfa;
}

.measurement-preview article > span[b-mctvjw20ir] {
    display:grid;
    width:56px;
    height:56px;
    place-items:center;
    border-radius:15px;
}

.measurement-preview article.air > span[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.measurement-preview article.noise > span[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.measurement-preview article.water > span[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.measurement-preview article.odor > span[b-mctvjw20ir] { color:#987634; background:#fff4df; }

.measurement-preview small[b-mctvjw20ir],
.measurement-preview strong[b-mctvjw20ir],
.measurement-preview em[b-mctvjw20ir] {
    display:block;
}

.measurement-preview small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-preview strong[b-mctvjw20ir] {
    margin-top:4px;
    color:var(--theme-ink);
    font-size:1.05rem;
}

.measurement-preview em[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.source-photo-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 260px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.source-photo-preview small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.source-photo-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.source-photo-preview p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.source-photo-preview button[b-mctvjw20ir] {
    height:150px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.source-photo-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* DETAIL */

.complaint-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.complaint-cover-photo[b-mctvjw20ir] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f0ec;
}

.complaint-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.complaint-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.complaint-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.complaint-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.complaint-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.complaint-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.severity-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:#2f789f;
    background:#fff;
}

.severity-emblem.medium[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.severity-emblem.high[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.severity-emblem.critical[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }

.severity-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.25rem;
}

.severity-emblem strong[b-mctvjw20ir] {
    font-size:1.10rem;
}

.severity-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.measurement-document-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}

.measurement-document-grid > div[b-mctvjw20ir] {
    min-height:92px;
    padding:13px;
    border:1px solid rgba(10,114,87,.08);
    border-radius:13px;
    background:color-mix(in srgb, var(--theme-bg) 58%, white);
}

.measurement-document-grid span[b-mctvjw20ir],
.measurement-document-grid strong[b-mctvjw20ir] {
    display:block;
}

.measurement-document-grid span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-mctvjw20ir] {
    margin-top:7px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.detail-map-preview[b-mctvjw20ir] {
    position:relative;
    min-height:260px;
    overflow:hidden;
    margin-top:14px;
    border-radius:15px;
    background:#eaf2ee;
}

.detail-map-preview img[b-mctvjw20ir] {
    width:100%;
    height:260px;
    object-fit:cover;
}

.map-placeholder[b-mctvjw20ir] {
    display:flex;
    min-height:260px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px;
    color:#2f789f;
    background:
        linear-gradient(32deg,transparent 46%,rgba(255,255,255,.95) 47%,rgba(255,255,255,.95) 53%,transparent 54%),
        #eaf2ee;
}

.detail-map-preview a[b-mctvjw20ir] {
    position:absolute;
    right:14px;
    bottom:14px;
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 13px;
    border-radius:11px;
    color:#fff;
    background:var(--theme-primary);
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    text-decoration:none;
}

.workflow-button.receive[b-mctvjw20ir] {
    color:#fff !important;
    background:#987634 !important;
}

.workflow-button.inspect[b-mctvjw20ir] {
    color:#fff !important;
    background:#2f789f !important;
}

.workflow-button.progress[b-mctvjw20ir] {
    color:#fff !important;
    background:#73569b !important;
}

.workflow-button.resolve[b-mctvjw20ir] {
    color:#fff !important;
    background:#34734b !important;
}

.workflow-button.close[b-mctvjw20ir] {
    color:#fff !important;
    background:var(--theme-ink) !important;
}

/* PHOTOS */

.attachment-card.scene > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }
.attachment-card.reporter > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.inspection > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.sample > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.closure > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.source > span[b-mctvjw20ir] { background:rgba(197,107,42,.90); }
.attachment-card.waste-point > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.bin > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.location > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.maintenance > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }

/* LARGE MUD TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .pollution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .measurement-preview[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .complaint-cover-panel[b-mctvjw20ir] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .pollution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .complaint-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .severity-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .source-point-preview[b-mctvjw20ir],
    .source-photo-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .source-point-preview > button[b-mctvjw20ir],
    .source-photo-preview button[b-mctvjw20ir] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .pollution-type-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .measurement-preview[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-panel[b-mctvjw20ir],
    .coordinate-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .complaint-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .coordinate-pin[b-mctvjw20ir] {
        margin:0 auto;
    }

    .pollution-map-board[b-mctvjw20ir] {
        min-height:500px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .complaint-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   WATER QUALITY โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.68;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.28), transparent 31%),
        radial-gradient(circle at 8% 112%, rgba(79,166,196,.28), transparent 38%),
        linear-gradient(138deg, #1b6d68 0%, #0d5360 54%, #06373f 100%);
}

.summary-card.sources[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.quality[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.pollution[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.inspection[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.good > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.polluted > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.critical > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.restoring > span[b-mctvjw20ir] { background:#73569b; }

/* SOURCE TYPE CARDS */

.institution-type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbfd);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(10,71,91,.055);
    transition:.18s ease;
}

.institution-type-card[b-mctvjw20ir]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(47,120,159,.08));
    content:"";
}

.institution-type-card:hover[b-mctvjw20ir],
.institution-type-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:rgba(47,120,159,.34);
    box-shadow:0 17px 34px rgba(10,71,91,.12);
}

.institution-type-card > span[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.canal[b-mctvjw20ir] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.pond[b-mctvjw20ir] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.reservoir[b-mctvjw20ir] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.river[b-mctvjw20ir] {
    --type-color:#278ca8;
    --type-soft:rgba(39,140,168,.13);
}

.institution-type-card.groundwater[b-mctvjw20ir] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.drainage[b-mctvjw20ir] {
    --type-color:#687872;
    --type-soft:rgba(104,120,114,.13);
}

.institution-type-card.tap-water[b-mctvjw20ir] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

/* WATER METRIC */

.health-metric-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-top:18px;
}

.health-metric-grid article[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:118px;
    align-items:center;
    gap:11px;
    padding:16px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:17px;
    background:linear-gradient(145deg,#fff,#f7fbfd);
    box-shadow:0 10px 24px rgba(10,71,91,.055);
}

.health-metric-grid article > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
}

.health-metric-grid article.ph > span[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.health-metric-grid article.do > span[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.health-metric-grid article.bod > span[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.health-metric-grid article.turbidity > span[b-mctvjw20ir] { color:#987634; background:#fff4df; }

.health-metric-grid small[b-mctvjw20ir],
.health-metric-grid strong[b-mctvjw20ir],
.health-metric-grid em[b-mctvjw20ir] {
    display:block;
}

.health-metric-grid small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.health-metric-grid strong[b-mctvjw20ir] {
    margin-top:5px;
    color:#26463c;
    font-size:1.34rem;
    font-weight:850;
}

.health-metric-grid em[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

/* MAP */

.education-map-board[b-mctvjw20ir] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(47,120,159,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(223,240,246,.86),rgba(235,247,243,.86)),
        #eaf4f7;
}

.education-map-pin[b-mctvjw20ir] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 8px 22px rgba(24,65,78,.26);
    cursor:pointer;
}

.education-map-pin.good[b-mctvjw20ir] { background:var(--theme-primary); }
.education-map-pin.watch[b-mctvjw20ir] { background:#987634; }
.education-map-pin.polluted[b-mctvjw20ir] { background:#c56b2a; }
.education-map-pin.critical[b-mctvjw20ir] { background:#b54d43; }
.education-map-pin.restoring[b-mctvjw20ir] { background:#73569b; }
.education-map-pin.closed[b-mctvjw20ir] { background:#687872; }

.education-map-pin span[b-mctvjw20ir] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.good[b-mctvjw20ir] { background:var(--theme-primary); }
.map-board-legend i.watch[b-mctvjw20ir] { background:#987634; }
.map-board-legend i.polluted[b-mctvjw20ir] { background:#c56b2a; }
.map-board-legend i.critical[b-mctvjw20ir] { background:#b54d43; }
.map-board-legend i.restoring[b-mctvjw20ir] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(47,120,159,.12);
    border-radius:17px;
    background:#e8f3f8;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:#2f789f;
    font-style:normal;
}

.type-level-cell[b-mctvjw20ir],
.latest-progress-cell[b-mctvjw20ir],
.inspection-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-mctvjw20ir],
.quality-status-chip[b-mctvjw20ir],
.usage-chip[b-mctvjw20ir],
.lab-chip[b-mctvjw20ir],
.no-progress-chip[b-mctvjw20ir],
.overdue-chip[b-mctvjw20ir],
.follow-up-chip[b-mctvjw20ir],
.complaint-count-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.canal[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.pond[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.reservoir[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.institution-type-chip.river[b-mctvjw20ir] { color:#278ca8; background:#e5f5f9; }
.institution-type-chip.groundwater[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.institution-type-chip.drainage[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.institution-type-chip.tap-water[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }

.quality-status-chip.good[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.quality-status-chip.watch[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.quality-status-chip.polluted[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.quality-status-chip.critical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.quality-status-chip.restoring[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.quality-status-chip.closed[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.usage-chip[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.lab-chip.confirmed[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.lab-chip.pending[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.no-progress-chip[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.follow-up-chip[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.complaint-count-chip[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.latest-progress-cell strong[b-mctvjw20ir],
.inspection-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.latest-progress-cell small[b-mctvjw20ir],
.inspection-cell small[b-mctvjw20ir],
.type-level-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbfd;
    font-size:.90rem;
}

.size-cell strong[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
}

.row-action.sample[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* COORDINATES */

.coordinate-preview[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    min-height:150px;
    overflow:hidden;
    align-items:center;
    gap:18px;
    margin:13px 0 20px;
    padding:18px;
    border:1px solid rgba(47,120,159,.13);
    border-radius:18px;
    background:#eaf4f7;
}

.coordinate-pin[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:92px;
    height:92px;
    place-items:center;
    border:5px solid #fff;
    border-radius:50% 50% 50% 10px;
    color:#fff;
    background:#2f789f;
    box-shadow:0 12px 28px rgba(47,120,159,.25);
    transform:rotate(-12deg);
}

.coordinate-pin.good[b-mctvjw20ir] { background:var(--theme-primary); }
.coordinate-pin.watch[b-mctvjw20ir] { background:#987634; }
.coordinate-pin.polluted[b-mctvjw20ir] { background:#c56b2a; }
.coordinate-pin.critical[b-mctvjw20ir] { background:#b54d43; }
.coordinate-pin.restoring[b-mctvjw20ir] { background:#73569b; }
.coordinate-pin.closed[b-mctvjw20ir] { background:#687872; }

.coordinate-pin .mud-icon-root[b-mctvjw20ir] {
    transform:rotate(12deg);
    font-size:2.6rem;
}

.coordinate-preview > div:last-child[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.coordinate-preview strong[b-mctvjw20ir] {
    display:block;
    color:#26463c;
    font-size:1.16rem;
}

.coordinate-preview small[b-mctvjw20ir] {
    display:block;
    margin-top:7px;
    color:#5f746a;
    font-size:.90rem;
}

.linked-photo-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 270px;
    align-items:center;
    gap:16px;
    margin:16px 0 22px;
    padding:16px;
    border:1px solid rgba(115,86,155,.14);
    border-radius:17px;
    background:#f7f3fb;
}

.linked-photo-preview small[b-mctvjw20ir] {
    color:#73569b;
    font-size:.90rem;
    font-weight:800;
}

.linked-photo-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.16rem;
}

.linked-photo-preview p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-photo-preview button[b-mctvjw20ir] {
    height:155px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:13px;
    background:#fff;
    cursor:zoom-in;
}

.linked-photo-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* READING FORM */

.vaccine-form-modal[b-mctvjw20ir] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,52,.28);
}

.review-score-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin:17px 0;
}

.review-score-preview article[b-mctvjw20ir] {
    min-height:102px;
    padding:14px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:15px;
    background:#f8fbfd;
}

.review-score-preview small[b-mctvjw20ir],
.review-score-preview strong[b-mctvjw20ir],
.review-score-preview span[b-mctvjw20ir] {
    display:block;
}

.review-score-preview small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-mctvjw20ir] {
    margin-top:7px;
    color:#26463c;
    font-size:1.20rem;
}

.review-score-preview span[b-mctvjw20ir] {
    margin-top:5px;
    color:#2f789f;
    font-size:.90rem;
}

.review-score-preview article.ph[b-mctvjw20ir] { border-top:4px solid #73569b; }
.review-score-preview article.do[b-mctvjw20ir] { border-top:4px solid #2f789f; }
.review-score-preview article.bod[b-mctvjw20ir] { border-top:4px solid #c56b2a; }
.review-score-preview article.cod[b-mctvjw20ir] { border-top:4px solid #b54d43; }
.review-score-preview article.turbidity[b-mctvjw20ir] { border-top:4px solid #987634; }
.review-score-preview article.coliform[b-mctvjw20ir] { border-top:4px solid var(--theme-primary); }

.progress-photo-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

/* DETAIL */

.education-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#f5fafc;
}

.education-cover-photo[b-mctvjw20ir] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e8f3f8;
}

.education-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:#2f789f;
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.education-emblem.polluted[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.critical[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.restoring[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.education-emblem.closed[b-mctvjw20ir] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.25rem;
}

.education-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.measurement-document-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.measurement-document-grid > div[b-mctvjw20ir] {
    min-height:88px;
    padding:13px;
    border:1px solid rgba(47,120,159,.09);
    border-radius:13px;
    background:#f7fbfd;
}

.measurement-document-grid span[b-mctvjw20ir],
.measurement-document-grid strong[b-mctvjw20ir] {
    display:block;
}

.measurement-document-grid span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.measurement-document-grid strong[b-mctvjw20ir] {
    margin-top:7px;
    color:#26463c;
    font-size:1rem;
}

.vaccine-history-panel[b-mctvjw20ir],
.linked-complaint-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(47,120,159,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card-list[b-mctvjw20ir],
.linked-complaint-list[b-mctvjw20ir] {
    display:grid;
    gap:11px;
    margin-top:14px;
}

.vaccine-card[b-mctvjw20ir] {
    padding:15px;
    border:1px solid rgba(47,120,159,.09);
    border-left:5px solid #2f789f;
    border-radius:15px;
    background:#f9fcfd;
}

.vaccine-card.good[b-mctvjw20ir] { border-left-color:var(--theme-primary); }
.vaccine-card.watch[b-mctvjw20ir] { border-left-color:#987634; }
.vaccine-card.polluted[b-mctvjw20ir] { border-left-color:#c56b2a; }
.vaccine-card.critical[b-mctvjw20ir] { border-left-color:#b54d43; }
.vaccine-card.restoring[b-mctvjw20ir] { border-left-color:#73569b; }

.vaccine-card-head[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.vaccine-card-head strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.vaccine-card-head small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card-metrics[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.vaccine-card-metrics span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:34px;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border-radius:999px;
    color:#71837a;
    background:#fff;
    font-size:.90rem;
}

.vaccine-card-metrics strong[b-mctvjw20ir] {
    color:#2f789f;
}

.vaccine-card p[b-mctvjw20ir] {
    margin:11px 0 0;
    color:#5f746a;
    font-size:.90rem;
}

.assessment-photo-actions[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:11px;
}

.assessment-photo-actions button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(47,120,159,.12);
    border-radius:10px;
    color:#2f789f;
    background:#e8f3f8;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    cursor:pointer;
}

.linked-complaint-list article[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    gap:13px;
    padding:13px;
    border:1px solid rgba(115,86,155,.10);
    border-radius:15px;
    background:#faf8fc;
}

.linked-complaint-list button[b-mctvjw20ir] {
    height:120px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:12px;
    cursor:zoom-in;
}

.linked-complaint-list img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-complaint-list strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.linked-complaint-list small[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#73569b;
    font-size:.90rem;
}

.linked-complaint-list p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

.linked-complaint-list a[b-mctvjw20ir] {
    display:inline-flex;
    min-height:36px;
    align-items:center;
    margin-top:8px;
    padding:0 10px;
    border-radius:10px;
    color:#fff;
    background:#73569b;
    font-size:.90rem;
    text-decoration:none;
}

/* PHOTOS */

.attachment-card.source > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.map > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.sampling > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.inspection > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.lab > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.restoration > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.complaint > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }

/* LARGE MUD TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-photo-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-photo-preview button[b-mctvjw20ir] {
        height:220px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .institution-type-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .amount-document-grid[b-mctvjw20ir],
    .progress-photo-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-mctvjw20ir],
    .coordinate-preview[b-mctvjw20ir],
    .linked-complaint-list article[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .coordinate-pin[b-mctvjw20ir] {
        margin:0 auto;
    }

    .education-map-board[b-mctvjw20ir] {
        min-height:500px;
    }

    .linked-complaint-list button[b-mctvjw20ir] {
        height:210px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .education-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   GREEN SPACE & TREE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.68;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(224,191,108,.31), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(71,145,93,.30), transparent 38%),
        linear-gradient(138deg, #236b4f 0%, #0e503c 54%, #073428 100%);
}

.summary-card.trees[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.area[b-mctvjw20ir] {
    --accent:#34734b;
    --soft:#e7f5ec;
    --border:rgba(52,115,75,.18);
}

.summary-card.health[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.risk[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.healthy > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.watch > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.diseased > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.hazardous > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.treatment > span[b-mctvjw20ir] { background:#73569b; }

/* ASSET TYPE CARDS */

.institution-type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:104px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f6fbf7);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-mctvjw20ir]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-mctvjw20ir],
.institution-type-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.street-tree[b-mctvjw20ir] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.public-park[b-mctvjw20ir] {
    --type-color:#34734b;
    --type-soft:rgba(52,115,75,.13);
}

.institution-type-card.median[b-mctvjw20ir] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.community-forest[b-mctvjw20ir] {
    --type-color:#236b4f;
    --type-soft:rgba(35,107,79,.13);
}

.institution-type-card.waterfront[b-mctvjw20ir] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.school-green[b-mctvjw20ir] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.public-garden[b-mctvjw20ir] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

/* GREEN METRICS */

.health-metric-grid article.carbon > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.photo > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.maintenance > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.treatment > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

/* MAP */

.education-map-board[b-mctvjw20ir] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(224,240,228,.88),rgba(239,247,236,.88)),
        #eaf4eb;
}

.education-map-pin[b-mctvjw20ir] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.healthy[b-mctvjw20ir] { background:var(--theme-primary); }
.education-map-pin.watch[b-mctvjw20ir] { background:#987634; }
.education-map-pin.diseased[b-mctvjw20ir] { background:#c56b2a; }
.education-map-pin.hazardous[b-mctvjw20ir] { background:#b54d43; }
.education-map-pin.treatment[b-mctvjw20ir] { background:#73569b; }
.education-map-pin.removed[b-mctvjw20ir] { background:#687872; }

.education-map-pin span[b-mctvjw20ir] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.healthy[b-mctvjw20ir] { background:var(--theme-primary); }
.map-board-legend i.watch[b-mctvjw20ir] { background:#987634; }
.map-board-legend i.diseased[b-mctvjw20ir] { background:#c56b2a; }
.map-board-legend i.hazardous[b-mctvjw20ir] { background:#b54d43; }
.map-board-legend i.treatment[b-mctvjw20ir] { background:#73569b; }

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    min-width:315px;
    align-items:center;
    gap:12px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:78px;
    height:78px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:17px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:.97rem;
    font-weight:800;
    line-height:1.55;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-mctvjw20ir],
.latest-progress-cell[b-mctvjw20ir],
.maintenance-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:160px;
    flex-direction:column;
    gap:6px;
}

.institution-type-chip[b-mctvjw20ir],
.health-status-chip[b-mctvjw20ir],
.risk-chip[b-mctvjw20ir],
.health-score-chip[b-mctvjw20ir],
.no-progress-chip[b-mctvjw20ir],
.overdue-chip[b-mctvjw20ir],
.urgent-chip[b-mctvjw20ir],
.water-link-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:34px;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.street-tree[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.public-park[b-mctvjw20ir] { color:#34734b; background:#e7f5ec; }
.institution-type-chip.median[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.institution-type-chip.community-forest[b-mctvjw20ir] { color:#236b4f; background:#e4f1e9; }
.institution-type-chip.waterfront[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.school-green[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.institution-type-chip.public-garden[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }

.health-status-chip.healthy[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.health-status-chip.watch[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.health-status-chip.diseased[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.health-status-chip.hazardous[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.health-status-chip.treatment[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.health-status-chip.removed[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.risk-chip.low[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.risk-chip.medium[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.risk-chip.high[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.risk-chip.critical[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.health-score-chip.good[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.health-score-chip.watch[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.health-score-chip.diseased[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.health-score-chip.hazardous[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.no-progress-chip[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-mctvjw20ir],
.urgent-chip[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.water-link-chip[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.type-level-cell strong[b-mctvjw20ir],
.latest-progress-cell strong[b-mctvjw20ir],
.maintenance-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.92rem;
}

.type-level-cell small[b-mctvjw20ir],
.latest-progress-cell small[b-mctvjw20ir],
.maintenance-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.size-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    min-width:190px;
}

.size-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:36px;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    padding:0 9px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.size-cell strong[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
}

.size-cell em[b-mctvjw20ir] {
    grid-column:1 / -1;
    color:#987634;
    font-size:.90rem;
    font-style:normal;
}

.row-action.inspect[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* WATER LINK */

.linked-water-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(47,120,159,.14);
    border-radius:17px;
    background:#f2f8fb;
}

.linked-water-preview > button[b-mctvjw20ir] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-water-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-water-preview small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-water-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.15rem;
}

.linked-water-preview p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* INSPECTION */

.vaccine-form-modal[b-mctvjw20ir] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.good[b-mctvjw20ir] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.watch[b-mctvjw20ir] {
    border-top:4px solid #987634;
}

.review-score-preview article.diseased[b-mctvjw20ir],
.review-score-preview article.high[b-mctvjw20ir] {
    border-top:4px solid #c56b2a;
}

.review-score-preview article.hazardous[b-mctvjw20ir],
.review-score-preview article.critical[b-mctvjw20ir] {
    border-top:4px solid #b54d43;
}

.review-score-preview article.medium[b-mctvjw20ir] {
    border-top:4px solid #987634;
}

.review-score-preview article.low[b-mctvjw20ir] {
    border-top:4px solid var(--theme-primary);
}

/* DETAIL */

.education-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-mctvjw20ir] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.35rem;
}

.education-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.91rem;
    line-height:1.72;
}

.education-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.watch[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.education-emblem.diseased[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.hazardous[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.treatment[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.education-emblem.removed[b-mctvjw20ir] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.25rem;
}

.education-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.vaccine-card[b-mctvjw20ir] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.medium[b-mctvjw20ir],
.vaccine-card.watch[b-mctvjw20ir] {
    border-left-color:#987634;
}

.vaccine-card.high[b-mctvjw20ir],
.vaccine-card.diseased[b-mctvjw20ir] {
    border-left-color:#c56b2a;
}

.vaccine-card.critical[b-mctvjw20ir],
.vaccine-card.hazardous[b-mctvjw20ir] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.26) !important;
}

/* PHOTOS */

.attachment-card.tree > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.canopy > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.map > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.maintenance > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.disease > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }
.attachment-card.area > span[b-mctvjw20ir] { background:rgba(35,107,79,.90); }
.attachment-card.water-source > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:18px 15px !important;
    font-size:.92rem !important;
    line-height:1.68 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:64px;
    color:#26463c;
    font-size:.94rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:.98rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.96rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-water-preview[b-mctvjw20ir],
    .source-photo-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .institution-type-overview[b-mctvjw20ir],
    .amount-metrics[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .progress-photo-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-mctvjw20ir],
    .coordinate-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .coordinate-pin[b-mctvjw20ir] {
        margin:0 auto;
    }

    .education-map-board[b-mctvjw20ir] {
        min-height:500px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:14px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .education-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   EDUCATION & CHILD CENTER โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.72;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.33), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.institutions[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.students[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.personnel[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.quality[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.full > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.maintenance > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.review > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.temp-closed > span[b-mctvjw20ir] { background:#b54d43; }

/* INSTITUTION TYPE CARDS */

.institution-type-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin-top:15px;
}

.institution-type-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:106px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.institution-type-card[b-mctvjw20ir]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--type-soft,rgba(10,114,87,.08));
    content:"";
}

.institution-type-card:hover[b-mctvjw20ir],
.institution-type-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.institution-type-card > span[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--type-color);
    background:var(--type-soft);
}

.institution-type-card > div[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.institution-type-card small[b-mctvjw20ir] {
    display:block;
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.institution-type-card strong[b-mctvjw20ir] {
    display:block;
    margin-top:6px;
    color:var(--type-color);
    font-size:1.20rem;
    font-weight:850;
}

.institution-type-card.child-center[b-mctvjw20ir] {
    --type-color:var(--theme-primary);
    --type-soft:rgba(10,114,87,.13);
}

.institution-type-card.kindergarten[b-mctvjw20ir] {
    --type-color:#c56b2a;
    --type-soft:rgba(197,107,42,.13);
}

.institution-type-card.primary[b-mctvjw20ir] {
    --type-color:#2f789f;
    --type-soft:rgba(47,120,159,.13);
}

.institution-type-card.secondary[b-mctvjw20ir] {
    --type-color:#73569b;
    --type-soft:rgba(115,86,155,.13);
}

.institution-type-card.learning[b-mctvjw20ir] {
    --type-color:#987634;
    --type-soft:rgba(152,118,52,.13);
}

.institution-type-card.special[b-mctvjw20ir] {
    --type-color:#b54d43;
    --type-soft:rgba(181,77,67,.13);
}

/* EDUCATION METRICS */

.health-metric-grid article.attendance > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.health > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.assessment > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.green > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* MAP */

.education-map-board[b-mctvjw20ir] {
    position:relative;
    min-height:610px;
    overflow:hidden;
    border:1px solid rgba(10,114,87,.13);
    border-radius:20px;
    background:
        linear-gradient(rgba(231,243,236,.88),rgba(251,247,232,.88)),
        #edf6ef;
}

.education-map-pin[b-mctvjw20ir] {
    position:absolute;
    z-index:3;
    display:grid;
    grid-template-columns:30px auto;
    min-height:48px;
    align-items:center;
    gap:6px;
    transform:translate(-50%,-50%);
    padding:6px 10px;
    border:3px solid #fff;
    border-radius:20px 20px 20px 4px;
    color:#fff;
    background:var(--theme-primary);
    box-shadow:0 8px 22px rgba(24,65,52,.26);
    cursor:pointer;
}

.education-map-pin.active[b-mctvjw20ir] { background:var(--theme-primary); }
.education-map-pin.full[b-mctvjw20ir] { background:#987634; }
.education-map-pin.maintenance[b-mctvjw20ir] { background:#c56b2a; }
.education-map-pin.accreditation-review[b-mctvjw20ir] { background:#73569b; }
.education-map-pin.temp-closed[b-mctvjw20ir],
.education-map-pin.inactive[b-mctvjw20ir] { background:#b54d43; }

.education-map-pin span[b-mctvjw20ir] {
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:800;
    white-space:nowrap;
}

.map-board-legend i.active[b-mctvjw20ir] { background:var(--theme-primary); }
.map-board-legend i.full[b-mctvjw20ir] { background:#987634; }
.map-board-legend i.maintenance[b-mctvjw20ir] { background:#c56b2a; }
.map-board-legend i.review[b-mctvjw20ir] { background:#73569b; }
.map-board-legend i.closed[b-mctvjw20ir] { background:#b54d43; }

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:13px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1rem;
    font-weight:800;
    line-height:1.56;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.type-level-cell[b-mctvjw20ir],
.latest-progress-cell[b-mctvjw20ir],
.assessment-date-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:165px;
    flex-direction:column;
    gap:7px;
}

.institution-type-chip[b-mctvjw20ir],
.institution-status-chip[b-mctvjw20ir],
.accreditation-chip[b-mctvjw20ir],
.assessment-result-chip[b-mctvjw20ir],
.no-progress-chip[b-mctvjw20ir],
.overdue-chip[b-mctvjw20ir],
.due-chip[b-mctvjw20ir],
.green-link-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.institution-type-chip.child-center[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.institution-type-chip.kindergarten[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.institution-type-chip.primary-school[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.institution-type-chip.secondary-school[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.institution-type-chip.learning-center[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.institution-type-chip.special-education[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.institution-status-chip.active[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.institution-status-chip.full[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.institution-status-chip.maintenance[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.institution-status-chip.temp-closed[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.institution-status-chip.accreditation-review[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.institution-status-chip.inactive[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.accreditation-chip.passed[b-mctvjw20ir],
.assessment-result-chip.passed[b-mctvjw20ir],
.assessment-result-chip.excellent[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.accreditation-chip.conditional[b-mctvjw20ir],
.assessment-result-chip.conditional[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.accreditation-chip.review[b-mctvjw20ir],
.assessment-result-chip.review[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.accreditation-chip.expired[b-mctvjw20ir],
.accreditation-chip.not-assessed[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.no-progress-chip[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.overdue-chip[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.due-chip[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.green-link-chip[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.type-level-cell small[b-mctvjw20ir],
.latest-progress-cell small[b-mctvjw20ir],
.assessment-date-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.latest-progress-cell strong[b-mctvjw20ir],
.assessment-date-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.occupancy-cell[b-mctvjw20ir] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:8px;
}

.occupancy-cell > div:first-child[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.occupancy-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.occupancy-cell span[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.occupancy-track[b-mctvjw20ir] {
    height:10px;
    overflow:hidden;
    border-radius:999px;
    background:#e4ece8;
}

.occupancy-track i[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.occupancy-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.personnel-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:195px;
}

.personnel-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:10px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.personnel-cell strong[b-mctvjw20ir] {
    color:var(--theme-primary);
}

.personnel-cell em[b-mctvjw20ir] {
    grid-column:1 / -1;
    color:#73569b;
    font-size:.90rem;
    font-style:normal;
}

.row-action.assess[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM CAPACITY */

.capacity-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:14px 0 22px;
}

.capacity-preview > div[b-mctvjw20ir] {
    min-height:94px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f6fbf8);
}

.capacity-preview small[b-mctvjw20ir],
.capacity-preview strong[b-mctvjw20ir] {
    display:block;
}

.capacity-preview small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.capacity-preview strong[b-mctvjw20ir] {
    margin-top:8px;
    color:var(--theme-primary);
    font-size:1.24rem;
}

.linked-green-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    align-items:center;
    gap:17px;
    margin:13px 0 22px;
    padding:15px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:17px;
    background:#f1f8f3;
}

.linked-green-preview > button[b-mctvjw20ir] {
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:14px;
    background:#fff;
    cursor:zoom-in;
}

.linked-green-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-green-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.06em;
}

.linked-green-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.17rem;
}

.linked-green-preview p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.90rem;
}

/* ASSESSMENT */

.vaccine-form-modal[b-mctvjw20ir] {
    width:min(1240px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview article.excellent[b-mctvjw20ir],
.review-score-preview article.passed[b-mctvjw20ir] {
    border-top:4px solid var(--theme-primary);
}

.review-score-preview article.conditional[b-mctvjw20ir] {
    border-top:4px solid #987634;
}

.review-score-preview article.review[b-mctvjw20ir] {
    border-top:4px solid #b54d43;
}

.vaccine-card.excellent[b-mctvjw20ir],
.vaccine-card.passed[b-mctvjw20ir] {
    border-left-color:var(--theme-primary);
}

.vaccine-card.conditional[b-mctvjw20ir] {
    border-left-color:#987634;
}

.vaccine-card.review[b-mctvjw20ir] {
    border-left-color:#b54d43;
}

/* DETAIL */

.education-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:310px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.education-cover-photo[b-mctvjw20ir] {
    height:225px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.education-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.education-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.education-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.38rem;
}

.education-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.93rem;
    line-height:1.72;
}

.education-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.education-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.education-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.education-emblem.full[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.education-emblem.maintenance[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.education-emblem.temp-closed[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }
.education-emblem.accreditation-review[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.education-emblem.inactive[b-mctvjw20ir] { color:#687872; border-color:#dde5e1; }

.education-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.25rem;
}

.education-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.education-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#fff;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.26) !important;
}

/* ATTACHMENTS */

.attachment-card.building > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.classroom > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.playground > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.kitchen > span[b-mctvjw20ir] { background:rgba(197,107,42,.90); }
.attachment-card.safety > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }
.attachment-card.activity > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.green-source > span[b-mctvjw20ir] { background:rgba(35,107,79,.90); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.94rem !important;
    line-height:1.70 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.96rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.04rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.02rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.98rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:270px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .institution-type-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .education-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .linked-green-preview[b-mctvjw20ir],
    .source-photo-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .institution-type-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .progress-photo-grid[b-mctvjw20ir],
    .capacity-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .education-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .education-map-board[b-mctvjw20ir] {
        min-height:500px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.90rem !important;
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .education-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   STUDENT INFORMATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.74;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.34), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #216855 0%, #164d43 54%, #0a3330 100%);
}

.summary-card.students[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.attendance[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.academic[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.support[b-mctvjw20ir] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.active > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.new > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.watch > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.transferred > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.graduated > span[b-mctvjw20ir] { background:#73569b; }

.health-metric-grid article.new > span[b-mctvjw20ir] {
    color:#c56b2a;
    background:#fff0df;
}

.health-metric-grid article.health > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.scholarship > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.photo > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.school-class-cell[b-mctvjw20ir],
.latest-progress-cell[b-mctvjw20ir],
.care-cell[b-mctvjw20ir] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:7px;
}

.school-chip[b-mctvjw20ir],
.student-status-chip[b-mctvjw20ir],
.health-chip[b-mctvjw20ir],
.special-care-chip[b-mctvjw20ir],
.scholarship-chip[b-mctvjw20ir],
.learning-chip[b-mctvjw20ir],
.no-progress-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.school-chip[b-mctvjw20ir] {
    max-width:250px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.school-chip.kindergarten[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.school-chip.primary-school[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.school-chip.secondary-school[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.school-chip.learning-center[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.school-chip.special-education[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.student-status-chip.active[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.student-status-chip.new[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.student-status-chip.watch[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.student-status-chip.suspended[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.student-status-chip.graduated[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.student-status-chip.transferred[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.student-status-chip.withdrawn[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.health-chip.normal[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.health-chip.follow-up[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.health-chip.referred[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.health-chip.restricted[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }

.special-care-chip[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.scholarship-chip[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.learning-chip.excellent[b-mctvjw20ir],
.learning-chip.good[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.learning-chip.pass[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.learning-chip.support[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.no-progress-chip[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.school-class-cell strong[b-mctvjw20ir],
.latest-progress-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.school-class-cell small[b-mctvjw20ir],
.latest-progress-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-cell[b-mctvjw20ir] {
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:9px;
}

.attendance-cell > div:first-child[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.attendance-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1rem;
}

.attendance-cell span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.progress-track[b-mctvjw20ir] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.progress-track i[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.progress-track i.good[b-mctvjw20ir] { background:var(--theme-primary); }
.progress-track i.watch[b-mctvjw20ir] { background:#987634; }
.progress-track i.risk[b-mctvjw20ir] { background:#b54d43; }

.teacher-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:205px;
    align-items:center;
    gap:10px;
}

.teacher-cell > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.teacher-cell strong[b-mctvjw20ir],
.teacher-cell small[b-mctvjw20ir] {
    display:block;
}

.teacher-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.teacher-cell small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.progress[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* LINKED SCHOOL */

.linked-school-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-school-preview > button[b-mctvjw20ir] {
    height:175px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:15px;
    cursor:zoom-in;
}

.linked-school-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-school-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-school-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.20rem;
}

.linked-school-preview p[b-mctvjw20ir] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.92rem;
}

.privacy-warning[b-mctvjw20ir] {
    margin-top:22px;
    font-size:.95rem !important;
}

/* PROGRESS */

.vaccine-form-modal[b-mctvjw20ir] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-score-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}

.review-score-preview article[b-mctvjw20ir] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.watch[b-mctvjw20ir],
.review-score-preview article.pass[b-mctvjw20ir] {
    border-top-color:#987634;
}

.review-score-preview article.risk[b-mctvjw20ir],
.review-score-preview article.support[b-mctvjw20ir] {
    border-top-color:#b54d43;
}

.review-score-preview small[b-mctvjw20ir],
.review-score-preview strong[b-mctvjw20ir],
.review-score-preview span[b-mctvjw20ir] {
    display:block;
}

.review-score-preview small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-mctvjw20ir] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.42rem;
}

.review-score-preview span[b-mctvjw20ir] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-mctvjw20ir] {
    border-left:5px solid var(--theme-primary);
}

.vaccine-card.pass[b-mctvjw20ir] {
    border-left-color:#2f789f;
}

.vaccine-card.support[b-mctvjw20ir] {
    border-left-color:#b54d43;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

/* PROFILE */

.pet-document-photo[b-mctvjw20ir] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.attachment-card.student > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.health > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }
.attachment-card.support > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.95rem !important;
    line-height:1.72 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:66px;
    color:#26463c;
    font-size:.97rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.05rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.01rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.03rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:.99rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1050px) {
    .linked-school-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .progress-photo-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.91rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .vaccine-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   SCHOLARSHIP MANAGEMENT โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.75;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.28), transparent 38%),
        linear-gradient(138deg, #226b57 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.applications[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.approved[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.paid[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.balance[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.submitted > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.under-review > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.waiting-payment > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.partial > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.paid > span[b-mctvjw20ir] { background:var(--theme-primary); }

.health-metric-grid article.review > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.waiting > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.partial > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.average > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    min-width:330px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:82px;
    height:82px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:22px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.02rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.application-program-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:180px;
    flex-direction:column;
    gap:7px;
}

.application-program-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.99rem;
}

.application-program-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.scholarship-type-chip[b-mctvjw20ir],
.scholarship-status-chip[b-mctvjw20ir],
.priority-chip[b-mctvjw20ir],
.special-care-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.scholarship-type-chip.need[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-type-chip.merit[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.scholarship-type-chip.disability[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.scholarship-type-chip.sport[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.scholarship-type-chip.culture[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.scholarship-type-chip.emergency[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.scholarship-status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.scholarship-status-chip.submitted[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.scholarship-status-chip.under-review[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.scholarship-status-chip.approved[b-mctvjw20ir],
.scholarship-status-chip.paid[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.scholarship-status-chip.waiting-payment[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.scholarship-status-chip.partial[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.scholarship-status-chip.rejected[b-mctvjw20ir],
.scholarship-status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.special-care-chip[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.eligibility-cell[b-mctvjw20ir],
.amount-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:205px;
}

.eligibility-cell span[b-mctvjw20ir],
.amount-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:39px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.eligibility-cell strong[b-mctvjw20ir],
.amount-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.90rem;
}

.eligibility-cell em[b-mctvjw20ir] {
    grid-column:1 / -1;
}

.amount-cell span:nth-child(3)[b-mctvjw20ir] {
    grid-column:1 / -1;
    color:#987634;
    background:#fffaf0;
}

.payment-progress-cell[b-mctvjw20ir] {
    display:flex;
    min-width:205px;
    flex-direction:column;
    gap:9px;
}

.payment-progress-cell > div:first-child[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.payment-progress-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.payment-progress-cell span[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.payment-track[b-mctvjw20ir] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.payment-track i[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.payment-progress-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.5;
}

.officer-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-mctvjw20ir],
.officer-cell small[b-mctvjw20ir] {
    display:block;
}

.officer-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.93rem;
}

.officer-cell small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.review[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

.row-action.pay[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

/* APPLICATION FORM */

.linked-student-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:14px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-student-preview > button[b-mctvjw20ir] {
    height:190px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:20px;
    cursor:zoom-in;
}

.linked-student-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.linked-student-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-student-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.24rem;
}

.linked-student-preview p[b-mctvjw20ir] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.93rem;
}

.linked-student-preview > div > div[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-student-preview > div > div span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.document-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.document-upload-card[b-mctvjw20ir] {
    overflow:hidden;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.document-upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.document-upload-heading strong[b-mctvjw20ir],
.document-upload-heading small[b-mctvjw20ir] {
    display:block;
}

.document-upload-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.document-upload-heading small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-mctvjw20ir] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-mctvjw20ir] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty .mud-icon-root[b-mctvjw20ir] {
    font-size:2rem;
}

.document-empty strong[b-mctvjw20ir] {
    font-size:.91rem;
}

.document-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.officer-grid[b-mctvjw20ir] {
    margin-top:10px;
}

.privacy-warning[b-mctvjw20ir] {
    margin-top:20px;
    font-size:.96rem !important;
}

/* REVIEW */

.vaccine-form-modal[b-mctvjw20ir],
.attendance-form-modal[b-mctvjw20ir] {
    width:min(1120px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.review-source-summary[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:1.4fr repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.review-source-summary > div[b-mctvjw20ir] {
    min-height:105px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.review-student[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    align-items:center;
    gap:12px;
}

.review-student img[b-mctvjw20ir] {
    width:78px;
    height:78px;
    border-radius:19px;
    object-fit:cover;
}

.review-source-summary small[b-mctvjw20ir],
.review-source-summary strong[b-mctvjw20ir],
.review-source-summary span[b-mctvjw20ir] {
    display:block;
}

.review-source-summary small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.review-source-summary strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1rem;
}

.review-source-summary span[b-mctvjw20ir] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-score-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.review-score-preview article[b-mctvjw20ir] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.review-score-preview article.conditional[b-mctvjw20ir],
.review-score-preview article.requested[b-mctvjw20ir] {
    border-top-color:#987634;
}

.review-score-preview article.review[b-mctvjw20ir] {
    border-top-color:#b54d43;
}

.review-score-preview article.approved[b-mctvjw20ir] {
    border-top-color:#73569b;
}

.review-score-preview small[b-mctvjw20ir],
.review-score-preview strong[b-mctvjw20ir],
.review-score-preview span[b-mctvjw20ir] {
    display:block;
}

.review-score-preview small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.review-score-preview strong[b-mctvjw20ir] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.34rem;
}

.review-score-preview span[b-mctvjw20ir] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.review-document-card[b-mctvjw20ir],
.payment-document-card[b-mctvjw20ir] {
    max-width:520px;
    margin:18px auto 0;
}

.review-save-button[b-mctvjw20ir] {
    background:linear-gradient(135deg,#73569b,#584078) !important;
    color:#fff !important;
}

/* PAYMENT */

.payment-summary-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.payment-summary-grid article[b-mctvjw20ir] {
    min-height:105px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.payment-summary-grid small[b-mctvjw20ir],
.payment-summary-grid strong[b-mctvjw20ir],
.payment-summary-grid span[b-mctvjw20ir] {
    display:block;
}

.payment-summary-grid small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.payment-summary-grid strong[b-mctvjw20ir] {
    margin-top:6px;
    color:var(--theme-primary);
    font-size:1.30rem;
}

.payment-summary-grid span[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.payment-save-button[b-mctvjw20ir] {
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
    color:#fff !important;
}

/* VIEW */

.scholarship-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.scholarship-cover-photo[b-mctvjw20ir] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.scholarship-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.scholarship-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.scholarship-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.40rem;
}

.scholarship-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.94rem;
}

.scholarship-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.scholarship-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.scholarship-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.scholarship-emblem.submitted[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.scholarship-emblem.under-review[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.scholarship-emblem.waiting-payment[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.scholarship-emblem.partial[b-mctvjw20ir] { color:#2f789f; border-color:#d8eaf2; }
.scholarship-emblem.rejected[b-mctvjw20ir],
.scholarship-emblem.cancelled[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }

.scholarship-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.3rem;
}

.scholarship-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.scholarship-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.pet-document-photo[b-mctvjw20ir] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.view-attendance-button[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:50px minmax(0,1fr);
    gap:12px;
    padding:15px;
    border-left:5px solid var(--theme-primary);
    border-radius:13px;
    background:#f7fbf8;
}

.vaccine-card > span[b-mctvjw20ir] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.vaccine-card > div > div[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.vaccine-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1rem;
}

.vaccine-card small[b-mctvjw20ir],
.vaccine-card p[b-mctvjw20ir],
.vaccine-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-mctvjw20ir] {
    margin:5px 0;
}

.vaccine-card em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.history-empty[b-mctvjw20ir] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.student > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.school > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.application > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.income > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.support > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.approval > span[b-mctvjw20ir] { background:rgba(52,115,75,.90); }
.attachment-card.payment > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.96rem !important;
    line-height:1.74 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:67px;
    color:#26463c;
    font-size:.98rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.06rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.02rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.04rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:1rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .scholarship-cover-panel[b-mctvjw20ir] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1100px) {
    .document-upload-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .review-source-summary[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .linked-student-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .scholarship-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .review-source-summary[b-mctvjw20ir],
    .review-score-preview[b-mctvjw20ir],
    .payment-summary-grid[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .scholarship-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.92rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .vaccine-form-modal[b-mctvjw20ir],
    .attendance-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .scholarship-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   CHILDREN & YOUTH ACTIVITIES โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.76;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.38), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.activities[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.participants[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.budget[b-mctvjw20ir] {
    --accent:#987634;
    --soft:#fff4df;
    --border:rgba(152,118,52,.18);
}

.summary-card.outcome[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.open > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.full > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.ongoing > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.completed > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.postponed > span[b-mctvjw20ir] { background:#c56b2a; }

/* CATEGORY CARDS */

.category-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.category-overview-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:108px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.category-overview-card[b-mctvjw20ir]::after {
    position:absolute;
    right:-34px;
    bottom:-48px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:var(--category-soft,rgba(10,114,87,.08));
    content:"";
}

.category-overview-card:hover[b-mctvjw20ir],
.category-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:rgba(10,114,87,.34);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.category-overview-card > span[b-mctvjw20ir] {
    position:relative;
    z-index:2;
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--category-color);
    background:var(--category-soft);
}

.category-overview-card > div[b-mctvjw20ir] {
    position:relative;
    z-index:2;
}

.category-overview-card small[b-mctvjw20ir],
.category-overview-card strong[b-mctvjw20ir],
.category-overview-card em[b-mctvjw20ir] {
    display:block;
}

.category-overview-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.category-overview-card strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--category-color);
    font-size:1.25rem;
    font-weight:850;
}

.category-overview-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.category-overview-card.learning[b-mctvjw20ir] {
    --category-color:var(--theme-primary);
    --category-soft:rgba(10,114,87,.13);
}

.category-overview-card.sport[b-mctvjw20ir] {
    --category-color:#2f789f;
    --category-soft:rgba(47,120,159,.13);
}

.category-overview-card.art[b-mctvjw20ir] {
    --category-color:#b3678a;
    --category-soft:rgba(179,103,138,.13);
}

.category-overview-card.environment[b-mctvjw20ir] {
    --category-color:#39794f;
    --category-soft:rgba(57,121,79,.13);
}

.category-overview-card.volunteer[b-mctvjw20ir] {
    --category-color:#c56b2a;
    --category-soft:rgba(197,107,42,.13);
}

.category-overview-card.digital[b-mctvjw20ir] {
    --category-color:#73569b;
    --category-soft:rgba(115,86,155,.13);
}

/* METRICS */

.health-metric-grid article.upcoming > span[b-mctvjw20ir] {
    color:#c56b2a;
    background:#fff0df;
}

.health-metric-grid article.full > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.ongoing > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.photo > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:102px minmax(0,1fr);
    min-width:380px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:102px;
    height:76px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.12);
    border-radius:18px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.03rem;
    font-weight:800;
    line-height:1.58;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.90rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.schedule-location-cell[b-mctvjw20ir],
.registration-cell[b-mctvjw20ir],
.payment-progress-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:8px;
}

.schedule-location-cell > span[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.91rem;
    font-weight:800;
}

.schedule-location-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.schedule-location-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.54;
}

.registration-cell > div:first-child[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}

.registration-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1rem;
}

.registration-cell span[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.registration-track[b-mctvjw20ir] {
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ece9;
}

.registration-track i[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:inherit;
}

.registration-track i.available[b-mctvjw20ir] { background:var(--theme-primary); }
.registration-track i.near-full[b-mctvjw20ir] { background:#987634; }
.registration-track i.full[b-mctvjw20ir] { background:#b54d43; }

.registration-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.budget-cell[b-mctvjw20ir],
.outcome-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    min-width:215px;
}

.budget-cell span[b-mctvjw20ir],
.outcome-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:40px;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:#71837a;
    background:#f7fbf8;
    font-size:.90rem;
}

.budget-cell strong[b-mctvjw20ir],
.outcome-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.budget-cell small[b-mctvjw20ir],
.outcome-cell small[b-mctvjw20ir] {
    grid-column:1 / -1;
    color:#71837a;
    font-size:.90rem;
}

.no-outcome-chip[b-mctvjw20ir],
.activity-status-chip[b-mctvjw20ir],
.priority-chip[b-mctvjw20ir],
.category-chip[b-mctvjw20ir],
.attendance-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:36px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.no-outcome-chip[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.activity-status-chip.draft[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.activity-status-chip.open[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.activity-status-chip.full[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.activity-status-chip.ongoing[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.activity-status-chip.completed[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.activity-status-chip.postponed[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.activity-status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.priority-chip.normal[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.priority-chip.high[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.priority-chip.urgent[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.category-chip.learning[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.category-chip.sport[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.category-chip.art[b-mctvjw20ir] { color:#b3678a; background:#faedf3; }
.category-chip.music[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.category-chip.environment[b-mctvjw20ir] { color:#39794f; background:#eaf5ed; }
.category-chip.volunteer[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.category-chip.digital[b-mctvjw20ir] { color:#356b9b; background:#e8f1f8; }
.category-chip.health[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.category-chip.culture[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.category-chip.career[b-mctvjw20ir] { color:#4d7c68; background:#eaf3ef; }

.officer-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:215px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-mctvjw20ir],
.officer-cell small[b-mctvjw20ir] {
    display:block;
}

.officer-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.register[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    background:#e7f5ef !important;
}

.row-action.attendance[b-mctvjw20ir] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.complete[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* FORM PREVIEW */

.activity-preview-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:17px 0 24px;
}

.activity-preview-grid article[b-mctvjw20ir] {
    min-height:104px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:linear-gradient(145deg,#fff,#f7fbf8);
}

.activity-preview-grid small[b-mctvjw20ir],
.activity-preview-grid strong[b-mctvjw20ir],
.activity-preview-grid span[b-mctvjw20ir] {
    display:block;
}

.activity-preview-grid small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.activity-preview-grid strong[b-mctvjw20ir] {
    margin-top:7px;
    color:var(--theme-primary);
    font-size:1.32rem;
}

.activity-preview-grid span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

/* UPLOAD */

.activity-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:13px;
    margin-bottom:20px;
}

.activity-upload-card[b-mctvjw20ir] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.activity-upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.activity-upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.activity-upload-heading strong[b-mctvjw20ir],
.activity-upload-heading small[b-mctvjw20ir] {
    display:block;
}

.activity-upload-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.activity-upload-heading small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.activity-upload-preview[b-mctvjw20ir] {
    height:165px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.activity-upload-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-upload-empty[b-mctvjw20ir] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.activity-upload-empty .mud-icon-root[b-mctvjw20ir] {
    font-size:2rem;
}

.activity-upload-empty strong[b-mctvjw20ir],
.activity-upload-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.privacy-warning[b-mctvjw20ir] {
    margin-top:20px;
    font-size:.98rem !important;
}

/* PARTICIPANT */

.vaccine-form-modal[b-mctvjw20ir],
.attendance-form-modal[b-mctvjw20ir],
.completion-form-modal[b-mctvjw20ir] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.participant-activity-summary[b-mctvjw20ir],
.completion-summary-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:20px;
}

.participant-activity-summary > div[b-mctvjw20ir],
.completion-summary-grid article[b-mctvjw20ir] {
    min-height:102px;
    padding:16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:16px;
    background:#f7fbf8;
}

.participant-activity-summary small[b-mctvjw20ir],
.participant-activity-summary strong[b-mctvjw20ir],
.completion-summary-grid small[b-mctvjw20ir],
.completion-summary-grid strong[b-mctvjw20ir],
.completion-summary-grid span[b-mctvjw20ir] {
    display:block;
}

.participant-activity-summary small[b-mctvjw20ir],
.completion-summary-grid small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.participant-activity-summary strong[b-mctvjw20ir],
.completion-summary-grid strong[b-mctvjw20ir] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.04rem;
}

.completion-summary-grid span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.linked-participant-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:155px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:15px 0 22px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:18px;
    background:#f1f8f3;
}

.linked-participant-preview > img[b-mctvjw20ir] {
    width:155px;
    height:155px;
    border-radius:22px;
    object-fit:cover;
}

.linked-participant-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-participant-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.25rem;
}

.linked-participant-preview p[b-mctvjw20ir] {
    margin:8px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-participant-preview > div > div[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}

.linked-participant-preview > div > div span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.linked-participant-preview .special-care-note[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.consent-warning[b-mctvjw20ir] {
    margin-top:18px;
    font-size:.96rem !important;
}

.register-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

/* ATTENDANCE */

.attendance-toolbar[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:15px;
    padding:14px 16px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.attendance-toolbar strong[b-mctvjw20ir],
.attendance-toolbar span[b-mctvjw20ir] {
    display:block;
}

.attendance-toolbar strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:1.04rem;
}

.attendance-toolbar span[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.91rem;
}

.attendance-toolbar > div:last-child[b-mctvjw20ir] {
    display:flex;
    gap:8px;
}

.attendance-toolbar button[b-mctvjw20ir] {
    min-height:40px;
    padding:0 13px;
    border:1px solid rgba(10,114,87,.20);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.attendance-register-list[b-mctvjw20ir] {
    display:flex;
    max-height:55vh;
    overflow:auto;
    flex-direction:column;
    gap:10px;
    padding-right:5px;
}

.attendance-row[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:64px minmax(180px,1fr) 180px 155px minmax(180px,1fr);
    align-items:center;
    gap:11px;
    padding:12px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:15px;
    background:#fff;
}

.attendance-row.attended[b-mctvjw20ir] { border-left-color:var(--theme-primary); }
.attendance-row.late[b-mctvjw20ir] { border-left-color:#987634; }
.attendance-row.absent[b-mctvjw20ir] { border-left-color:#b54d43; }

.attendance-row > img[b-mctvjw20ir] {
    width:64px;
    height:64px;
    border-radius:17px;
    object-fit:cover;
}

.attendance-person strong[b-mctvjw20ir],
.attendance-person small[b-mctvjw20ir] {
    display:block;
}

.attendance-person strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.attendance-person small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.attendance-recorder[b-mctvjw20ir] {
    margin-top:16px !important;
}

.attendance-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#225c7a) !important;
}

/* COMPLETION */

.completion-score-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:18px 0;
}

.completion-score-grid article[b-mctvjw20ir] {
    min-height:112px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-top:4px solid var(--theme-primary);
    border-radius:16px;
    background:#fff;
}

.completion-score-grid article.watch[b-mctvjw20ir] {
    border-top-color:#987634;
}

.completion-score-grid article.risk[b-mctvjw20ir] {
    border-top-color:#b54d43;
}

.completion-score-grid small[b-mctvjw20ir],
.completion-score-grid strong[b-mctvjw20ir],
.completion-score-grid span[b-mctvjw20ir] {
    display:block;
}

.completion-score-grid small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.completion-score-grid strong[b-mctvjw20ir] {
    margin-top:6px;
    color:var(--theme-ink);
    font-size:1.35rem;
}

.completion-score-grid span[b-mctvjw20ir] {
    margin-top:5px;
    color:#5f746a;
    font-size:.90rem;
}

.completion-photo-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.completion-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.activity-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:300px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.activity-cover-photo[b-mctvjw20ir] {
    height:220px;
    overflow:hidden;
    border-radius:15px;
    background:#e7f5ef;
}

.activity-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.activity-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.activity-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.42rem;
}

.activity-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.96rem;
    line-height:1.7;
}

.activity-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.activity-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.activity-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.activity-emblem.full[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.activity-emblem.ongoing[b-mctvjw20ir] { color:#2f789f; border-color:#d8eaf2; }
.activity-emblem.completed[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.activity-emblem.postponed[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.activity-emblem.cancelled[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }

.activity-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.3rem;
}

.activity-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.activity-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.pet-document-photo[b-mctvjw20ir] {
    width:128px;
    height:96px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:22px;
    background:#e7f5ef;
}

.pet-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:var(--theme-primary) !important;
    border-color:rgba(10,114,87,.28) !important;
}

.view-attendance-button[b-mctvjw20ir] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-complete-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.result-score-strip[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

.result-score-strip article[b-mctvjw20ir] {
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.result-score-strip small[b-mctvjw20ir],
.result-score-strip strong[b-mctvjw20ir] {
    display:block;
}

.result-score-strip small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.result-score-strip strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--theme-primary);
    font-size:1.16rem;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    gap:12px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #aebcb6;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card.attended[b-mctvjw20ir] { border-left-color:var(--theme-primary); }
.vaccine-card.late[b-mctvjw20ir] { border-left-color:#987634; }
.vaccine-card.absent[b-mctvjw20ir] { border-left-color:#b54d43; }

.vaccine-card > img[b-mctvjw20ir] {
    width:70px;
    height:70px;
    border-radius:18px;
    object-fit:cover;
}

.vaccine-card > div > div[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-card p[b-mctvjw20ir],
.vaccine-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-mctvjw20ir] {
    margin:5px 0;
}

.vaccine-card em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.attendance-chip.attended[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.attendance-chip.late[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.attendance-chip.absent[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.attendance-chip.not-recorded[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.history-empty[b-mctvjw20ir] {
    padding:25px;
    border:1px dashed rgba(10,114,87,.20);
    border-radius:14px;
    color:#71837a;
    text-align:center;
}

/* ATTACHMENTS */

.attachment-card.cover > span[b-mctvjw20ir] { background:rgba(10,114,87,.90); }
.attachment-card.venue > span[b-mctvjw20ir] { background:rgba(47,120,159,.90); }
.attachment-card.activity > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }
.attachment-card.schedule > span[b-mctvjw20ir] { background:rgba(152,118,52,.90); }
.attachment-card.safety > span[b-mctvjw20ir] { background:rgba(181,77,67,.90); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(57,121,79,.90); }
.attachment-card.report > span[b-mctvjw20ir] { background:rgba(115,86,155,.90); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.75 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.07rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1650px) {
    .category-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .activity-upload-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media (max-width:1500px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .activity-cover-panel[b-mctvjw20ir] {
        grid-template-columns:260px minmax(0,1fr) 130px;
    }
}

@media (max-width:1150px) {
    .activity-upload-grid[b-mctvjw20ir],
    .vaccine-card-list[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .attendance-row[b-mctvjw20ir] {
        grid-template-columns:60px minmax(180px,1fr) 170px;
    }

    .attendance-time-field[b-mctvjw20ir],
    .attendance-note-field[b-mctvjw20ir] {
        grid-column:auto / span 1;
    }

    .activity-cover-panel[b-mctvjw20ir] {
        grid-template-columns:230px minmax(0,1fr);
    }

    .activity-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .category-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .activity-preview-grid[b-mctvjw20ir],
    .participant-activity-summary[b-mctvjw20ir],
    .completion-summary-grid[b-mctvjw20ir],
    .completion-score-grid[b-mctvjw20ir],
    .completion-photo-grid[b-mctvjw20ir],
    .activity-upload-grid[b-mctvjw20ir],
    .vaccine-card-list[b-mctvjw20ir],
    .result-score-strip[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-participant-preview > img[b-mctvjw20ir] {
        width:100%;
        height:240px;
    }

    .attendance-toolbar[b-mctvjw20ir] {
        align-items:flex-start;
        flex-direction:column;
    }

    .attendance-row[b-mctvjw20ir] {
        grid-template-columns:58px minmax(0,1fr);
    }

    .attendance-status-select[b-mctvjw20ir],
    .attendance-time-field[b-mctvjw20ir],
    .attendance-note-field[b-mctvjw20ir] {
        grid-column:1 / -1;
    }

    .activity-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .activity-cover-photo[b-mctvjw20ir] {
        height:250px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .vaccine-form-modal[b-mctvjw20ir],
    .attendance-form-modal[b-mctvjw20ir],
    .completion-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .activity-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   PET REGISTRATION โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.76;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(84,155,124,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.total[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.dog[b-mctvjw20ir] {
    --accent:#c56b2a;
    --soft:#fff0df;
    --border:rgba(197,107,42,.18);
}

.summary-card.vaccine[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.chip[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.status-overview-card.pending > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.active > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.transferred > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.lost > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.deceased > span[b-mctvjw20ir] { background:#687872; }

.species-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin:15px 0 0;
}

.species-overview-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:70px minmax(0,1fr);
    min-height:118px;
    overflow:hidden;
    align-items:center;
    gap:14px;
    padding:18px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 12px 28px rgba(5,62,46,.06);
    transition:.18s ease;
}

.species-overview-card:hover[b-mctvjw20ir],
.species-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:var(--species-color);
    box-shadow:0 18px 38px rgba(5,62,46,.13);
}

.species-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:68px;
    height:68px;
    place-items:center;
    border-radius:19px;
    color:var(--species-color);
    background:var(--species-soft);
}

.species-overview-card small[b-mctvjw20ir],
.species-overview-card strong[b-mctvjw20ir],
.species-overview-card em[b-mctvjw20ir] {
    display:block;
}

.species-overview-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.92rem;
    font-weight:700;
}

.species-overview-card strong[b-mctvjw20ir] {
    margin-top:4px;
    color:var(--species-color);
    font-size:1.42rem;
    font-weight:850;
}

.species-overview-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.species-overview-card.dog[b-mctvjw20ir] {
    --species-color:#c56b2a;
    --species-soft:#fff0df;
}

.species-overview-card.cat[b-mctvjw20ir] {
    --species-color:#73569b;
    --species-soft:#f0eafb;
}

.species-overview-card.other[b-mctvjw20ir] {
    --species-color:#2f789f;
    --species-soft:#e8f3f8;
}

.health-metric-grid article.due > span[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.health-metric-grid article.overdue > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.health-metric-grid article.neutered > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.photo > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:94px minmax(0,1fr);
    min-width:360px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:94px;
    height:94px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:25px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.08rem;
    font-weight:850;
    line-height:1.55;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.owner-house-cell[b-mctvjw20ir],
.breed-cell[b-mctvjw20ir],
.vaccine-cell[b-mctvjw20ir],
.identity-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir] {
    display:flex;
    min-width:185px;
    flex-direction:column;
    gap:7px;
}

.owner-house-cell strong[b-mctvjw20ir],
.breed-cell strong[b-mctvjw20ir],
.vaccine-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.owner-house-cell span[b-mctvjw20ir],
.owner-house-cell small[b-mctvjw20ir],
.owner-house-cell em[b-mctvjw20ir],
.breed-cell small[b-mctvjw20ir],
.vaccine-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
    line-height:1.55;
}

.owner-house-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
}

.species-chip[b-mctvjw20ir],
.pet-status-chip[b-mctvjw20ir],
.vaccine-chip[b-mctvjw20ir],
.warning-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.species-chip.dog[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.species-chip.cat[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.species-chip.other[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }

.pet-status-chip.pending[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.pet-status-chip.active[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.pet-status-chip.transferred[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.pet-status-chip.lost[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.pet-status-chip.deceased[b-mctvjw20ir] { color:#687872; background:#edf1ef; }
.pet-status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.vaccine-chip.current[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.vaccine-chip.due-soon[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.vaccine-chip.overdue[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.vaccine-chip.no-data[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.warning-chip[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.identity-cell span[b-mctvjw20ir] {
    display:flex;
    min-height:38px;
    align-items:center;
    gap:7px;
    padding:0 10px;
    border:1px solid rgba(10,114,87,.09);
    border-radius:11px;
    color:var(--theme-ink);
    background:#f7fbf8;
    font-size:.90rem;
}

.identity-cell small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:750;
}

.officer-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-mctvjw20ir],
.officer-cell small[b-mctvjw20ir] {
    display:block;
}

.officer-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.vaccine[b-mctvjw20ir] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

/* OWNER PREVIEW */

.linked-owner-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:125px minmax(0,1fr) 220px;
    align-items:center;
    gap:18px;
    margin:15px 0 24px;
    padding:16px;
    border:1px solid rgba(10,114,87,.14);
    border-radius:19px;
    background:#f1f8f3;
}

.owner-preview-photo[b-mctvjw20ir] {
    display:grid;
    width:125px;
    height:125px;
    overflow:hidden;
    place-items:center;
    border-radius:24px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.owner-preview-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.owner-preview-photo .mud-icon-root[b-mctvjw20ir] {
    font-size:3.5rem;
}

.linked-owner-preview small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.05em;
}

.linked-owner-preview h3[b-mctvjw20ir] {
    margin:6px 0 0;
    color:var(--theme-ink);
    font-size:1.28rem;
}

.linked-owner-preview p[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#71837a;
    font-size:.94rem;
}

.linked-owner-preview > div:nth-child(2) > div[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.linked-owner-preview > div:nth-child(2) > div span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:38px;
    align-items:center;
    padding:0 11px;
    border-radius:10px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.house-preview-photo[b-mctvjw20ir] {
    height:135px;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:18px;
    cursor:zoom-in;
}

.house-preview-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

/* UPLOAD */

.pet-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.pet-upload-card[b-mctvjw20ir] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.pet-upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.pet-upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.pet-upload-heading strong[b-mctvjw20ir],
.pet-upload-heading small[b-mctvjw20ir] {
    display:block;
}

.pet-upload-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.pet-upload-heading small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.pet-upload-preview[b-mctvjw20ir] {
    height:175px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.pet-upload-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-upload-empty[b-mctvjw20ir] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.pet-upload-empty strong[b-mctvjw20ir],
.pet-upload-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.privacy-warning[b-mctvjw20ir] {
    margin-top:19px;
    font-size:.98rem !important;
}

/* VACCINE FORM */

.vaccine-form-modal[b-mctvjw20ir] {
    width:min(1080px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.vaccine-pet-summary[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:110px 1.3fr 1fr 1fr;
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.vaccine-pet-summary > img[b-mctvjw20ir] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.vaccine-pet-summary small[b-mctvjw20ir],
.vaccine-pet-summary strong[b-mctvjw20ir],
.vaccine-pet-summary span[b-mctvjw20ir] {
    display:block;
}

.vaccine-pet-summary small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-pet-summary strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.vaccine-pet-summary span[b-mctvjw20ir] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.vaccine-upload-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:minmax(0,1fr) 250px 150px;
    align-items:center;
    gap:13px;
    max-width:760px;
    margin:20px auto 0;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
}

.vaccine-upload-card > div:first-child[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
}

.vaccine-upload-card > div:first-child > span[b-mctvjw20ir] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-upload-card strong[b-mctvjw20ir],
.vaccine-upload-card small[b-mctvjw20ir] {
    display:block;
}

.vaccine-upload-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.vaccine-upload-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-upload-preview[b-mctvjw20ir] {
    display:grid;
    height:130px;
    overflow:hidden;
    place-items:center;
    border-radius:14px;
    color:#71837a;
    background:var(--theme-bg);
}

.vaccine-upload-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.vaccine-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

/* VIEW */

.stray-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.stray-cover-photo[b-mctvjw20ir] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.stray-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.stray-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.stray-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.stray-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.stray-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.stray-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.stray-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.stray-emblem.pending[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.stray-emblem.transferred[b-mctvjw20ir] { color:#2f789f; border-color:#d8eaf2; }
.stray-emblem.lost[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.stray-emblem.deceased[b-mctvjw20ir] { color:#687872; border-color:#dfe6e2; }
.stray-emblem.cancelled[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }

.stray-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.4rem;
}

.stray-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.stray-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.pet-document-photo[b-mctvjw20ir] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.vaccine-history-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    background:#fff;
}

.vaccine-card-list[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.vaccine-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px;
    border-left:5px solid #2f789f;
    border-radius:14px;
    background:#f7fbf8;
}

.vaccine-card > span[b-mctvjw20ir] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:15px;
    color:#2f789f;
    background:#e8f3f8;
}

.vaccine-card > div > div[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.vaccine-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.vaccine-card small[b-mctvjw20ir],
.vaccine-card p[b-mctvjw20ir],
.vaccine-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.vaccine-card p[b-mctvjw20ir] {
    margin:5px 0;
}

.vaccine-card em[b-mctvjw20ir] {
    color:#2f789f;
    font-style:normal;
}

.attachment-card.pet > span[b-mctvjw20ir] { background:rgba(197,107,42,.92); }
.attachment-card.owner > span[b-mctvjw20ir] { background:rgba(10,114,87,.92); }
.attachment-card.house > span[b-mctvjw20ir] { background:rgba(77,124,104,.92); }
.attachment-card.vaccine > span[b-mctvjw20ir] { background:rgba(47,120,159,.92); }
.attachment-card.chip > span[b-mctvjw20ir] { background:rgba(115,86,155,.92); }
.attachment-card.neuter > span[b-mctvjw20ir] { background:rgba(57,121,79,.92); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.07rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1500px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .pet-upload-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:250px minmax(0,1fr) 130px;
    }
}

@media (max-width:1050px) {
    .linked-owner-preview[b-mctvjw20ir] {
        grid-template-columns:115px minmax(0,1fr);
    }

    .house-preview-photo[b-mctvjw20ir] {
        grid-column:1 / -1;
        height:220px;
    }

    .vaccine-pet-summary[b-mctvjw20ir] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .vaccine-pet-summary > div:last-child[b-mctvjw20ir] {
        grid-column:2 / -1;
    }

    .vaccine-upload-card[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .stray-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .species-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .pet-upload-grid[b-mctvjw20ir],
    .vaccine-card-list[b-mctvjw20ir],
    .vaccine-pet-summary[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .linked-owner-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .owner-preview-photo[b-mctvjw20ir] {
        width:100%;
        height:230px;
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-photo[b-mctvjw20ir] {
        height:280px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .vaccine-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .stray-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   PET VACCINATION & DISEASE CONTROL โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.76;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(61,145,122,.30), transparent 38%),
        linear-gradient(138deg, #1f6b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.pets[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.overdue[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.disease[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.summary-card.stock[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(5,minmax(0,1fr));
}

.status-overview-card.current > span[b-mctvjw20ir] { background:var(--theme-primary); }
.status-overview-card.due-soon > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.overdue > span[b-mctvjw20ir] { background:#b54d43; }
.status-overview-card.no-data > span[b-mctvjw20ir] { background:#687872; }

/* DISEASE STATUS */

.disease-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.disease-overview-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:110px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.disease-overview-card:hover[b-mctvjw20ir],
.disease-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:var(--disease-color);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.disease-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--disease-color);
    background:var(--disease-soft);
}

.disease-overview-card small[b-mctvjw20ir],
.disease-overview-card strong[b-mctvjw20ir] {
    display:block;
}

.disease-overview-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.disease-overview-card strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--disease-color);
    font-size:1.28rem;
    font-weight:850;
}

.disease-overview-card.all[b-mctvjw20ir] {
    --disease-color:var(--theme-primary);
    --disease-soft:#e7f5ef;
}

.disease-overview-card.normal[b-mctvjw20ir] {
    --disease-color:var(--theme-primary);
    --disease-soft:#e7f5ef;
}

.disease-overview-card.watch[b-mctvjw20ir] {
    --disease-color:#987634;
    --disease-soft:#fff4df;
}

.disease-overview-card.suspected[b-mctvjw20ir] {
    --disease-color:#c56b2a;
    --disease-soft:#fff0df;
}

.disease-overview-card.quarantine[b-mctvjw20ir] {
    --disease-color:#b54d43;
    --disease-soft:#fff0ee;
}

.disease-overview-card.treating[b-mctvjw20ir] {
    --disease-color:#73569b;
    --disease-soft:#f0eafb;
}

/* CAMPAIGNS */

.campaign-panel[b-mctvjw20ir] {
    margin-top:18px;
    padding:20px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:23px;
    background:
        radial-gradient(circle at 95% 0%, rgba(10,114,87,.08), transparent 25%),
        linear-gradient(145deg,#fff,#f6faf7);
    box-shadow:0 16px 38px rgba(5,62,46,.07);
}

.campaign-heading[b-mctvjw20ir] {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:17px;
}

.campaign-heading small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.campaign-heading h2[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#2d463c;
    font-size:1.42rem;
}

.campaign-heading p[b-mctvjw20ir] {
    margin:6px 0 0;
    color:#71837a;
    font-size:.95rem;
}

.campaign-add-button[b-mctvjw20ir],
.campaign-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,var(--theme-primary),#07513f) !important;
}

.campaign-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}

.campaign-card[b-mctvjw20ir] {
    overflow:hidden;
    border:1px solid rgba(10,114,87,.11);
    border-radius:20px;
    background:#fff;
    box-shadow:0 12px 28px rgba(5,62,46,.07);
    transition:.18s ease;
}

.campaign-card:hover[b-mctvjw20ir] {
    transform:translateY(-3px);
    box-shadow:0 20px 40px rgba(5,62,46,.13);
}

.campaign-photo[b-mctvjw20ir] {
    position:relative;
    display:block;
    width:100%;
    height:170px;
    overflow:hidden;
    padding:0;
    border:0;
    background:#edf5f1;
    cursor:zoom-in;
}

.campaign-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.campaign-status[b-mctvjw20ir] {
    position:absolute;
    top:12px;
    right:12px;
    display:inline-flex;
    min-height:36px;
    align-items:center;
    padding:0 12px;
    border-radius:999px;
    color:#fff;
    background:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    box-shadow:0 7px 18px rgba(0,0,0,.14);
}

.campaign-status.draft[b-mctvjw20ir] { background:#687872; }
.campaign-status.open[b-mctvjw20ir] { background:var(--theme-primary); }
.campaign-status.ongoing[b-mctvjw20ir] { background:#2f789f; }
.campaign-status.completed[b-mctvjw20ir] { background:#73569b; }
.campaign-status.cancelled[b-mctvjw20ir] { background:#b54d43; }

.campaign-content[b-mctvjw20ir] {
    padding:15px;
}

.campaign-content > small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.campaign-content h3[b-mctvjw20ir] {
    margin:4px 0 0;
    color:var(--theme-ink);
    font-size:1.05rem;
    line-height:1.55;
}

.campaign-meta[b-mctvjw20ir] {
    display:flex;
    flex-direction:column;
    gap:7px;
    margin-top:12px;
}

.campaign-meta span[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    gap:7px;
    color:#71837a;
    font-size:.90rem;
}

.campaign-progress[b-mctvjw20ir] {
    margin-top:14px;
    padding:12px;
    border-radius:14px;
    background:#f5faf7;
}

.campaign-progress > div:first-child[b-mctvjw20ir],
.campaign-progress > div:last-child[b-mctvjw20ir] {
    display:flex;
    justify-content:space-between;
    gap:9px;
}

.campaign-progress span[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.campaign-progress strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.progress-track[b-mctvjw20ir] {
    height:10px;
    overflow:hidden;
    margin:8px 0;
    border-radius:999px;
    background:var(--theme-border);
}

.progress-track i[b-mctvjw20ir] {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--theme-primary),#55a87c);
}

.campaign-actions[b-mctvjw20ir] {
    display:flex;
    gap:8px;
    margin-top:13px;
}

.campaign-actions button[b-mctvjw20ir] {
    display:inline-flex;
    min-height:40px;
    flex:1;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:1px solid rgba(10,114,87,.18);
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-family:'Kanit',sans-serif;
    font-size:.90rem;
    font-weight:750;
    cursor:pointer;
}

.campaign-actions button:disabled[b-mctvjw20ir] {
    opacity:.45;
    cursor:not-allowed;
}

/* METRICS */

.health-metric-grid article.current > span[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.health-metric-grid article.month > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.health-metric-grid article.treatment > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.health-metric-grid article.rabies > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

/* TABLE */

.pet-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    min-width:350px;
    align-items:center;
    gap:14px;
}

.pet-photo-mini[b-mctvjw20ir] {
    width:92px;
    height:92px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:24px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.pet-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.pet-photo-cell strong[b-mctvjw20ir] {
    display:block;
    color:var(--theme-ink);
    font-size:1.07rem;
    font-weight:850;
    line-height:1.55;
}

.pet-photo-cell small[b-mctvjw20ir],
.pet-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.pet-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.owner-cell[b-mctvjw20ir],
.last-vaccine-cell[b-mctvjw20ir],
.due-cell[b-mctvjw20ir],
.disease-cell[b-mctvjw20ir],
.follow-up-cell[b-mctvjw20ir] {
    display:flex;
    min-width:190px;
    flex-direction:column;
    gap:7px;
}

.owner-cell strong[b-mctvjw20ir],
.last-vaccine-cell strong[b-mctvjw20ir],
.due-cell strong[b-mctvjw20ir],
.disease-cell strong[b-mctvjw20ir],
.follow-up-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.owner-cell span[b-mctvjw20ir],
.owner-cell small[b-mctvjw20ir],
.last-vaccine-cell small[b-mctvjw20ir],
.due-cell small[b-mctvjw20ir],
.disease-cell small[b-mctvjw20ir],
.follow-up-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.last-vaccine-cell > span[b-mctvjw20ir],
.follow-up-cell > span[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
}

.vaccine-chip[b-mctvjw20ir],
.disease-chip[b-mctvjw20ir],
.species-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.vaccine-chip.current[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.vaccine-chip.due-soon[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.vaccine-chip.overdue[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.vaccine-chip.no-data[b-mctvjw20ir] { color:#687872; background:#edf1ef; }

.disease-chip.normal[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.disease-chip.watch[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.disease-chip.suspected[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.disease-chip.quarantine[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }
.disease-chip.treating[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.disease-chip.resolved[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }

.species-chip[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.officer-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    min-width:210px;
    align-items:center;
    gap:10px;
}

.officer-cell > span[b-mctvjw20ir] {
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.officer-cell strong[b-mctvjw20ir],
.officer-cell small[b-mctvjw20ir] {
    display:block;
}

.officer-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.95rem;
}

.officer-cell small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
}

.row-action.vaccine[b-mctvjw20ir] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.disease[b-mctvjw20ir] {
    color:#b54d43 !important;
    background:#fff0ee !important;
}

.row-action.follow[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* MODALS */

.report-form-modal[b-mctvjw20ir],
.assignment-form-modal[b-mctvjw20ir],
.status-form-modal[b-mctvjw20ir],
.outcome-form-modal[b-mctvjw20ir] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.modal-icon.danger[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.modal-icon.follow[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.modal-icon.campaign[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.selected-pet-summary[b-mctvjw20ir],
.follow-up-case-summary[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:110px repeat(3,minmax(0,1fr));
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.selected-pet-summary > img[b-mctvjw20ir],
.follow-up-case-summary > img[b-mctvjw20ir] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.selected-pet-summary small[b-mctvjw20ir],
.selected-pet-summary strong[b-mctvjw20ir],
.selected-pet-summary span[b-mctvjw20ir],
.follow-up-case-summary small[b-mctvjw20ir],
.follow-up-case-summary strong[b-mctvjw20ir],
.follow-up-case-summary span[b-mctvjw20ir] {
    display:block;
}

.selected-pet-summary small[b-mctvjw20ir],
.follow-up-case-summary small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.selected-pet-summary strong[b-mctvjw20ir],
.follow-up-case-summary strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.selected-pet-summary span[b-mctvjw20ir],
.follow-up-case-summary span[b-mctvjw20ir] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.disease-summary[b-mctvjw20ir] {
    border-color:rgba(181,77,67,.14);
    background:#fff8f7;
}

.document-upload-card[b-mctvjw20ir] {
    max-width:540px;
    margin:20px auto 0;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 24px rgba(5,62,46,.05);
}

.document-upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.document-upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:14px;
    color:#2f789f;
    background:#e8f3f8;
}

.document-upload-heading strong[b-mctvjw20ir],
.document-upload-heading small[b-mctvjw20ir] {
    display:block;
}

.document-upload-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.document-upload-heading small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.document-preview[b-mctvjw20ir] {
    height:210px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.document-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.document-empty[b-mctvjw20ir] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.document-empty strong[b-mctvjw20ir],
.document-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.disease-upload-grid[b-mctvjw20ir],
.campaign-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:20px;
}

.disease-upload-grid .document-upload-card[b-mctvjw20ir],
.campaign-upload-grid .document-upload-card[b-mctvjw20ir] {
    max-width:none;
    margin:0;
}

.follow-up-photo-card[b-mctvjw20ir] {
    max-width:620px;
}

.zoonotic-warning[b-mctvjw20ir] {
    margin-top:18px;
    font-size:.97rem !important;
}

.vaccination-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

.disease-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#b54d43,#8f342d) !important;
}

.follow-up-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.stray-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.stray-cover-photo[b-mctvjw20ir] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.stray-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.stray-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.stray-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.stray-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.stray-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.stray-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.stray-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.stray-emblem.watch[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.stray-emblem.suspected[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.stray-emblem.quarantine[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }
.stray-emblem.treating[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }

.stray-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.4rem;
}

.stray-emblem strong[b-mctvjw20ir] {
    font-size:1.05rem;
    text-align:center;
}

.stray-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.pet-document-photo[b-mctvjw20ir] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.pet-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.view-vaccine-button[b-mctvjw20ir] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-disease-button[b-mctvjw20ir] {
    color:#b54d43 !important;
    border-color:rgba(181,77,67,.28) !important;
}

.view-follow-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.disease-document-list[b-mctvjw20ir] {
    display:grid;
    gap:10px;
    margin-top:14px;
}

.disease-document-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:1.5fr repeat(3,minmax(0,1fr));
    gap:12px;
    padding:14px;
    border:1px solid rgba(10,114,87,.10);
    border-left:5px solid #987634;
    border-radius:13px;
    background:#f7fbf8;
}

.disease-document-card.quarantine[b-mctvjw20ir] {
    border-left-color:#b54d43;
}

.disease-document-card.treating[b-mctvjw20ir] {
    border-left-color:#73569b;
}

.disease-document-card.resolved[b-mctvjw20ir] {
    border-left-color:var(--theme-primary);
}

.disease-document-card strong[b-mctvjw20ir],
.disease-document-card span[b-mctvjw20ir],
.disease-document-card small[b-mctvjw20ir] {
    display:block;
}

.disease-document-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.disease-document-card span[b-mctvjw20ir],
.disease-document-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.record-card-list[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
}

.record-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:14px;
    border-left:5px solid #2f789f;
    border-radius:14px;
    background:#f7fbf8;
}

.record-card > span[b-mctvjw20ir] {
    display:grid;
    width:52px;
    height:52px;
    place-items:center;
    border-radius:15px;
    color:#2f789f;
    background:#e8f3f8;
}

.record-card > div > div[b-mctvjw20ir] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.record-card strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.98rem;
}

.record-card small[b-mctvjw20ir],
.record-card p[b-mctvjw20ir],
.record-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.record-card p[b-mctvjw20ir] {
    margin:5px 0;
}

.record-card em[b-mctvjw20ir] {
    color:#2f789f;
    font-style:normal;
}

.attachment-card.pet > span[b-mctvjw20ir] { background:rgba(197,107,42,.92); }
.attachment-card.owner > span[b-mctvjw20ir] { background:rgba(10,114,87,.92); }
.attachment-card.house > span[b-mctvjw20ir] { background:rgba(77,124,104,.92); }
.attachment-card.vaccine > span[b-mctvjw20ir] { background:rgba(47,120,159,.92); }
.attachment-card.chip > span[b-mctvjw20ir] { background:rgba(115,86,155,.92); }
.attachment-card.disease > span[b-mctvjw20ir] { background:rgba(181,77,67,.92); }
.attachment-card.medical > span[b-mctvjw20ir] { background:rgba(115,86,155,.92); }
.attachment-card.result > span[b-mctvjw20ir] { background:rgba(57,121,79,.92); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.07rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1550px) {
    .campaign-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .disease-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:1100px) {
    .selected-pet-summary[b-mctvjw20ir],
    .follow-up-case-summary[b-mctvjw20ir] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .selected-pet-summary > div:last-child[b-mctvjw20ir],
    .follow-up-case-summary > div:last-child[b-mctvjw20ir] {
        grid-column:2 / -1;
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .stray-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }

    .disease-document-card[b-mctvjw20ir] {
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .disease-overview[b-mctvjw20ir],
    .campaign-grid[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .health-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .selected-pet-summary[b-mctvjw20ir],
    .follow-up-case-summary[b-mctvjw20ir],
    .disease-upload-grid[b-mctvjw20ir],
    .campaign-upload-grid[b-mctvjw20ir],
    .record-card-list[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .campaign-heading[b-mctvjw20ir] {
        flex-direction:column;
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-photo[b-mctvjw20ir] {
        height:280px;
    }

    .disease-document-card[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .assignment-form-modal[b-mctvjw20ir],
    .status-form-modal[b-mctvjw20ir],
    .outcome-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .stray-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}


/* =========================================================
   STRAY ANIMAL REPORT & RESCUE โ€” PREMIUM LARGE TEXT
   ========================================================= */

.stray-page[b-mctvjw20ir] {
    font-size:17px;
    line-height:1.76;
}

.stray-hero[b-mctvjw20ir] {
    background:
        radial-gradient(circle at 88% 5%, rgba(245,197,95,.42), transparent 31%),
        radial-gradient(circle at 7% 112%, rgba(70,155,125,.30), transparent 38%),
        linear-gradient(138deg, #216b56 0%, #174f45 54%, #0a3430 100%);
}

.summary-card.reports[b-mctvjw20ir] {
    --accent:var(--theme-primary);
    --soft:#e7f5ef;
    --border:rgba(10,114,87,.18);
}

.summary-card.urgent[b-mctvjw20ir] {
    --accent:#b54d43;
    --soft:#fff0ee;
    --border:rgba(181,77,67,.18);
}

.summary-card.rescue[b-mctvjw20ir] {
    --accent:#2f789f;
    --soft:#e8f3f8;
    --border:rgba(47,120,159,.18);
}

.summary-card.completed[b-mctvjw20ir] {
    --accent:#73569b;
    --soft:#f0eafb;
    --border:rgba(115,86,155,.18);
}

.status-overview[b-mctvjw20ir] {
    grid-template-columns:repeat(7,minmax(0,1fr));
}

.status-overview-card.new > span[b-mctvjw20ir] { background:#c56b2a; }
.status-overview-card.assigned > span[b-mctvjw20ir] { background:#2f789f; }
.status-overview-card.on-site > span[b-mctvjw20ir] { background:#987634; }
.status-overview-card.treating > span[b-mctvjw20ir] { background:#73569b; }
.status-overview-card.shelter > span[b-mctvjw20ir] { background:#4e7c68; }
.status-overview-card.completed > span[b-mctvjw20ir] { background:var(--theme-primary); }

/* PRIORITY OVERVIEW */

.priority-overview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:11px;
    margin:15px 0 0;
}

.priority-overview-card[b-mctvjw20ir] {
    position:relative;
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    min-height:108px;
    overflow:hidden;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:18px;
    color:#40544b;
    background:linear-gradient(145deg,#fff,#f7fbf8);
    font-family:'Kanit',sans-serif;
    text-align:left;
    cursor:pointer;
    box-shadow:0 11px 26px rgba(5,62,46,.055);
    transition:.18s ease;
}

.priority-overview-card:hover[b-mctvjw20ir],
.priority-overview-card.selected[b-mctvjw20ir] {
    transform:translateY(-3px);
    border-color:var(--priority-color);
    box-shadow:0 17px 34px rgba(5,62,46,.12);
}

.priority-overview-card > span[b-mctvjw20ir] {
    display:grid;
    width:58px;
    height:58px;
    place-items:center;
    border-radius:16px;
    color:var(--priority-color);
    background:var(--priority-soft);
}

.priority-overview-card small[b-mctvjw20ir],
.priority-overview-card strong[b-mctvjw20ir],
.priority-overview-card em[b-mctvjw20ir] {
    display:block;
}

.priority-overview-card small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-weight:700;
}

.priority-overview-card strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--priority-color);
    font-size:1.28rem;
    font-weight:850;
}

.priority-overview-card em[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    font-style:normal;
}

.priority-overview-card.all[b-mctvjw20ir] {
    --priority-color:var(--theme-primary);
    --priority-soft:#e7f5ef;
}

.priority-overview-card.normal[b-mctvjw20ir] {
    --priority-color:#687872;
    --priority-soft:#edf1ef;
}

.priority-overview-card.high[b-mctvjw20ir] {
    --priority-color:#987634;
    --priority-soft:#fff4df;
}

.priority-overview-card.urgent[b-mctvjw20ir] {
    --priority-color:#c56b2a;
    --priority-soft:#fff0df;
}

.priority-overview-card.critical[b-mctvjw20ir] {
    --priority-color:#b54d43;
    --priority-soft:#fff0ee;
}

/* METRICS */

.animal-metric-grid article.dog > span[b-mctvjw20ir] {
    color:#c56b2a;
    background:#fff0df;
}

.animal-metric-grid article.cat > span[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.animal-metric-grid article.group > span[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.animal-metric-grid article.aggressive > span[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

/* TABLE */

.animal-photo-cell[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:94px minmax(0,1fr);
    min-width:355px;
    align-items:center;
    gap:14px;
}

.animal-photo-mini[b-mctvjw20ir] {
    width:94px;
    height:94px;
    overflow:hidden;
    padding:0;
    border:1px solid rgba(10,114,87,.13);
    border-radius:25px;
    background:#e7f5ef;
    cursor:zoom-in;
}

.animal-photo-mini img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.animal-photo-cell strong[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    color:var(--theme-ink);
    font-size:1.07rem;
    font-weight:850;
    line-height:1.55;
}

.animal-photo-cell small[b-mctvjw20ir],
.animal-photo-cell em[b-mctvjw20ir] {
    display:block;
    margin-top:5px;
    color:#71837a;
    font-size:.91rem;
}

.animal-photo-cell em[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-style:normal;
}

.animal-count-badge[b-mctvjw20ir] {
    display:inline-flex;
    min-height:32px;
    align-items:center;
    padding:0 10px;
    border-radius:999px;
    color:#2f789f;
    background:#e8f3f8;
    font-size:.90rem;
    font-weight:800;
}

.location-cell[b-mctvjw20ir],
.priority-cell[b-mctvjw20ir],
.status-cell[b-mctvjw20ir],
.team-cell[b-mctvjw20ir],
.care-cell[b-mctvjw20ir],
.reporter-cell[b-mctvjw20ir] {
    display:flex;
    min-width:185px;
    flex-direction:column;
    gap:7px;
}

.location-cell strong[b-mctvjw20ir],
.priority-cell strong[b-mctvjw20ir],
.status-cell strong[b-mctvjw20ir],
.team-cell strong[b-mctvjw20ir],
.care-cell strong[b-mctvjw20ir],
.reporter-cell strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.97rem;
}

.location-cell > span[b-mctvjw20ir],
.location-cell small[b-mctvjw20ir],
.priority-cell small[b-mctvjw20ir],
.status-cell small[b-mctvjw20ir],
.team-cell span[b-mctvjw20ir],
.team-cell small[b-mctvjw20ir],
.care-cell small[b-mctvjw20ir],
.reporter-cell span[b-mctvjw20ir],
.reporter-cell small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
    line-height:1.55;
}

.location-cell > div[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.risk-mini[b-mctvjw20ir] {
    display:inline-flex;
    min-height:31px;
    align-items:center;
    padding:0 8px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:750;
}

.risk-mini.traffic[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.risk-mini.school[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.risk-mini.market[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.priority-chip[b-mctvjw20ir],
.status-chip[b-mctvjw20ir],
.care-chip[b-mctvjw20ir],
.species-chip[b-mctvjw20ir],
.unassigned-chip[b-mctvjw20ir] {
    display:inline-flex;
    width:fit-content;
    min-height:37px;
    align-items:center;
    gap:6px;
    padding:0 12px;
    border-radius:999px;
    font-size:.90rem;
    font-weight:800;
}

.priority-chip.low[b-mctvjw20ir],
.priority-chip.normal[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.priority-chip.high[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.priority-chip.urgent[b-mctvjw20ir] {
    color:#c56b2a;
    background:#fff0df;
}

.priority-chip.critical[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.status-chip.new[b-mctvjw20ir] { color:#c56b2a; background:#fff0df; }
.status-chip.verifying[b-mctvjw20ir] { color:#987634; background:#fff4df; }
.status-chip.assigned[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.on-site[b-mctvjw20ir] { color:#2f789f; background:#e8f3f8; }
.status-chip.rescued[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.treating[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.shelter[b-mctvjw20ir] { color:#4e7c68; background:#e8f1ed; }
.status-chip.returned[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.adopted[b-mctvjw20ir] { color:#73569b; background:#f0eafb; }
.status-chip.completed[b-mctvjw20ir] { color:var(--theme-primary); background:#e7f5ef; }
.status-chip.cancelled[b-mctvjw20ir] { color:#b54d43; background:#fff0ee; }

.care-chip.current[b-mctvjw20ir],
.care-chip.given[b-mctvjw20ir] {
    color:var(--theme-primary);
    background:#e7f5ef;
}

.care-chip.overdue[b-mctvjw20ir] {
    color:#b54d43;
    background:#fff0ee;
}

.care-chip.unknown[b-mctvjw20ir] {
    color:#687872;
    background:#edf1ef;
}

.unassigned-chip[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.row-action.assign[b-mctvjw20ir] {
    color:#2f789f !important;
    background:#e8f3f8 !important;
}

.row-action.status[b-mctvjw20ir] {
    color:#987634 !important;
    background:#fff4df !important;
}

.row-action.outcome[b-mctvjw20ir] {
    color:#73569b !important;
    background:#f0eafb !important;
}

/* MODALS */

.report-form-modal[b-mctvjw20ir],
.assignment-form-modal[b-mctvjw20ir],
.status-form-modal[b-mctvjw20ir],
.outcome-form-modal[b-mctvjw20ir] {
    width:min(1180px,calc(100vw - 34px));
    max-height:94vh;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 80px rgba(5,40,30,.28);
}

.modal-icon.assign[b-mctvjw20ir] {
    color:#2f789f;
    background:#e8f3f8;
}

.modal-icon.status[b-mctvjw20ir] {
    color:#987634;
    background:#fff4df;
}

.modal-icon.outcome[b-mctvjw20ir] {
    color:#73569b;
    background:#f0eafb;
}

.upload-grid[b-mctvjw20ir],
.outcome-upload-grid[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin:10px 0 20px;
}

.outcome-upload-grid[b-mctvjw20ir] {
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.upload-card[b-mctvjw20ir] {
    overflow:hidden;
    padding:14px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(5,62,46,.05);
}

.upload-heading[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:10px;
    margin-bottom:11px;
}

.upload-heading > span[b-mctvjw20ir] {
    display:grid;
    width:46px;
    height:46px;
    place-items:center;
    border-radius:14px;
    color:var(--theme-primary);
    background:#e7f5ef;
}

.upload-heading strong[b-mctvjw20ir],
.upload-heading small[b-mctvjw20ir] {
    display:block;
}

.upload-heading strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.96rem;
}

.upload-heading small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.upload-preview[b-mctvjw20ir] {
    height:190px;
    overflow:hidden;
    border-radius:14px;
    background:var(--theme-bg);
}

.upload-preview img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.upload-empty[b-mctvjw20ir] {
    display:flex;
    height:100%;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    color:#71837a;
    text-align:center;
}

.upload-empty strong[b-mctvjw20ir],
.upload-empty small[b-mctvjw20ir] {
    font-size:.90rem;
}

.selected-report-summary[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:110px repeat(3,minmax(0,1fr));
    align-items:center;
    gap:13px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid rgba(10,114,87,.11);
    border-radius:18px;
    background:#f7fbf8;
}

.selected-report-summary > img[b-mctvjw20ir] {
    width:110px;
    height:110px;
    border-radius:23px;
    object-fit:cover;
}

.selected-report-summary small[b-mctvjw20ir],
.selected-report-summary strong[b-mctvjw20ir],
.selected-report-summary span[b-mctvjw20ir] {
    display:block;
}

.selected-report-summary small[b-mctvjw20ir] {
    color:#71837a;
    font-size:.90rem;
}

.selected-report-summary strong[b-mctvjw20ir] {
    margin-top:5px;
    color:var(--theme-ink);
    font-size:1.03rem;
}

.selected-report-summary span[b-mctvjw20ir] {
    margin-top:4px;
    color:#5f746a;
    font-size:.90rem;
}

.assignment-checklist[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
    margin-top:18px;
}

.assignment-checklist article[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:10px;
    padding:13px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:15px;
    background:#f7fbf8;
}

.assignment-checklist .mud-icon-root[b-mctvjw20ir] {
    color:var(--theme-primary);
}

.assignment-checklist strong[b-mctvjw20ir],
.assignment-checklist small[b-mctvjw20ir] {
    display:block;
}

.assignment-checklist strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.94rem;
}

.assignment-checklist small[b-mctvjw20ir] {
    margin-top:3px;
    color:#71837a;
    font-size:.90rem;
}

.workflow-preview[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
    margin-top:18px;
}

.workflow-step[b-mctvjw20ir] {
    min-height:125px;
    padding:12px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:14px;
    background:#f7fbf8;
    text-align:center;
}

.workflow-step.selected[b-mctvjw20ir] {
    border-color:var(--theme-primary);
    background:#e7f5ef;
    box-shadow:0 10px 22px rgba(10,114,87,.12);
}

.workflow-step > span[b-mctvjw20ir] {
    display:grid;
    width:44px;
    height:44px;
    margin:0 auto 8px;
    place-items:center;
    border-radius:13px;
    color:var(--theme-primary);
    background:#fff;
}

.workflow-step strong[b-mctvjw20ir],
.workflow-step small[b-mctvjw20ir] {
    display:block;
}

.workflow-step strong[b-mctvjw20ir] {
    color:var(--theme-ink);
    font-size:.91rem;
}

.workflow-step small[b-mctvjw20ir] {
    margin-top:4px;
    color:#71837a;
    font-size:.90rem;
    line-height:1.45;
}

.assignment-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#2f789f,#235d79) !important;
}

.status-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#987634,#74561f) !important;
}

.outcome-save-button[b-mctvjw20ir] {
    color:#fff !important;
    background:linear-gradient(135deg,#73569b,#584078) !important;
}

/* VIEW */

.stray-cover-panel[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:280px minmax(0,1fr) 145px;
    gap:18px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(10,114,87,.10);
    border-radius:17px;
    background:#f5faf6;
}

.stray-cover-photo[b-mctvjw20ir] {
    height:250px;
    overflow:hidden;
    border-radius:19px;
    background:#e7f5ef;
}

.stray-cover-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.stray-cover-content small[b-mctvjw20ir] {
    color:var(--theme-primary);
    font-size:.90rem;
    font-weight:800;
    letter-spacing:.07em;
}

.stray-cover-content h2[b-mctvjw20ir] {
    margin:7px 0 0;
    color:#26463c;
    font-size:1.55rem;
}

.stray-cover-content p[b-mctvjw20ir] {
    margin:9px 0 0;
    color:#5f746a;
    font-size:.97rem;
}

.stray-cover-meta[b-mctvjw20ir] {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:15px;
}

.stray-cover-meta span[b-mctvjw20ir] {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    gap:7px;
    padding:0 12px;
    border-radius:11px;
    color:var(--theme-primary);
    background:#fff;
    font-size:.90rem;
    font-weight:750;
}

.stray-emblem[b-mctvjw20ir] {
    display:flex;
    width:132px;
    min-height:160px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:7px;
    border:10px solid #d8e7e1;
    border-radius:24px;
    color:var(--theme-primary);
    background:#fff;
}

.stray-emblem.new[b-mctvjw20ir] { color:#c56b2a; border-color:#f8ddc7; }
.stray-emblem.verifying[b-mctvjw20ir] { color:#987634; border-color:#f2e6c9; }
.stray-emblem.assigned[b-mctvjw20ir],
.stray-emblem.on-site[b-mctvjw20ir] { color:#2f789f; border-color:#d8eaf2; }
.stray-emblem.treating[b-mctvjw20ir] { color:#73569b; border-color:#e8def4; }
.stray-emblem.cancelled[b-mctvjw20ir] { color:#b54d43; border-color:#f4d7d3; }

.stray-emblem .mud-icon-root[b-mctvjw20ir] {
    font-size:2.4rem;
}

.stray-emblem strong[b-mctvjw20ir] {
    font-size:1.02rem;
    text-align:center;
}

.stray-emblem small[b-mctvjw20ir] {
    font-size:.90rem;
}

.animal-document-photo[b-mctvjw20ir] {
    width:112px;
    height:112px;
    overflow:hidden;
    border:7px solid #eef6f1;
    border-radius:28px;
    background:#e7f5ef;
}

.animal-document-photo img[b-mctvjw20ir] {
    width:100%;
    height:100%;
    object-fit:cover;
}

.owner-match-card[b-mctvjw20ir] {
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    gap:13px;
    margin-top:14px;
    padding:15px;
    border:1px solid rgba(47,120,159,.18);
    border-radius:15px;
    background:#edf7fb;
}

.owner-match-card > span[b-mctvjw20ir] {
    display:grid;
    width:60px;
    height:60px;
    place-items:center;
    border-radius:17px;
    color:#2f789f;
    background:#fff;
}

.owner-match-card small[b-mctvjw20ir] {
    color:#2f789f;
    font-size:.90rem;
    font-weight:800;
}

.owner-match-card h4[b-mctvjw20ir] {
    margin:3px 0 0;
    color:var(--theme-ink);
    font-size:1.02rem;
}

.owner-match-card p[b-mctvjw20ir] {
    margin:4px 0 0;
    color:#71837a;
    font-size:.91rem;
}

.view-assign-button[b-mctvjw20ir] {
    color:#2f789f !important;
    border-color:rgba(47,120,159,.28) !important;
}

.view-outcome-button[b-mctvjw20ir] {
    color:#73569b !important;
    border-color:rgba(115,86,155,.28) !important;
}

.attachment-card.animal > span[b-mctvjw20ir] { background:rgba(197,107,42,.92); }
.attachment-card.location > span[b-mctvjw20ir] { background:rgba(10,114,87,.92); }
.attachment-card.additional > span[b-mctvjw20ir] { background:rgba(47,120,159,.92); }
.attachment-card.outcome > span[b-mctvjw20ir] { background:rgba(115,86,155,.92); }
.attachment-card.medical > span[b-mctvjw20ir] { background:rgba(181,77,67,.92); }

/* LARGE TEXT */

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
    padding:19px 15px !important;
    font-size:.97rem !important;
    line-height:1.76 !important;
}

.stray-page[b-mctvjw20ir]  .stray-table .mud-table-head .mud-table-cell {
    min-height:68px;
    color:#26463c;
    font-size:.99rem !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.stray-page[b-mctvjw20ir]  .mud-input,
.stray-page[b-mctvjw20ir]  .mud-select-input {
    font-size:1.07rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-input-label {
    font-size:1.03rem !important;
    font-weight:650 !important;
}

.stray-page[b-mctvjw20ir]  .mud-list-item-text {
    font-size:1.05rem !important;
}

.stray-page[b-mctvjw20ir]  .mud-button-label {
    font-size:1.01rem !important;
    font-weight:750 !important;
}

@media (max-width:1550px) {
    .status-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .priority-overview[b-mctvjw20ir] {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .animal-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .workflow-preview[b-mctvjw20ir] {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}

@media (max-width:1100px) {
    .selected-report-summary[b-mctvjw20ir] {
        grid-template-columns:100px repeat(2,minmax(0,1fr));
    }

    .selected-report-summary > div:last-child[b-mctvjw20ir] {
        grid-column:2 / -1;
    }

    .upload-grid[b-mctvjw20ir] {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .assignment-checklist[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:220px minmax(0,1fr);
    }

    .stray-emblem[b-mctvjw20ir] {
        grid-column:1 / -1;
        width:100%;
        min-height:100px;
        border-width:7px;
    }
}

@media (max-width:780px) {
    .status-overview[b-mctvjw20ir],
    .priority-overview[b-mctvjw20ir],
    .follow-grid[b-mctvjw20ir],
    .animal-metric-grid[b-mctvjw20ir],
    .reference-grid[b-mctvjw20ir],
    .measurement-document-grid[b-mctvjw20ir],
    .selected-report-summary[b-mctvjw20ir],
    .upload-grid[b-mctvjw20ir],
    .outcome-upload-grid[b-mctvjw20ir],
    .workflow-preview[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-panel[b-mctvjw20ir] {
        grid-template-columns:minmax(0,1fr);
    }

    .stray-cover-photo[b-mctvjw20ir] {
        height:280px;
    }

    .stray-page[b-mctvjw20ir]  .stray-table .mud-table-cell {
        padding:15px 11px !important;
        font-size:.93rem !important;
    }

    .report-form-modal[b-mctvjw20ir],
    .assignment-form-modal[b-mctvjw20ir],
    .status-form-modal[b-mctvjw20ir],
    .outcome-form-modal[b-mctvjw20ir],
    .stray-view-modal[b-mctvjw20ir] {
        width:calc(100vw - 16px);
    }
}

@media print {
    #stray-report-print-area[b-mctvjw20ir],
    #stray-report-print-area *[b-mctvjw20ir] {
        visibility:visible !important;
    }

    #stray-report-print-area[b-mctvjw20ir] {
        position:absolute;
        inset:0 auto auto 0;
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        box-shadow:none;
        font-size:10.8pt !important;
        line-height:1.48 !important;
    }

    .stray-view-modal[b-mctvjw20ir] {
        position:static !important;
        width:100% !important;
        max-width:none !important;
        max-height:none !important;
        overflow:visible !important;
        border:0 !important;
        box-shadow:none !important;
    }

    .document-header[b-mctvjw20ir],
    .document-status-strip[b-mctvjw20ir],
    .stray-cover-panel[b-mctvjw20ir],
    .document-section[b-mctvjw20ir],
    .document-footer[b-mctvjw20ir] {
        break-inside:avoid;
    }
}
/* /Components/Pages/03Marketplace/01Marketplace/01Shop/MarketplaceShops.razor.rz.scp.css */
.shop-directory-page[b-1v59rb81ez] {
    min-height: 100vh;
    background:
        radial-gradient(circle at top right, rgba(16, 185, 129, 0.10), transparent 34rem),
        radial-gradient(circle at bottom left, rgba(14, 116, 144, 0.08), transparent 36rem),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #f5f8fa 48%, #f8fafc 100%);
    color: #17231f;
    font-family: 'Kanit', sans-serif;
    font-size: 17px;
    padding: 26px 0 70px;
}

.shop-directory-container[b-1v59rb81ez] {
    width: min(100%, 1680px);
    margin: 0 auto;
    padding-left: clamp(16px, 2.3vw, 34px) !important;
    padding-right: clamp(16px, 2.3vw, 34px) !important;
}

.shop-hero[b-1v59rb81ez] {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 430px);
    gap: clamp(28px, 4vw, 72px);
    min-height: 360px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.74);
    border-radius: 34px;
    padding: clamp(34px, 5vw, 72px);
    color: #fff;
    background:
        linear-gradient(124deg, rgba(6, 78, 59, 0.98) 0%, rgba(4, 120, 87, 0.95) 52%, rgba(15, 118, 110, 0.92) 100%);
    box-shadow: 0 28px 70px rgba(6, 78, 59, 0.22);
}

.shop-hero[b-1v59rb81ez]::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -3;
    opacity: 0.17;
    background-image:
        linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
    background-size: 58px 58px;
    mask-image: linear-gradient(to right, #000, transparent 84%);
}

.shop-hero[b-1v59rb81ez]::after {
    content: '';
    position: absolute;
    right: -120px;
    bottom: -270px;
    width: 640px;
    height: 640px;
    z-index: -2;
    border: 90px solid rgba(255, 255, 255, 0.06);
    border-radius: 50%;
}

.hero-decoration[b-1v59rb81ez] {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.07);
    pointer-events: none;
}

.hero-decoration-one[b-1v59rb81ez] {
    width: 260px;
    height: 260px;
    top: -130px;
    left: 36%;
}

.hero-decoration-two[b-1v59rb81ez] {
    width: 110px;
    height: 110px;
    left: 48%;
    bottom: 24px;
}

.hero-main[b-1v59rb81ez] {
    align-self: center;
    max-width: 880px;
}

.hero-label[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 10px 17px 10px 10px;
    border: 1px solid rgba(255, 255, 255, 0.23);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(14px);
}

.hero-label-icon[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: #065f46;
    background: linear-gradient(145deg, #ffffff, #dcfce7);
    box-shadow: 0 9px 20px rgba(0, 0, 0, 0.16);
}

.hero-label-icon[b-1v59rb81ez]  .mud-icon-root {
    font-size: 28px;
}

.hero-label div[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    line-height: 1.32;
}

.hero-label small[b-1v59rb81ez] {
    color: #a7f3d0;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.hero-label strong[b-1v59rb81ez] {
    margin-top: 2px;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
}

.hero-main h1[b-1v59rb81ez] {
    max-width: 930px;
    margin: 28px 0 12px;
    color: #fff;
    font-size: clamp(2.25rem, 4vw, 4.35rem);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -0.04em;
    text-shadow: 0 10px 30px rgba(0, 0, 0, 0.17);
}

.hero-main > p[b-1v59rb81ez] {
    max-width: 860px;
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: clamp(1.05rem, 1.35vw, 1.3rem);
    font-weight: 450;
    line-height: 1.78;
}

.hero-meta-row[b-1v59rb81ez] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 27px;
}

.hero-meta-row span[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, 0.19);
    border-radius: 14px;
    color: #ecfdf5;
    background: rgba(2, 44, 34, 0.24);
    font-size: 0.96rem;
    font-weight: 650;
}

.hero-summary-panel[b-1v59rb81ez] {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 22px;
    padding: clamp(22px, 3vw, 32px);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 28px;
    background:
        linear-gradient(155deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.08));
    backdrop-filter: blur(18px);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.22), 0 24px 44px rgba(0, 0, 0, 0.13);
}

.hero-live-row[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 13px;
}

.live-indicator[b-1v59rb81ez] {
    position: relative;
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    border: 3px solid rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 0 7px rgba(52, 211, 153, 0.16);
}

.hero-live-row div[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
}

.hero-live-row strong[b-1v59rb81ez] {
    color: #fff;
    font-size: 1.11rem;
    font-weight: 800;
}

.hero-live-row small[b-1v59rb81ez] {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
}

.hero-revenue[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    padding: 23px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.hero-revenue small[b-1v59rb81ez] {
    color: #d1fae5;
    font-size: 0.98rem;
    font-weight: 600;
}

.hero-revenue strong[b-1v59rb81ez] {
    margin: 4px 0 2px;
    color: #fff;
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 900;
    line-height: 1.18;
}

.hero-revenue span[b-1v59rb81ez] {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.96rem;
    font-weight: 550;
}

.hero-buttons[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: 1fr 52px;
    gap: 10px;
}

[b-1v59rb81ez] .hero-primary-button {
    min-height: 52px;
    border-radius: 15px;
    color: var(--theme-dark) !important;
    background: #fff !important;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
}

[b-1v59rb81ez] .hero-refresh-button {
    width: 52px;
    height: 52px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 15px;
    color: #fff;
    background: rgba(255, 255, 255, 0.11);
}

[b-1v59rb81ez] .hero-refresh-button:hover {
    background: rgba(255, 255, 255, 0.20);
}

[b-1v59rb81ez] .page-loading {
    height: 5px;
    margin: -5px 18px 0;
    border-radius: 0 0 999px 999px;
    overflow: hidden;
}

[b-1v59rb81ez] .page-alert {
    margin-top: 22px;
    border-radius: 18px;
    font-family: 'Kanit', sans-serif;
    font-size: 1.03rem;
}

.summary-grid[b-1v59rb81ez] {
    margin-top: 10px;
}

.summary-card[b-1v59rb81ez] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 146px;
    overflow: hidden;
    padding: 22px;
    border: 1px solid #e6eee9;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.065);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.summary-card[b-1v59rb81ez]::after {
    content: '';
    position: absolute;
    right: -42px;
    top: -62px;
    width: 142px;
    height: 142px;
    border-radius: 50%;
    background: var(--summary-soft, #ecfdf5);
}

.summary-card:hover[b-1v59rb81ez] {
    transform: translateY(-4px);
    border-color: #c8e3d5;
    box-shadow: 0 22px 42px rgba(15, 23, 42, 0.105);
}

.summary-card-total[b-1v59rb81ez] {
    --summary-main: #047857;
    --summary-soft: #d1fae5;
}

.summary-card-pending[b-1v59rb81ez] {
    --summary-main: #b45309;
    --summary-soft: #fef3c7;
}

.summary-card-verified[b-1v59rb81ez] {
    --summary-main: #0369a1;
    --summary-soft: #e0f2fe;
}

.summary-card-rating[b-1v59rb81ez] {
    --summary-main: #7c3aed;
    --summary-soft: #ede9fe;
}

.summary-icon[b-1v59rb81ez] {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 66px;
    height: 66px;
    border-radius: 20px;
    color: #fff;
    background: var(--summary-main);
    box-shadow: 0 12px 24px color-mix(in srgb, var(--summary-main) 28%, transparent);
}

.summary-icon[b-1v59rb81ez]  .mud-icon-root {
    font-size: 33px;
}

.summary-card > div[b-1v59rb81ez] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.summary-card small[b-1v59rb81ez] {
    color: #63726b;
    font-size: 0.94rem;
    font-weight: 650;
}

.summary-card strong[b-1v59rb81ez] {
    margin: 2px 0 1px;
    color: #18231f;
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.14;
}

.summary-card strong em[b-1v59rb81ez] {
    color: #6b7d74;
    font-size: 0.92rem;
    font-style: normal;
    font-weight: 650;
}

.summary-card p[b-1v59rb81ez] {
    margin: 3px 0 0;
    color: #718078;
    font-size: 0.89rem;
    line-height: 1.38;
}

.insight-strip[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 18px 0 0;
    overflow: hidden;
    border: 1px solid #e5ede8;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.045);
}

.insight-strip article[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
    padding: 18px 22px;
    border-right: 1px solid #ebf0ed;
}

.insight-strip article:last-child[b-1v59rb81ez] {
    border-right: 0;
}

.insight-strip article > span[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 45px;
    height: 45px;
    border-radius: 15px;
    color: #047857;
    background: #ecfdf5;
}

.insight-strip article > div[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.insight-strip small[b-1v59rb81ez] {
    color: #738078;
    font-size: 0.84rem;
    font-weight: 600;
}

.insight-strip strong[b-1v59rb81ez] {
    overflow: hidden;
    color: #1c2a23;
    font-size: 1.1rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filter-panel[b-1v59rb81ez] {
    margin-top: 26px;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid #e2ebe6;
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.055);
}

.section-heading[b-1v59rb81ez] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.section-heading > div:first-child[b-1v59rb81ez] {
    min-width: 0;
}

.section-heading small[b-1v59rb81ez] {
    display: block;
    color: #059669;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
}

.section-heading h2[b-1v59rb81ez] {
    margin: 4px 0 1px;
    color: #17231f;
    font-size: clamp(1.7rem, 2.3vw, 2.3rem);
    font-weight: 900;
    line-height: 1.2;
}

.section-heading p[b-1v59rb81ez] {
    margin: 0;
    color: #68776f;
    font-size: 1rem;
    line-height: 1.55;
}

.result-count-box[b-1v59rb81ez] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    flex: 0 0 auto;
    min-width: 142px;
    padding: 13px 17px;
    border: 1px solid #d9ebe1;
    border-radius: 16px;
    color: #456057;
    background: #f2fbf6;
}

.result-count-box span[b-1v59rb81ez],
.result-count-box em[b-1v59rb81ez] {
    font-size: 0.89rem;
    font-style: normal;
    font-weight: 650;
}

.result-count-box strong[b-1v59rb81ez] {
    color: #047857;
    font-size: 1.65rem;
    font-weight: 900;
}

.filter-grid[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: minmax(320px, 1.7fr) repeat(4, minmax(180px, 1fr));
    gap: 15px;
    margin-top: 26px;
    align-items: start;
}

.filter-action-group[b-1v59rb81ez] {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

[b-1v59rb81ez] .large-control .mud-input-control-input-container {
    border-radius: 14px;
}

[b-1v59rb81ez] .large-control .mud-input-label {
    color: #52645b;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 600;
}

[b-1v59rb81ez] .large-control .mud-input-slot {
    min-height: 27px;
    color: #1d2b24;
    font-family: 'Kanit', sans-serif;
    font-size: 1.04rem;
    font-weight: 500;
}

[b-1v59rb81ez] .large-control .mud-input-outlined-border {
    border-color: #d2ddd7;
    border-radius: 14px;
}

[b-1v59rb81ez] .large-control:hover .mud-input-outlined-border {
    border-color: #7cb89a;
}

[b-1v59rb81ez] .large-control .mud-input-adornment-start {
    color: #0f8a61;
}

[b-1v59rb81ez] .search-button,
[b-1v59rb81ez] .reset-button {
    min-height: 48px;
    border-radius: 14px;
    padding: 0 20px;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
}

[b-1v59rb81ez] .search-button {
    color: #fff !important;
    background: linear-gradient(135deg, #047857, #059669) !important;
    box-shadow: 0 10px 20px rgba(5, 150, 105, 0.22);
}

[b-1v59rb81ez] .reset-button {
    border-color: #9cb7aa !important;
    color: #315348 !important;
    background: #fff !important;
}

.filter-bottom-row[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #edf1ef;
}

.filter-bottom-row[b-1v59rb81ez]  .mud-switch-label {
    color: #33463d;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 650;
}

.update-text[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #718078;
    font-size: 0.91rem;
}

.shop-card-grid[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 24px;
}

.shop-card[b-1v59rb81ez] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e1eae5;
    border-radius: 27px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07);
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.shop-card:hover[b-1v59rb81ez] {
    transform: translateY(-6px);
    border-color: #b8d9c8;
    box-shadow: 0 25px 50px rgba(15, 23, 42, 0.115);
}

.shop-cover[b-1v59rb81ez] {
    position: relative;
    height: 242px;
    overflow: hidden;
    background: #dcefe4;
}

.shop-cover > img[b-1v59rb81ez] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms ease;
}

.shop-card:hover .shop-cover > img[b-1v59rb81ez] {
    transform: scale(1.045);
}

.cover-shade[b-1v59rb81ez] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(7, 21, 15, 0.15) 0%, transparent 40%, rgba(5, 20, 14, 0.82) 100%);
}

.cover-top-row[b-1v59rb81ez] {
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.shop-status[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 35px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 999px;
    color: #fff;
    background: rgba(31, 41, 55, 0.72);
    backdrop-filter: blur(10px);
    font-size: 0.82rem;
    font-weight: 750;
    white-space: nowrap;
}

.shop-status i[b-1v59rb81ez] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.12);
}

.status-active[b-1v59rb81ez] {
    color: #d1fae5;
    background: rgba(4, 120, 87, 0.86);
}

.status-pending[b-1v59rb81ez] {
    color: #fff7d6;
    background: rgba(180, 83, 9, 0.86);
}

.status-suspended[b-1v59rb81ez] {
    color: #fee2e2;
    background: rgba(185, 28, 28, 0.86);
}

.cover-badges[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.featured-badge[b-1v59rb81ez],
.verified-badge[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 35px;
    border: 1px solid rgba(255, 255, 255, 0.38);
    color: #fff;
    backdrop-filter: blur(10px);
}

.featured-badge[b-1v59rb81ez] {
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(124, 58, 237, 0.82);
    font-size: 0.8rem;
    font-weight: 750;
}

.verified-badge[b-1v59rb81ez] {
    width: 35px;
    border-radius: 12px;
    background: rgba(2, 132, 199, 0.88);
}

.shop-cover-bottom[b-1v59rb81ez] {
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.category-badge[b-1v59rb81ez],
.source-badge[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    border-radius: 999px;
    color: #fff;
    backdrop-filter: blur(10px);
    white-space: nowrap;
}

.category-badge[b-1v59rb81ez] {
    flex: 0 0 auto;
    padding: 7px 11px;
    background: rgba(5, 150, 105, 0.78);
    font-size: 0.81rem;
    font-weight: 750;
}

.source-badge[b-1v59rb81ez] {
    gap: 5px;
    overflow: hidden;
    padding: 7px 10px;
    background: rgba(15, 23, 42, 0.62);
    font-size: 0.75rem;
    font-weight: 600;
    text-overflow: ellipsis;
}

.shop-card-body[b-1v59rb81ez] {
    padding: 20px;
}

.shop-identity-row[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
}

.owner-avatar[b-1v59rb81ez] {
    width: 58px;
    height: 58px;
    border: 3px solid #fff;
    border-radius: 18px;
    object-fit: cover;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.13);
}

.shop-title-group[b-1v59rb81ez] {
    min-width: 0;
}

.shop-code[b-1v59rb81ez] {
    display: block;
    color: #059669;
    font-size: 0.73rem;
    font-weight: 850;
    letter-spacing: 0.055em;
}

.shop-title-group h3[b-1v59rb81ez] {
    overflow: hidden;
    margin: 2px 0 1px;
    color: #17231f;
    font-size: 1.26rem;
    font-weight: 900;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-title-group p[b-1v59rb81ez] {
    overflow: hidden;
    margin: 0;
    color: #6f7d76;
    font-size: 0.91rem;
    font-weight: 550;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rating-box[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    color: #b45309;
}

.rating-box[b-1v59rb81ez] >  .mud-icon-root {
    font-size: 20px;
}

.rating-box strong[b-1v59rb81ez] {
    color: #6b4511;
    font-size: 1rem;
    font-weight: 900;
}

.rating-box small[b-1v59rb81ez] {
    color: #8c7c67;
    font-size: 0.7rem;
    white-space: nowrap;
}

.shop-type-row[b-1v59rb81ez] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.shop-type-row span[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    padding: 7px 10px;
    border: 1px solid #e1ebe6;
    border-radius: 12px;
    color: #496057;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: 0.83rem;
    font-weight: 650;
}

.shop-description[b-1v59rb81ez] {
    display: -webkit-box;
    min-height: 52px;
    margin: 14px 0;
    overflow: hidden;
    color: #66756e;
    font-size: 0.93rem;
    line-height: 1.58;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.shop-stat-grid[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: 0.78fr 1.35fr 0.95fr;
    overflow: hidden;
    border: 1px solid #e5ede8;
    border-radius: 16px;
    background: #f9fbfa;
}

.shop-stat-grid > div[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 12px;
    border-right: 1px solid #e8eeeb;
}

.shop-stat-grid > div:last-child[b-1v59rb81ez] {
    border-right: 0;
}

.shop-stat-grid small[b-1v59rb81ez] {
    color: #748079;
    font-size: 0.72rem;
    font-weight: 650;
}

.shop-stat-grid strong[b-1v59rb81ez] {
    overflow: hidden;
    margin: 1px 0;
    color: #1e2c25;
    font-size: 1rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-stat-grid span[b-1v59rb81ez] {
    overflow: hidden;
    color: #849089;
    font-size: 0.7rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-contact-preview[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 13px;
    overflow: hidden;
}

.shop-contact-preview span[b-1v59rb81ez] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    overflow: hidden;
    color: #6e7b74;
    font-size: 0.8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-contact-preview span:first-child[b-1v59rb81ez] {
    flex: 0 0 auto;
}

.shop-contact-preview span:last-child[b-1v59rb81ez] {
    flex: 1 1 auto;
}

.shop-card-actions[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: 1fr 44px 44px;
    gap: 8px;
    margin-top: 17px;
    padding-top: 16px;
    border-top: 1px solid #edf1ef;
}

[b-1v59rb81ez] .view-button {
    min-height: 44px;
    border-radius: 13px;
    color: #fff !important;
    background: linear-gradient(135deg, #047857, #059669) !important;
    font-family: 'Kanit', sans-serif;
    font-size: 0.94rem;
    font-weight: 800;
    text-transform: none;
}

[b-1v59rb81ez] .edit-icon-button,
[b-1v59rb81ez] .delete-icon-button {
    width: 44px;
    height: 44px;
    border-radius: 13px;
}

[b-1v59rb81ez] .edit-icon-button {
    border: 1px solid #bfdbfe;
    color: #1d4ed8;
    background: #eff6ff;
}

[b-1v59rb81ez] .delete-icon-button {
    border: 1px solid #fecaca;
    color: #b91c1c;
    background: #fff1f2;
}

.empty-state[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 380px;
    margin-top: 24px;
    padding: 36px;
    border: 1px dashed #bbd5c8;
    border-radius: 28px;
    text-align: center;
    background: rgba(255, 255, 255, 0.85);
}

.empty-state > span[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 86px;
    height: 86px;
    border-radius: 27px;
    color: #047857;
    background: #ecfdf5;
}

.empty-state > span[b-1v59rb81ez]  .mud-icon-root {
    font-size: 44px;
}

.empty-state h3[b-1v59rb81ez] {
    margin: 18px 0 3px;
    color: #1d2b24;
    font-size: 1.55rem;
    font-weight: 900;
}

.empty-state p[b-1v59rb81ez] {
    margin: 0 0 20px;
    color: #6f7d76;
    font-size: 1rem;
}

[b-1v59rb81ez] .empty-reset-button {
    min-height: 48px;
    border-radius: 14px;
    color: #fff !important;
    background: #047857 !important;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
}

.pagination-panel[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 22px;
    padding: 17px 20px;
    border: 1px solid #e2ebe6;
    border-radius: 19px;
    color: #5e6f66;
    background: rgba(255, 255, 255, 0.95);
}

.pagination-panel > div:first-child[b-1v59rb81ez] {
    font-size: 0.96rem;
}

.pagination-panel > div:first-child strong[b-1v59rb81ez] {
    color: #047857;
    font-size: 1.06rem;
}

.pagination-panel > div:first-child span[b-1v59rb81ez] {
    margin-left: 10px;
    color: #87928d;
}

.pagination-actions[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.current-page[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border-radius: 13px;
    color: #fff;
    background: #047857;
    font-weight: 850;
}

[b-1v59rb81ez] .page-button {
    min-height: 43px;
    border-radius: 13px;
    border-color: #a9c5b7 !important;
    color: #365a4b !important;
    background: #fff !important;
    font-family: 'Kanit', sans-serif;
    font-size: 0.92rem;
    font-weight: 750;
    text-transform: none;
}

.detail-panel[b-1v59rb81ez],
.editor-panel[b-1v59rb81ez] {
    margin-top: 28px;
    overflow: hidden;
    border: 1px solid #dfe9e4;
    border-radius: 30px;
    background: #fff;
    box-shadow: 0 24px 58px rgba(15, 23, 42, 0.10);
}

.detail-header[b-1v59rb81ez],
.editor-header[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 25px 30px;
    border-bottom: 1px solid #e9efec;
    background: linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--theme-bg) 42%, white));
}

.detail-header small[b-1v59rb81ez],
.editor-header small[b-1v59rb81ez] {
    color: #059669;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.11em;
}

.detail-header h2[b-1v59rb81ez],
.editor-header h2[b-1v59rb81ez] {
    margin: 3px 0 1px;
    color: #17231f;
    font-size: clamp(1.55rem, 2vw, 2rem);
    font-weight: 900;
}

.detail-header p[b-1v59rb81ez],
.editor-header p[b-1v59rb81ez] {
    margin: 0;
    color: #738078;
    font-size: 0.95rem;
}

[b-1v59rb81ez] .close-panel-button {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    border: 1px solid #dce5e0;
    border-radius: 14px;
    color: #52645b;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-hero[b-1v59rb81ez] {
    position: relative;
    height: 330px;
    overflow: hidden;
}

.detail-cover[b-1v59rb81ez] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-cover-shade[b-1v59rb81ez] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(7, 18, 12, 0.08), rgba(5, 22, 15, 0.82));
}

.detail-shop-identity[b-1v59rb81ez] {
    position: absolute;
    left: clamp(22px, 4vw, 54px);
    right: 190px;
    bottom: 30px;
    display: flex;
    align-items: center;
    gap: 18px;
    color: #fff;
}

.detail-shop-identity > img[b-1v59rb81ez] {
    width: 94px;
    height: 94px;
    border: 5px solid rgba(255, 255, 255, 0.9);
    border-radius: 26px;
    object-fit: cover;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.24);
}

.detail-shop-identity > div[b-1v59rb81ez] {
    min-width: 0;
}

.detail-shop-identity span[b-1v59rb81ez] {
    color: #a7f3d0;
    font-size: 0.83rem;
    font-weight: 850;
    letter-spacing: 0.07em;
}

.detail-shop-identity h3[b-1v59rb81ez] {
    margin: 2px 0 0;
    overflow: hidden;
    color: #fff;
    font-size: clamp(1.7rem, 3vw, 2.65rem);
    font-weight: 900;
    line-height: 1.18;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-shop-identity p[b-1v59rb81ez] {
    margin: 2px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.06rem;
}

.detail-hero > .shop-status[b-1v59rb81ez] {
    position: absolute;
    right: clamp(22px, 4vw, 54px);
    bottom: 42px;
}

.detail-content-grid[b-1v59rb81ez] {
    padding: 9px 17px 20px;
}

.detail-info-card[b-1v59rb81ez],
.detail-performance-card[b-1v59rb81ez],
.image-source-card[b-1v59rb81ez],
.status-action-card[b-1v59rb81ez],
.editor-card[b-1v59rb81ez],
.editor-side-card[b-1v59rb81ez] {
    border: 1px solid #e1ebe6;
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.045);
}

.detail-info-card[b-1v59rb81ez],
.detail-performance-card[b-1v59rb81ez],
.status-action-card[b-1v59rb81ez],
.editor-card[b-1v59rb81ez],
.editor-side-card[b-1v59rb81ez] {
    padding: 23px;
}

.detail-info-card + .detail-info-card[b-1v59rb81ez] {
    margin-top: 18px;
}

.detail-section-title[b-1v59rb81ez],
.performance-title[b-1v59rb81ez],
.editor-section-heading[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding-bottom: 16px;
    border-bottom: 1px solid #edf1ef;
}

.detail-section-title > span[b-1v59rb81ez],
.performance-title > span[b-1v59rb81ez],
.editor-section-heading > span[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    color: #047857;
    background: #ecfdf5;
}

.detail-section-title h4[b-1v59rb81ez],
.performance-title h4[b-1v59rb81ez],
.editor-section-heading h3[b-1v59rb81ez] {
    margin: 0;
    color: #1d2b24;
    font-size: 1.18rem;
    font-weight: 850;
}

.detail-section-title p[b-1v59rb81ez],
.performance-title p[b-1v59rb81ez],
.editor-section-heading p[b-1v59rb81ez] {
    margin: 1px 0 0;
    color: #76827c;
    font-size: 0.87rem;
}

.information-grid[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    margin-top: 18px;
}

.information-grid > div[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 14px 15px;
    border: 1px solid #e9efec;
    border-radius: 14px;
    background: #fafcfb;
}

.information-grid .full-width[b-1v59rb81ez] {
    grid-column: 1 / -1;
}

.information-grid small[b-1v59rb81ez] {
    color: #78847d;
    font-size: 0.8rem;
    font-weight: 600;
}

.information-grid strong[b-1v59rb81ez] {
    color: #26362d;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.55;
}

.contact-detail-grid[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    margin-top: 18px;
}

.contact-detail-grid > div[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 13px;
    border: 1px solid #e6ede9;
    border-radius: 14px;
    color: #047857;
    background: #fafcfb;
}

.contact-detail-grid > div > span[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.contact-detail-grid small[b-1v59rb81ez] {
    color: #7a877f;
    font-size: 0.75rem;
}

.contact-detail-grid strong[b-1v59rb81ez] {
    overflow: hidden;
    color: #2d3d34;
    font-size: 0.92rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-performance-card[b-1v59rb81ez] {
    color: #fff;
    border: 0;
    background: linear-gradient(145deg, var(--theme-dark), #047857 58%, var(--theme-primary));
    box-shadow: 0 18px 36px rgba(6, 78, 59, 0.20);
}

.detail-performance-card .performance-title[b-1v59rb81ez] {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

.detail-performance-card .performance-title > span[b-1v59rb81ez] {
    color: #fff;
    background: rgba(255, 255, 255, 0.13);
}

.detail-performance-card .performance-title h4[b-1v59rb81ez] {
    color: #fff;
}

.detail-performance-card .performance-title p[b-1v59rb81ez] {
    color: rgba(255, 255, 255, 0.68);
}

.performance-main-number[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    padding: 22px 0;
}

.performance-main-number small[b-1v59rb81ez] {
    color: #a7f3d0;
    font-size: 0.9rem;
}

.performance-main-number strong[b-1v59rb81ez] {
    color: #fff;
    font-size: 2.45rem;
    font-weight: 900;
    line-height: 1.18;
}

.performance-main-number span[b-1v59rb81ez] {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
}

.performance-list[b-1v59rb81ez] {
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.performance-list > div[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 11px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.performance-list > div:last-child[b-1v59rb81ez] {
    border-bottom: 0;
}

.performance-list span[b-1v59rb81ez] {
    color: rgba(255, 255, 255, 0.73);
    font-size: 0.87rem;
}

.performance-list strong[b-1v59rb81ez] {
    color: #fff;
    font-size: 0.92rem;
    font-weight: 750;
}

.image-source-card[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
    padding: 18px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.image-source-icon[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 50px;
    height: 50px;
    border-radius: 16px;
    color: #0369a1;
    background: #e0f2fe;
}

.image-source-card > div:last-child[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.image-source-card small[b-1v59rb81ez] {
    color: #78847d;
    font-size: 0.76rem;
}

.image-source-card strong[b-1v59rb81ez] {
    color: #24352c;
    font-size: 0.92rem;
    font-weight: 750;
}

.image-source-card p[b-1v59rb81ez] {
    margin: 2px 0 0;
    overflow: hidden;
    color: #78908b;
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-action-card[b-1v59rb81ez] {
    margin-top: 18px;
}

.status-action-card h4[b-1v59rb81ez] {
    margin: 0;
    color: #1d2b24;
    font-size: 1.1rem;
    font-weight: 850;
}

.status-action-card > p[b-1v59rb81ez] {
    margin: 2px 0 14px;
    color: #7b8781;
    font-size: 0.85rem;
}

.status-action-card > div[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

[b-1v59rb81ez] .status-active-button,
[b-1v59rb81ez] .status-pending-button,
[b-1v59rb81ez] .status-suspend-button {
    min-height: 43px;
    border-radius: 13px;
    font-family: 'Kanit', sans-serif;
    font-size: 0.91rem;
    font-weight: 750;
    text-transform: none;
}

[b-1v59rb81ez] .status-active-button {
    color: #fff !important;
    background: #047857 !important;
}

[b-1v59rb81ez] .status-pending-button {
    border-color: #f59e0b !important;
    color: #9a5b08 !important;
}

[b-1v59rb81ez] .status-suspend-button {
    border-color: #ef4444 !important;
    color: #b91c1c !important;
}

.detail-footer-actions[b-1v59rb81ez],
.editor-footer-actions[b-1v59rb81ez] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 20px 30px 25px;
    border-top: 1px solid #e9efec;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

[b-1v59rb81ez] .detail-edit-button,
[b-1v59rb81ez] .save-button {
    min-height: 49px;
    border-radius: 14px;
    padding: 0 22px;
    color: #fff !important;
    background: linear-gradient(135deg, #047857, #059669) !important;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: none;
    box-shadow: 0 10px 22px rgba(5, 150, 105, 0.20);
}

[b-1v59rb81ez] .detail-close-button,
[b-1v59rb81ez] .cancel-button {
    min-height: 49px;
    border-radius: 14px;
    padding: 0 20px;
    border-color: #a8bdb2 !important;
    color: #405c4f !important;
    background: #fff !important;
    font-family: 'Kanit', sans-serif;
    font-size: 1rem;
    font-weight: 750;
    text-transform: none;
}

.editor-grid[b-1v59rb81ez] {
    padding: 9px 17px 20px;
}

.editor-card + .editor-card[b-1v59rb81ez] {
    margin-top: 18px;
}

.editor-card .editor-section-heading[b-1v59rb81ez],
.editor-side-card .editor-section-heading[b-1v59rb81ez] {
    margin-bottom: 20px;
}

.editor-side-card[b-1v59rb81ez] {
    position: sticky;
    top: 18px;
}

.editor-status-select[b-1v59rb81ez] {
    margin-bottom: 8px;
}

.switch-group[b-1v59rb81ez] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 10px 0 18px;
    padding: 13px;
    border: 1px solid #e6ede9;
    border-radius: 15px;
    background: #fafcfb;
}

.switch-group[b-1v59rb81ez]  .mud-switch-label {
    color: #31463a;
    font-family: 'Kanit', sans-serif;
    font-size: 0.95rem;
    font-weight: 650;
}

.editor-help-box[b-1v59rb81ez] {
    display: flex;
    gap: 11px;
    padding: 15px;
    border: 1px solid #bae6fd;
    border-radius: 15px;
    color: #0369a1;
    background: #f0f9ff;
}

.editor-help-box > div[b-1v59rb81ez] {
    min-width: 0;
}

.editor-help-box strong[b-1v59rb81ez] {
    display: block;
    color: #075985;
    font-size: 0.91rem;
    font-weight: 800;
}

.editor-help-box p[b-1v59rb81ez] {
    margin: 3px 0 0;
    color: #3f718b;
    font-size: 0.82rem;
    line-height: 1.55;
}

.editor-image-preview[b-1v59rb81ez] {
    position: relative;
    height: 190px;
    margin-top: 16px;
    overflow: hidden;
    border-radius: 17px;
    background: #e7efe9;
}

.editor-image-preview img[b-1v59rb81ez] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.editor-image-preview span[b-1v59rb81ez] {
    position: absolute;
    left: 12px;
    bottom: 12px;
    padding: 7px 10px;
    border-radius: 10px;
    color: #fff;
    background: rgba(15, 23, 42, 0.68);
    font-size: 0.8rem;
    font-weight: 650;
    backdrop-filter: blur(8px);
}

.delete-confirm-panel[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    margin-top: 26px;
    padding: 22px;
    border: 1px solid #fecaca;
    border-radius: 23px;
    background: linear-gradient(135deg, #fff7f7, #fff);
    box-shadow: 0 15px 32px rgba(127, 29, 29, 0.08);
}

.delete-confirm-icon[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    color: #b91c1c;
    background: #fee2e2;
}

.delete-confirm-icon[b-1v59rb81ez]  .mud-icon-root {
    font-size: 31px;
}

.delete-confirm-panel h3[b-1v59rb81ez] {
    margin: 0;
    color: #7f1d1d;
    font-size: 1.18rem;
    font-weight: 900;
}

.delete-confirm-panel p[b-1v59rb81ez] {
    margin: 3px 0 0;
    color: #785454;
    font-size: 0.94rem;
    line-height: 1.52;
}

.delete-confirm-actions[b-1v59rb81ez] {
    display: flex;
    gap: 8px;
}

[b-1v59rb81ez] .confirm-delete-button,
[b-1v59rb81ez] .cancel-delete-button {
    min-height: 45px;
    border-radius: 13px;
    padding: 0 17px;
    font-family: 'Kanit', sans-serif;
    font-size: 0.93rem;
    font-weight: 800;
    text-transform: none;
}

[b-1v59rb81ez] .confirm-delete-button {
    color: #fff !important;
    background: #b91c1c !important;
}

[b-1v59rb81ez] .cancel-delete-button {
    border-color: #d8a2a2 !important;
    color: #7f1d1d !important;
    background: #fff !important;
}

@media (max-width: 1450px) {
    .filter-grid[b-1v59rb81ez] {
        grid-template-columns: minmax(300px, 1.5fr) repeat(2, minmax(190px, 1fr));
    }

    .shop-card-grid[b-1v59rb81ez] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .shop-hero[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    .hero-summary-panel[b-1v59rb81ez] {
        display: grid;
        grid-template-columns: 1fr 1.2fr auto;
        align-items: center;
    }

    .hero-revenue[b-1v59rb81ez] {
        padding: 0 22px;
        border-top: 0;
        border-bottom: 0;
        border-left: 1px solid rgba(255, 255, 255, 0.15);
        border-right: 1px solid rgba(255, 255, 255, 0.15);
    }

    .hero-buttons[b-1v59rb81ez] {
        grid-template-columns: 1fr 52px;
        min-width: 240px;
    }

    .insight-strip[b-1v59rb81ez] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .insight-strip article:nth-child(2)[b-1v59rb81ez] {
        border-right: 0;
    }

    .insight-strip article:nth-child(-n+2)[b-1v59rb81ez] {
        border-bottom: 1px solid #ebf0ed;
    }
}

@media (max-width: 900px) {
    .shop-directory-page[b-1v59rb81ez] {
        padding-top: 14px;
    }

    .shop-hero[b-1v59rb81ez] {
        padding: 30px 24px;
        border-radius: 26px;
    }

    .hero-summary-panel[b-1v59rb81ez] {
        display: flex;
    }

    .hero-revenue[b-1v59rb81ez] {
        padding: 20px 0;
        border: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .filter-grid[b-1v59rb81ez] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .search-control[b-1v59rb81ez] {
        grid-column: 1 / -1;
    }

    .shop-card-grid[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    .detail-shop-identity[b-1v59rb81ez] {
        right: 26px;
        bottom: 64px;
    }

    .detail-hero > .shop-status[b-1v59rb81ez] {
        left: 26px;
        right: auto;
        bottom: 20px;
    }

    .delete-confirm-panel[b-1v59rb81ez] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .delete-confirm-actions[b-1v59rb81ez] {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
}

@media (max-width: 680px) {
    .shop-directory-page[b-1v59rb81ez] {
        font-size: 16px;
    }

    .shop-directory-container[b-1v59rb81ez] {
        padding-left: 11px !important;
        padding-right: 11px !important;
    }

    .shop-hero[b-1v59rb81ez] {
        padding: 25px 18px;
        border-radius: 23px;
    }

    .hero-label[b-1v59rb81ez] {
        width: 100%;
    }

    .hero-main h1[b-1v59rb81ez] {
        margin-top: 22px;
        font-size: 2.2rem;
    }

    .hero-main > p[b-1v59rb81ez] {
        font-size: 1rem;
        line-height: 1.65;
    }

    .hero-meta-row[b-1v59rb81ez] {
        flex-direction: column;
    }

    .hero-meta-row span[b-1v59rb81ez] {
        width: 100%;
    }

    .hero-summary-panel[b-1v59rb81ez] {
        padding: 20px;
        border-radius: 21px;
    }

    .summary-card[b-1v59rb81ez] {
        min-height: 128px;
        border-radius: 20px;
    }

    .insight-strip[b-1v59rb81ez] {
        grid-template-columns: 1fr;
        border-radius: 19px;
    }

    .insight-strip article[b-1v59rb81ez],
    .insight-strip article:nth-child(2)[b-1v59rb81ez],
    .insight-strip article:nth-child(-n+2)[b-1v59rb81ez] {
        border-right: 0;
        border-bottom: 1px solid #ebf0ed;
    }

    .insight-strip article:last-child[b-1v59rb81ez] {
        border-bottom: 0;
    }

    .filter-panel[b-1v59rb81ez] {
        padding: 20px 16px;
        border-radius: 22px;
    }

    .section-heading[b-1v59rb81ez] {
        align-items: flex-start;
        flex-direction: column;
    }

    .result-count-box[b-1v59rb81ez] {
        width: 100%;
        justify-content: center;
    }

    .filter-grid[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    .search-control[b-1v59rb81ez],
    .filter-action-group[b-1v59rb81ez] {
        grid-column: auto;
    }

    .filter-action-group[b-1v59rb81ez] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .filter-bottom-row[b-1v59rb81ez] {
        align-items: flex-start;
        flex-direction: column;
    }

    .shop-cover[b-1v59rb81ez] {
        height: 220px;
    }

    .source-badge[b-1v59rb81ez] {
        max-width: 52%;
    }

    .shop-identity-row[b-1v59rb81ez] {
        grid-template-columns: 54px minmax(0, 1fr);
    }

    .rating-box[b-1v59rb81ez] {
        grid-column: 2;
        align-items: flex-start;
        flex-direction: row;
        gap: 4px;
    }

    .rating-box small[b-1v59rb81ez] {
        align-self: center;
    }

    .shop-stat-grid[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    .shop-stat-grid > div[b-1v59rb81ez] {
        border-right: 0;
        border-bottom: 1px solid #e8eeeb;
    }

    .shop-stat-grid > div:last-child[b-1v59rb81ez] {
        border-bottom: 0;
    }

    .shop-contact-preview[b-1v59rb81ez] {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .shop-contact-preview span[b-1v59rb81ez] {
        width: 100%;
    }

    .pagination-panel[b-1v59rb81ez] {
        align-items: flex-start;
        flex-direction: column;
    }

    .pagination-actions[b-1v59rb81ez] {
        width: 100%;
    }

    [b-1v59rb81ez] .page-button {
        flex: 1 1 auto;
    }

    .detail-header[b-1v59rb81ez],
    .editor-header[b-1v59rb81ez] {
        align-items: flex-start;
        padding: 21px 18px;
    }

    .detail-hero[b-1v59rb81ez] {
        height: 300px;
    }

    .detail-shop-identity[b-1v59rb81ez] {
        left: 19px;
        right: 19px;
        bottom: 65px;
    }

    .detail-shop-identity > img[b-1v59rb81ez] {
        width: 72px;
        height: 72px;
        border-radius: 20px;
    }

    .detail-shop-identity h3[b-1v59rb81ez] {
        font-size: 1.55rem;
    }

    .detail-hero > .shop-status[b-1v59rb81ez] {
        left: 19px;
    }

    .information-grid[b-1v59rb81ez],
    .contact-detail-grid[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    .information-grid .full-width[b-1v59rb81ez] {
        grid-column: auto;
    }

    .detail-footer-actions[b-1v59rb81ez],
    .editor-footer-actions[b-1v59rb81ez] {
        display: grid;
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .delete-confirm-panel[b-1v59rb81ez] {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .delete-confirm-icon[b-1v59rb81ez] {
        margin: 0 auto;
    }

    .delete-confirm-actions[b-1v59rb81ez] {
        grid-column: auto;
        display: grid;
        grid-template-columns: 1fr;
    }
}

@media (min-width: 1900px) {
    .shop-directory-page[b-1v59rb81ez] {
        font-size: 18px;
    }

    .shop-card-grid[b-1v59rb81ez] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .shop-cover[b-1v59rb81ez] {
        height: 255px;
    }
}


/* Add/Edit shop modal: show immediately when the button is clicked. */
.editor-overlay[b-1v59rb81ez] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 24px;
    overflow-y: auto;
    background: rgba(7, 20, 14, 0.72);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    animation: shopOverlayFadeIn-b-1v59rb81ez 160ms ease-out;
}

.editor-overlay .editor-panel[b-1v59rb81ez] {
    width: min(1320px, 100%);
    max-height: calc(100vh - 48px);
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 0 34px 90px rgba(3, 18, 11, 0.34);
    animation: shopEditorSlideIn-b-1v59rb81ez 190ms ease-out;
}

.editor-overlay .editor-header[b-1v59rb81ez] {
    position: sticky;
    top: 0;
    z-index: 6;
}

.editor-overlay .editor-footer-actions[b-1v59rb81ez] {
    position: sticky;
    bottom: 0;
    z-index: 6;
    margin-top: 0;
    border-top: 1px solid #e2ebe6;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

@keyframes shopOverlayFadeIn-b-1v59rb81ez {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes shopEditorSlideIn-b-1v59rb81ez {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 700px) {
    .editor-overlay[b-1v59rb81ez] {
        padding: 0;
    }

    .editor-overlay .editor-panel[b-1v59rb81ez] {
        width: 100%;
        min-height: 100vh;
        max-height: 100vh;
        border: 0;
        border-radius: 0;
    }

    .editor-overlay .editor-header[b-1v59rb81ez] {
        padding: 18px 17px;
    }
}


/* ===== Shop delivery scope and Google Maps selector ===== */
.delivery-scope-strip[b-1v59rb81ez] {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 14px 0 2px;
    padding: 12px 13px;
    border: 1px solid;
    border-radius: 16px;
}

.delivery-scope-strip .delivery-scope-icon[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
}

.delivery-scope-strip small[b-1v59rb81ez],
.delivery-scope-strip strong[b-1v59rb81ez],
.delivery-scope-strip p[b-1v59rb81ez] {
    display: block;
    margin: 0;
}

.delivery-scope-strip small[b-1v59rb81ez] {
    color: #64748b;
    font-size: .87rem;
    font-weight: 650;
}

.delivery-scope-strip strong[b-1v59rb81ez] {
    margin-top: 1px;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 800;
}

.delivery-scope-strip p[b-1v59rb81ez] {
    margin-top: 2px;
    color: #526172;
    font-size: .9rem;
    line-height: 1.45;
}

.delivery-general[b-1v59rb81ez] {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.delivery-general .delivery-scope-icon[b-1v59rb81ez] {
    color: #1d4ed8;
    background: #dbeafe;
}

.delivery-local[b-1v59rb81ez] {
    border-color: #a7f3d0;
    background: #ecfdf5;
}

.delivery-local .delivery-scope-icon[b-1v59rb81ez] {
    color: #047857;
    background: #d1fae5;
}

.detail-coordinate-text[b-1v59rb81ez] {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: .95rem;
    font-weight: 600;
}

.local-delivery-hint[b-1v59rb81ez],
.general-delivery-hint[b-1v59rb81ez] {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    padding: 16px;
    border-radius: 17px;
}

.local-delivery-hint[b-1v59rb81ez] {
    border: 1px solid #a7f3d0;
    background: #ecfdf5;
}

.general-delivery-hint[b-1v59rb81ez] {
    border: 1px solid #bfdbfe;
    background: #eff6ff;
}

.local-delivery-hint > span[b-1v59rb81ez],
.general-delivery-hint > span[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 14px;
}

.local-delivery-hint > span[b-1v59rb81ez] {
    color: #047857;
    background: #d1fae5;
}

.general-delivery-hint > span[b-1v59rb81ez] {
    color: #1d4ed8;
    background: #dbeafe;
}

.local-delivery-hint strong[b-1v59rb81ez],
.general-delivery-hint strong[b-1v59rb81ez],
.local-delivery-hint p[b-1v59rb81ez],
.general-delivery-hint p[b-1v59rb81ez] {
    display: block;
    margin: 0;
}

.local-delivery-hint strong[b-1v59rb81ez],
.general-delivery-hint strong[b-1v59rb81ez] {
    color: #0f172a;
    font-size: 1.03rem;
    font-weight: 800;
    line-height: 1.55;
}

.local-delivery-hint p[b-1v59rb81ez],
.general-delivery-hint p[b-1v59rb81ez] {
    margin-top: 3px;
    color: #526172;
    font-size: .96rem;
    line-height: 1.55;
}

.map-origin-selector[b-1v59rb81ez] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: stretch;
}

.map-origin-text[b-1v59rb81ez] {
    min-width: 0;
}

[b-1v59rb81ez] .open-google-map-button {
    min-height: 56px;
    padding: 0 22px;
    border-radius: 14px;
    background: linear-gradient(135deg, #047857 0%, var(--theme-primary) 100%);
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 12px 24px rgba(4, 120, 87, .2);
}

[b-1v59rb81ez] .coordinate-control .mud-input-root {
    background: #f8fafc;
}

.google-map-panel[b-1v59rb81ez] {
    overflow: hidden;
    border: 1px solid rgba(4, 120, 87, .2);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .1);
}

.google-map-panel-head[b-1v59rb81ez] {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    padding: 20px 22px;
    background:
        radial-gradient(circle at 90% 0%, rgba(16, 185, 129, .18), transparent 34%),
        linear-gradient(135deg, #ecfdf5 0%, #f8fafc 100%);
    border-bottom: 1px solid rgba(4, 120, 87, .13);
}

.google-map-panel-head small[b-1v59rb81ez],
.google-map-panel-head h4[b-1v59rb81ez],
.google-map-panel-head p[b-1v59rb81ez] {
    display: block;
    margin: 0;
}

.google-map-panel-head small[b-1v59rb81ez] {
    margin-bottom: 5px;
    color: #047857;
    font-size: .88rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.google-map-panel-head h4[b-1v59rb81ez] {
    color: #0f172a;
    font-size: 1.28rem;
    font-weight: 800;
}

.google-map-panel-head p[b-1v59rb81ez] {
    margin-top: 4px;
    color: #526172;
    font-size: 1rem;
    line-height: 1.65;
}

.google-map-head-actions[b-1v59rb81ez] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

[b-1v59rb81ez] .use-workplace-button {
    min-height: 44px;
    border-radius: 12px;
    border-color: rgba(4, 120, 87, .3);
    background: rgba(255, 255, 255, .84);
    color: #047857;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

[b-1v59rb81ez] .close-map-button {
    flex: 0 0 auto;
    color: #475569;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(15, 23, 42, .08);
}

[b-1v59rb81ez] .map-alert {
    margin: 16px 18px 0;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.google-place-autocomplete-host[b-1v59rb81ez] {
    position: relative;
    z-index: 4;
    padding: 16px 18px;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
}

.google-place-autocomplete-host[b-1v59rb81ez]::before {
    content: "เธ„เน‰เธ™เธซเธฒเธˆเธธเธ”เน€เธฃเธดเนˆเธกเธ•เน‰เธ™เธˆเธฑเธ”เธชเนˆเธ‡";
    display: block;
    margin-bottom: 8px;
    color: #334155;
    font-size: .98rem;
    font-weight: 700;
}

.google-place-autocomplete-host[b-1v59rb81ez]  gmp-place-autocomplete,
.google-place-autocomplete-host[b-1v59rb81ez]  .marketplace-place-autocomplete {
    display: block;
    width: 100%;
    min-height: 54px;
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
}

.map-canvas-wrap[b-1v59rb81ez] {
    position: relative;
    min-height: 440px;
    background: #e2e8f0;
}

.local-sale-google-map[b-1v59rb81ez] {
    width: 100%;
    height: 440px;
}

.map-loading-overlay[b-1v59rb81ez] {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: var(--theme-dark);
    background: rgba(248, 250, 252, .84);
    backdrop-filter: blur(4px);
}

.map-loading-overlay strong[b-1v59rb81ez] {
    font-size: 1.08rem;
}

.map-coordinate-summary[b-1v59rb81ez] {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    padding: 18px 20px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.map-coordinate-summary > span[b-1v59rb81ez] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, #059669, var(--theme-primary));
    box-shadow: 0 9px 20px rgba(5, 150, 105, .2);
}

.map-coordinate-summary small[b-1v59rb81ez],
.map-coordinate-summary strong[b-1v59rb81ez],
.map-coordinate-summary p[b-1v59rb81ez] {
    display: block;
    margin: 0;
}

.map-coordinate-summary small[b-1v59rb81ez] {
    color: #64748b;
    font-size: .91rem;
}

.map-coordinate-summary strong[b-1v59rb81ez] {
    margin-top: 2px;
    color: #0f172a;
    font-size: 1.08rem;
    line-height: 1.55;
}

.map-coordinate-summary p[b-1v59rb81ez] {
    margin-top: 3px;
    color: #475569;
    font-size: .98rem;
    line-height: 1.55;
}

@media (max-width: 720px) {
    .map-origin-selector[b-1v59rb81ez] {
        grid-template-columns: 1fr;
    }

    [b-1v59rb81ez] .open-google-map-button {
        width: 100%;
    }

    .google-map-panel-head[b-1v59rb81ez] {
        flex-direction: column;
        padding: 17px;
    }

    .google-map-head-actions[b-1v59rb81ez] {
        width: 100%;
        justify-content: space-between;
    }

    [b-1v59rb81ez] .use-workplace-button {
        flex: 1 1 auto;
    }

    .google-map-panel-head h4[b-1v59rb81ez] {
        font-size: 1.16rem;
    }

    .google-map-panel-head p[b-1v59rb81ez] {
        font-size: .94rem;
    }

    .map-canvas-wrap[b-1v59rb81ez],
    .local-sale-google-map[b-1v59rb81ez] {
        min-height: 360px;
        height: 360px;
    }

    .map-coordinate-summary[b-1v59rb81ez] {
        padding: 15px;
    }
}
/* /Components/Pages/03Marketplace/01Marketplace/02Products/MarketplaceProducts.razor.rz.scp.css */
.market-products-page[b-56iiz4adbp] {
    --green-950: #052e2b;
    --green-900: var(--theme-dark);
    --green-800: #065f46;
    --green-700: #047857;
    --green-600: #059669;
    --green-500: #10b981;
    --green-100: #d1fae5;
    --green-50: #ecfdf5;
    --ink-950: #10211c;
    --ink-800: #243c34;
    --ink-600: #52675f;
    --line: #dce9e3;
    --surface: #ffffff;
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 4%, rgba(16, 185, 129, .11), transparent 27rem),
        radial-gradient(circle at 94% 12%, rgba(14, 165, 233, .08), transparent 28rem),
        linear-gradient(180deg, #f8fcfa 0%, #f2f8f5 48%, color-mix(in srgb, var(--theme-bg) 58%, white) 100%);
    color: var(--ink-950);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    font-size: 17px;
}

.page-background-orb[b-56iiz4adbp] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(2px);
}

.orb-one[b-56iiz4adbp] {
    width: 360px;
    height: 360px;
    top: 460px;
    left: -210px;
    background: rgba(16, 185, 129, .09);
}

.orb-two[b-56iiz4adbp] {
    width: 420px;
    height: 420px;
    top: 1240px;
    right: -260px;
    background: rgba(59, 130, 246, .07);
}

.page-shell[b-56iiz4adbp] {
    position: relative;
    z-index: 1;
    width: min(1540px, calc(100% - 40px));
    margin: 0 auto;
    padding: 28px 0 70px;
}

.premium-hero[b-56iiz4adbp] {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 34px;
    min-height: 330px;
    padding: 44px 48px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 32px;
    background:
        linear-gradient(118deg, rgba(2, 44, 34, .98) 0%, rgba(4, 120, 87, .97) 55%, rgba(16, 185, 129, .91) 100%);
    box-shadow: 0 28px 70px rgba(5, 78, 59, .22);
    color: #fff;
}

.premium-hero[b-56iiz4adbp]::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 480px;
    height: 480px;
    top: -245px;
    right: 250px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .16);
    box-shadow:
        0 0 0 75px rgba(255, 255, 255, .035),
        0 0 0 150px rgba(255, 255, 255, .025);
}

.premium-hero[b-56iiz4adbp]::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: auto 0 0;
    height: 120px;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .12));
}

.hero-content[b-56iiz4adbp] {
    align-self: center;
    max-width: 850px;
}

.hero-eyebrow[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, .87);
    font-size: .88rem;
    font-weight: 600;
    letter-spacing: .04em;
}

.hero-eyebrow i[b-56iiz4adbp] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #a7f3d0;
}

.eyebrow-icon[b-56iiz4adbp] {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .2);
}

.hero-content h1[b-56iiz4adbp] {
    margin: 0 0 14px;
    font-size: clamp(2.35rem, 4vw, 4.15rem);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -.025em;
}

.hero-content > p[b-56iiz4adbp] {
    max-width: 800px;
    margin: 0;
    color: rgba(255, 255, 255, .85);
    font-size: 1.12rem;
    line-height: 1.82;
}

.hero-stat-row[b-56iiz4adbp] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.hero-stat-row span[b-56iiz4adbp] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 15px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 14px;
    background: rgba(255, 255, 255, .11);
    color: #fff;
    font-size: .98rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}

.hero-action-panel[b-56iiz4adbp] {
    align-self: center;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, .21);
    border-radius: 24px;
    background: rgba(0, 32, 24, .28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09);
    backdrop-filter: blur(13px);
}

.hero-live-row[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.live-dot[b-56iiz4adbp] {
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #86efac;
    box-shadow: 0 0 0 7px rgba(134, 239, 172, .14);
}

.hero-live-row strong[b-56iiz4adbp],
.hero-live-row small[b-56iiz4adbp] {
    display: block;
}

.hero-live-row strong[b-56iiz4adbp] {
    font-size: 1.05rem;
}

.hero-live-row small[b-56iiz4adbp] {
    margin-top: 2px;
    color: rgba(255, 255, 255, .69);
    font-size: .88rem;
}

.hero-sales-box[b-56iiz4adbp] {
    padding: 22px 0;
}

.hero-sales-box small[b-56iiz4adbp],
.hero-sales-box strong[b-56iiz4adbp],
.hero-sales-box span[b-56iiz4adbp] {
    display: block;
}

.hero-sales-box small[b-56iiz4adbp] {
    color: rgba(255, 255, 255, .72);
    font-size: .92rem;
}

.hero-sales-box strong[b-56iiz4adbp] {
    margin: 5px 0 1px;
    font-size: 2rem;
    line-height: 1.2;
}

.hero-sales-box span[b-56iiz4adbp] {
    color: #d1fae5;
    font-size: .92rem;
}

.hero-button-row[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: 1fr 52px;
    gap: 10px;
}

[b-56iiz4adbp] .hero-add-button {
    min-height: 52px;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: var(--green-900) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .13) !important;
    font-family: inherit !important;
    font-size: 1.02rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

[b-56iiz4adbp] .hero-refresh-button {
    width: 52px;
    height: 52px;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
}

[b-56iiz4adbp] .page-loading {
    height: 5px !important;
    margin: 18px 5px 0;
    border-radius: 999px;
}

[b-56iiz4adbp] .page-alert {
    margin-top: 20px;
    border-radius: 16px !important;
    font-family: inherit !important;
    font-size: 1rem !important;
}

[b-56iiz4adbp] .success-alert {
    background: var(--green-700) !important;
}

.summary-grid[b-56iiz4adbp] {
    margin-top: 6px !important;
}

.summary-card[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 150px;
    height: 100%;
    padding: 24px;
    border: 1px solid rgba(211, 226, 219, .9);
    border-radius: 22px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 14px 38px rgba(25, 64, 49, .075);
    transition: transform .2s ease, box-shadow .2s ease;
}

.summary-card:hover[b-56iiz4adbp] {
    transform: translateY(-3px);
    box-shadow: 0 20px 45px rgba(25, 64, 49, .11);
}

.summary-icon[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    place-items: center;
    border-radius: 19px;
}

.summary-icon[b-56iiz4adbp]  .mud-icon-root {
    font-size: 31px !important;
}

.summary-card small[b-56iiz4adbp],
.summary-card strong[b-56iiz4adbp],
.summary-card p[b-56iiz4adbp] {
    display: block;
}

.summary-card small[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .94rem;
    font-weight: 500;
}

.summary-card strong[b-56iiz4adbp] {
    margin: 2px 0 0;
    color: var(--ink-950);
    font-size: 2rem;
    line-height: 1.25;
}

.summary-card strong em[b-56iiz4adbp] {
    font-size: .86rem;
    font-style: normal;
    font-weight: 600;
}

.summary-card p[b-56iiz4adbp] {
    margin: 3px 0 0;
    color: var(--ink-600);
    font-size: .87rem;
    line-height: 1.45;
}

.summary-green .summary-icon[b-56iiz4adbp] { background: #d1fae5; color: #047857; }
.summary-blue .summary-icon[b-56iiz4adbp] { background: #dbeafe; color: #2563eb; }
.summary-orange .summary-icon[b-56iiz4adbp] { background: #ffedd5; color: #ea580c; }
.summary-purple .summary-icon[b-56iiz4adbp] { background: #f3e8ff; color: #9333ea; }

.quick-insights[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 10px 30px rgba(24, 66, 49, .055);
}

.quick-insights article[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
    padding: 12px 15px;
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.quick-insights article > span[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
    background: #e7f8f0;
    color: var(--green-700);
}

.quick-insights small[b-56iiz4adbp],
.quick-insights strong[b-56iiz4adbp] {
    display: block;
}

.quick-insights small[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .83rem;
}

.quick-insights strong[b-56iiz4adbp] {
    margin-top: 1px;
    overflow: hidden;
    color: var(--ink-950);
    font-size: 1.06rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-panel[b-56iiz4adbp] {
    margin-top: 25px;
    padding: 30px;
    border: 1px solid var(--line);
    border-radius: 28px;
    background: rgba(255, 255, 255, .93);
    box-shadow: 0 20px 55px rgba(24, 66, 49, .08);
}

.section-heading[b-56iiz4adbp] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.section-heading > div:first-child small[b-56iiz4adbp] {
    color: var(--green-600);
    font-size: .79rem;
    font-weight: 700;
    letter-spacing: .1em;
}

.section-heading h2[b-56iiz4adbp] {
    margin: 5px 0 3px;
    color: var(--ink-950);
    font-size: clamp(1.55rem, 2.4vw, 2.15rem);
    font-weight: 750;
}

.section-heading p[b-56iiz4adbp] {
    margin: 0;
    color: var(--ink-600);
    font-size: .98rem;
}

.section-action-group[b-56iiz4adbp] {
    display: flex;
    align-items: stretch;
    gap: 12px;
}

.shop-directory-button[b-56iiz4adbp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 62px;
    padding: 0 18px;
    border: 1px solid #b7d8c9;
    border-radius: 16px;
    background: #effaf5;
    color: var(--green-800);
    cursor: pointer;
    font-family: inherit;
    font-size: .97rem;
    font-weight: 650;
    transition: .18s ease;
}

.shop-directory-button:hover[b-56iiz4adbp] {
    border-color: var(--green-500);
    background: var(--green-50);
    transform: translateY(-1px);
}

.result-count-box[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: auto auto;
    align-content: center;
    column-gap: 8px;
    min-width: 132px;
    padding: 10px 16px;
    border: 1px solid #d5e7de;
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.result-count-box span[b-56iiz4adbp] {
    grid-column: 1 / -1;
    color: var(--ink-600);
    font-size: .78rem;
}

.result-count-box strong[b-56iiz4adbp] {
    color: var(--green-700);
    font-size: 1.45rem;
    line-height: 1.1;
}

.result-count-box em[b-56iiz4adbp] {
    align-self: end;
    color: var(--ink-600);
    font-size: .78rem;
    font-style: normal;
}

.filter-panel[b-56iiz4adbp] {
    padding: 22px;
    border: 1px solid #dbe9e2;
    border-radius: 21px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 42%, white) 0%, color-mix(in srgb, var(--theme-bg) 58%, white) 100%);
}

.filter-grid[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(260px, 1.45fr) repeat(6, minmax(145px, 1fr));
    gap: 14px;
}

.filter-search[b-56iiz4adbp] {
    min-width: 0;
}

[b-56iiz4adbp] .large-control .mud-input-control {
    margin-top: 0 !important;
}

[b-56iiz4adbp] .large-control .mud-input-outlined-border {
    border-color: #cbded5 !important;
    border-radius: 14px !important;
}

[b-56iiz4adbp] .large-control .mud-input-root,
[b-56iiz4adbp] .large-control .mud-select-input,
[b-56iiz4adbp] .large-control input,
[b-56iiz4adbp] .large-control textarea {
    font-family: inherit !important;
    font-size: 1.02rem !important;
}

[b-56iiz4adbp] .large-control .mud-input-label {
    font-family: inherit !important;
    font-size: 1rem !important;
}

[b-56iiz4adbp] .large-control .mud-input-outlined {
    min-height: 58px !important;
    border-radius: 14px !important;
    background: #fff !important;
}

[b-56iiz4adbp] .large-control textarea {
    line-height: 1.7 !important;
}

.filter-footer[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 17px;
    padding-top: 17px;
    border-top: 1px dashed #d1e2da;
}

.filter-switches[b-56iiz4adbp],
.filter-buttons[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

[b-56iiz4adbp] .large-switch .mud-typography,
[b-56iiz4adbp] .feature-switch-panel .mud-typography {
    font-family: inherit !important;
    font-size: .98rem !important;
    font-weight: 500 !important;
}

[b-56iiz4adbp] .reset-button,
[b-56iiz4adbp] .search-button {
    min-height: 48px;
    padding: 0 19px !important;
    border-radius: 13px !important;
    font-family: inherit !important;
    font-size: .98rem !important;
    font-weight: 650 !important;
    text-transform: none !important;
}

[b-56iiz4adbp] .reset-button {
    border-color: #b9cec4 !important;
    color: var(--ink-800) !important;
}

[b-56iiz4adbp] .search-button {
    background: var(--green-700) !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(4, 120, 87, .2) !important;
}

.product-card-grid[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.product-card[b-56iiz4adbp] {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dbe7e1;
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(31, 67, 53, .085);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.product-card:hover[b-56iiz4adbp] {
    transform: translateY(-5px);
    border-color: #afd9c5;
    box-shadow: 0 22px 48px rgba(25, 73, 54, .14);
}

.product-card.card-service[b-56iiz4adbp] {
    border-top: 3px solid #3b82f6;
}

.product-card.card-out-stock[b-56iiz4adbp] {
    border-top: 3px solid #f97316;
}

.product-card.card-inactive[b-56iiz4adbp] {
    opacity: .78;
    filter: saturate(.75);
}

.product-image-wrap[b-56iiz4adbp] {
    position: relative;
    height: 225px;
    overflow: hidden;
    background: #dcebe4;
}

.product-image-wrap img[b-56iiz4adbp] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s ease;
}

.product-card:hover .product-image-wrap img[b-56iiz4adbp] {
    transform: scale(1.04);
}

.image-shade[b-56iiz4adbp] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(3, 20, 14, .07), rgba(3, 20, 14, .02) 45%, rgba(3, 20, 14, .48));
}

.image-top-row[b-56iiz4adbp],
.image-bottom-row[b-56iiz4adbp] {
    position: absolute;
    left: 14px;
    right: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.image-top-row[b-56iiz4adbp] {
    top: 14px;
    justify-content: space-between;
}

.image-bottom-row[b-56iiz4adbp] {
    bottom: 13px;
    flex-wrap: wrap;
}

.type-badge[b-56iiz4adbp],
.status-badge[b-56iiz4adbp],
.image-bottom-row span[b-56iiz4adbp] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    padding: 4px 10px;
    border-radius: 999px;
    backdrop-filter: blur(8px);
    font-size: .78rem;
    font-weight: 650;
}

.type-product[b-56iiz4adbp] {
    background: rgba(236, 253, 245, .93);
    color: #047857;
}

.type-service[b-56iiz4adbp] {
    background: rgba(239, 246, 255, .94);
    color: #1d4ed8;
}

.status-active[b-56iiz4adbp] {
    background: rgba(220, 252, 231, .94);
    color: #166534;
}

.status-draft[b-56iiz4adbp] {
    background: rgba(254, 249, 195, .94);
    color: #854d0e;
}

.status-inactive[b-56iiz4adbp] {
    background: rgba(254, 226, 226, .94);
    color: #b91c1c;
}

.image-bottom-row span[b-56iiz4adbp] {
    border: 1px solid rgba(255, 255, 255, .25);
    background: rgba(4, 33, 24, .55);
    color: #fff;
}

.product-card-body[b-56iiz4adbp] {
    padding: 19px;
}

.code-category-row[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.code-category-row span[b-56iiz4adbp] {
    color: #819087;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .03em;
}

.code-category-row em[b-56iiz4adbp] {
    overflow: hidden;
    color: var(--green-700);
    font-size: .78rem;
    font-style: normal;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-card h3[b-56iiz4adbp] {
    min-height: 58px;
    margin: 8px 0 5px;
    overflow: hidden;
    color: var(--ink-950);
    font-size: 1.21rem;
    font-weight: 700;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.shop-link[b-56iiz4adbp] {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    gap: 6px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: var(--green-700);
    cursor: pointer;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-description[b-56iiz4adbp] {
    min-height: 49px;
    margin: 9px 0 13px;
    overflow: hidden;
    color: var(--ink-600);
    font-size: .88rem;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.price-row[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 0;
    border-top: 1px solid #edf3f0;
}

.price-row > div[b-56iiz4adbp] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 5px;
}

.price-row strong[b-56iiz4adbp] {
    color: var(--green-800);
    font-size: 1.4rem;
    line-height: 1;
}

.price-row span[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .79rem;
}

.price-row del[b-56iiz4adbp] {
    color: #9aa7a1;
    font-size: .78rem;
}

.price-row > em[b-56iiz4adbp] {
    flex: 0 0 auto;
    padding: 4px 8px;
    border-radius: 8px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: .77rem;
    font-style: normal;
    font-weight: 700;
}

.stock-panel[b-56iiz4adbp],
.service-panel[b-56iiz4adbp] {
    min-height: 67px;
    padding: 11px 13px;
    border-radius: 14px;
}

.stock-panel[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.stock-panel span[b-56iiz4adbp],
.stock-panel strong[b-56iiz4adbp],
.service-panel span[b-56iiz4adbp],
.service-panel strong[b-56iiz4adbp] {
    display: block;
}

.stock-panel > div > span[b-56iiz4adbp],
.service-panel > div > span[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .75rem;
}

.stock-panel strong[b-56iiz4adbp],
.service-panel strong[b-56iiz4adbp] {
    margin-top: 1px;
    font-size: .98rem;
}

.stock-state[b-56iiz4adbp] {
    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
}

.stock-good[b-56iiz4adbp] {
    background: #ecfdf5;
    color: #166534;
}

.stock-good .stock-state[b-56iiz4adbp] {
    background: #bbf7d0;
    color: #166534;
}

.stock-low[b-56iiz4adbp] {
    background: #fff7ed;
    color: #9a3412;
}

.stock-low .stock-state[b-56iiz4adbp] {
    background: #fed7aa;
    color: #9a3412;
}

.stock-out[b-56iiz4adbp] {
    background: #fef2f2;
    color: #991b1b;
}

.stock-out .stock-state[b-56iiz4adbp] {
    background: #fecaca;
    color: #991b1b;
}

.service-panel[b-56iiz4adbp] {
    background: #eff6ff;
    color: #1e40af;
}

.service-panel > span[b-56iiz4adbp] {
    margin-top: 4px;
    overflow: hidden;
    color: #496488;
    font-size: .74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.metric-row[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
    margin-top: 12px;
}

.metric-row span[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    padding: 7px 4px;
    border-radius: 10px;
    background: #f6f9f7;
    color: var(--ink-600);
    font-size: .77rem;
    font-weight: 600;
}

.metric-row span:first-child[b-56iiz4adbp] {
    color: #a16207;
}

.card-actions[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(3, 42px);
    gap: 8px;
    margin-top: 15px;
    padding-top: 14px;
    border-top: 1px solid #edf3f0;
}

[b-56iiz4adbp] .detail-button {
    min-height: 42px;
    border-radius: 12px !important;
    background: var(--green-700) !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: .9rem !important;
    font-weight: 650 !important;
    text-transform: none !important;
}

[b-56iiz4adbp] .edit-icon-button,
[b-56iiz4adbp] .status-icon-button,
[b-56iiz4adbp] .delete-icon-button {
    width: 42px;
    height: 42px;
    border-radius: 12px !important;
}

[b-56iiz4adbp] .edit-icon-button {
    background: #eff6ff !important;
    color: #2563eb !important;
}

[b-56iiz4adbp] .status-icon-button {
    background: #fff7ed !important;
    color: #ea580c !important;
}

[b-56iiz4adbp] .delete-icon-button {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}

.empty-state[b-56iiz4adbp] {
    display: grid;
    justify-items: center;
    margin-top: 24px;
    padding: 62px 25px;
    border: 1px dashed #bcd4c9;
    border-radius: 22px;
    background: #f9fcfa;
    text-align: center;
}

.empty-state > span[b-56iiz4adbp] {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    border-radius: 22px;
    background: var(--green-100);
    color: var(--green-700);
}

.empty-state > span[b-56iiz4adbp]  .mud-icon-root {
    font-size: 38px !important;
}

.empty-state h3[b-56iiz4adbp] {
    margin: 18px 0 4px;
    font-size: 1.35rem;
}

.empty-state p[b-56iiz4adbp] {
    margin: 0 0 18px;
    color: var(--ink-600);
}

.pagination-bar[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid #e4eee9;
}

.pagination-bar button[b-56iiz4adbp] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 46px;
    padding: 0 18px;
    border: 1px solid #bdd5ca;
    border-radius: 13px;
    background: #fff;
    color: var(--green-800);
    cursor: pointer;
    font-family: inherit;
    font-size: .95rem;
    font-weight: 650;
}

.pagination-bar button:hover:not(:disabled)[b-56iiz4adbp] {
    border-color: var(--green-500);
    background: var(--green-50);
}

.pagination-bar button:disabled[b-56iiz4adbp] {
    cursor: not-allowed;
    opacity: .45;
}

.pagination-bar > div[b-56iiz4adbp] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    color: var(--ink-600);
}

.pagination-bar strong[b-56iiz4adbp] {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: var(--green-700);
    color: #fff;
    font-size: 1.08rem;
}

.modal-overlay[b-56iiz4adbp] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
    overflow-y: auto;
    background: rgba(4, 20, 15, .68);
    backdrop-filter: blur(7px);
}

.modal-shell[b-56iiz4adbp] {
    width: min(1120px, 100%);
    max-height: calc(100vh - 48px);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 27px;
    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .35);
    color: var(--ink-950);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
}

.editor-modal[b-56iiz4adbp] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.modal-header[b-56iiz4adbp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    padding: 25px 28px;
    border-bottom: 1px solid #dbe9e2;
    background: linear-gradient(120deg, #ecfdf5, #f8fffb 66%, #eff6ff);
}

.modal-kicker[b-56iiz4adbp] {
    color: var(--green-600);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .1em;
}

.modal-header h2[b-56iiz4adbp] {
    margin: 4px 0 2px;
    font-size: 1.65rem;
    font-weight: 750;
}

.modal-header p[b-56iiz4adbp] {
    margin: 0;
    color: var(--ink-600);
    font-size: .9rem;
}

[b-56iiz4adbp] .modal-close-button {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 13px !important;
    background: #fff !important;
    color: var(--ink-800) !important;
    box-shadow: 0 5px 15px rgba(26, 61, 47, .1);
}

.modal-body[b-56iiz4adbp] {
    padding: 24px 28px 30px;
    overflow-y: auto;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

[b-56iiz4adbp] .editor-alert {
    margin-bottom: 18px;
    border-radius: 14px !important;
    font-family: inherit !important;
    font-size: 1rem !important;
}

.form-section[b-56iiz4adbp] {
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid #dbe8e2;
    border-radius: 20px;
    background: #fff;
}

.form-section-title[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 19px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--theme-border);
}

.form-section-title > span[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
    background: var(--green-100);
    color: var(--green-700);
}

.form-section-title h3[b-56iiz4adbp] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
}

.form-section-title p[b-56iiz4adbp] {
    margin: 1px 0 0;
    color: var(--ink-600);
    font-size: .84rem;
}

.feature-switch-panel[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 18px 20px;
    border: 1px solid #d7e7df;
    border-radius: 18px;
    background: #effaf5;
}

.modal-footer[b-56iiz4adbp] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 18px 28px;
    border-top: 1px solid #dbe9e2;
    background: #fff;
    box-shadow: 0 -10px 30px rgba(25, 64, 49, .05);
}

[b-56iiz4adbp] .modal-cancel-button,
[b-56iiz4adbp] .modal-save-button,
[b-56iiz4adbp] .confirm-delete-button {
    min-height: 48px;
    padding: 0 22px !important;
    border-radius: 13px !important;
    font-family: inherit !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
    text-transform: none !important;
}

[b-56iiz4adbp] .modal-cancel-button {
    border-color: #b9cdc3 !important;
    color: var(--ink-800) !important;
}

[b-56iiz4adbp] .modal-save-button {
    background: var(--green-700) !important;
    color: #fff !important;
    box-shadow: 0 9px 24px rgba(4, 120, 87, .22) !important;
}

.detail-modal[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(330px, .9fr) minmax(0, 1.3fr);
    width: min(1050px, 100%);
    overflow-y: auto;
}

.detail-image[b-56iiz4adbp] {
    position: relative;
    min-height: 640px;
    overflow: hidden;
    background: #d7e9e0;
}

.detail-image img[b-56iiz4adbp] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-image-shade[b-56iiz4adbp] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(3, 20, 14, .15), transparent 46%, rgba(3, 20, 14, .48));
}

.detail-image-badges[b-56iiz4adbp] {
    position: absolute;
    left: 19px;
    bottom: 19px;
    display: flex;
    gap: 8px;
}

[b-56iiz4adbp] .detail-close-button {
    position: absolute !important;
    top: 16px;
    right: 16px;
    width: 45px;
    height: 45px;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .91) !important;
    color: #173b2e !important;
}

.detail-content[b-56iiz4adbp] {
    padding: 31px;
    overflow-y: auto;
}

.detail-code[b-56iiz4adbp] {
    color: var(--green-600);
    font-size: .79rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.detail-content h2[b-56iiz4adbp] {
    margin: 7px 0 8px;
    font-size: 1.75rem;
    line-height: 1.35;
}

.detail-description[b-56iiz4adbp] {
    margin: 0;
    color: var(--ink-600);
    font-size: .98rem;
    line-height: 1.7;
}

.detail-price-box[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 20px 0;
    padding: 18px;
    border-radius: 17px;
    background: linear-gradient(120deg, var(--green-900), var(--green-600));
    color: #fff;
}

.detail-price-box small[b-56iiz4adbp],
.detail-price-box strong[b-56iiz4adbp] {
    display: block;
}

.detail-price-box small[b-56iiz4adbp] {
    color: rgba(255, 255, 255, .72);
    font-size: .82rem;
}

.detail-price-box strong[b-56iiz4adbp] {
    margin-top: 2px;
    font-size: 1.55rem;
}

.detail-price-box strong em[b-56iiz4adbp] {
    font-size: .82rem;
    font-style: normal;
    font-weight: 500;
}

.detail-price-box > span[b-56iiz4adbp] {
    padding: 6px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .17);
    font-size: .81rem;
    font-weight: 650;
}

.detail-info-grid[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.detail-info-grid article[b-56iiz4adbp] {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 14px;
    border: 1px solid #e0ebe5;
    border-radius: 15px;
    background: #fafcfb;
}

.detail-info-grid article > span[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: var(--green-100);
    color: var(--green-700);
}

.detail-info-grid small[b-56iiz4adbp],
.detail-info-grid strong[b-56iiz4adbp],
.detail-info-grid p[b-56iiz4adbp] {
    display: block;
}

.detail-info-grid small[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .73rem;
}

.detail-info-grid strong[b-56iiz4adbp] {
    margin-top: 1px;
    font-size: .91rem;
}

.detail-info-grid p[b-56iiz4adbp] {
    margin: 2px 0 0;
    color: var(--ink-600);
    font-size: .74rem;
}

.detail-stock-row[b-56iiz4adbp],
.detail-service-row[b-56iiz4adbp] {
    margin-top: 14px;
    padding: 16px;
    border-radius: 15px;
}

.detail-stock-row[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.detail-stock-row small[b-56iiz4adbp],
.detail-stock-row strong[b-56iiz4adbp],
.detail-service-row small[b-56iiz4adbp],
.detail-service-row strong[b-56iiz4adbp] {
    display: block;
}

.detail-stock-row small[b-56iiz4adbp],
.detail-service-row small[b-56iiz4adbp] {
    font-size: .75rem;
    opacity: .75;
}

.detail-stock-row strong[b-56iiz4adbp],
.detail-service-row strong[b-56iiz4adbp] {
    margin-top: 2px;
    font-size: 1rem;
}

.detail-stock-row > span[b-56iiz4adbp] {
    font-size: .85rem;
    font-weight: 700;
}

.detail-service-row[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 15px;
    background: #eff6ff;
    color: #1e3a8a;
}

.source-info-box[b-56iiz4adbp] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 14px;
    padding: 15px;
    border: 1px dashed #b9d2c6;
    border-radius: 15px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.source-info-box > span[b-56iiz4adbp] {
    color: var(--green-700);
}

.source-info-box small[b-56iiz4adbp],
.source-info-box strong[b-56iiz4adbp],
.source-info-box p[b-56iiz4adbp] {
    display: block;
}

.source-info-box small[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .74rem;
}

.source-info-box strong[b-56iiz4adbp] {
    margin-top: 1px;
    font-size: .9rem;
}

.source-info-box p[b-56iiz4adbp] {
    margin: 2px 0 0;
    color: var(--ink-600);
    font-size: .76rem;
}

.detail-action-row[b-56iiz4adbp] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 21px;
    padding-top: 18px;
    border-top: 1px solid var(--theme-border);
}

.confirm-modal[b-56iiz4adbp] {
    width: min(520px, 100%);
    padding: 31px;
    border-radius: 25px;
    background: #fff;
    box-shadow: 0 35px 100px rgba(0, 0, 0, .35);
    color: var(--ink-950);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    text-align: center;
}

.confirm-icon[b-56iiz4adbp] {
    display: grid;
    width: 74px;
    height: 74px;
    margin: 0 auto 17px;
    place-items: center;
    border-radius: 22px;
    background: #fee2e2;
    color: #dc2626;
}

.confirm-icon[b-56iiz4adbp]  .mud-icon-root {
    font-size: 36px !important;
}

.confirm-modal h2[b-56iiz4adbp] {
    margin: 0 0 7px;
    font-size: 1.55rem;
}

.confirm-modal > p[b-56iiz4adbp] {
    margin: 0;
    color: var(--ink-600);
    line-height: 1.65;
}

.confirm-modal > p strong[b-56iiz4adbp] {
    color: var(--ink-950);
}

.confirm-warning[b-56iiz4adbp] {
    margin-top: 17px;
    padding: 12px;
    border-radius: 13px;
    background: #fff7ed;
    color: #9a3412;
    font-size: .87rem;
}

.confirm-actions[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 22px;
}

[b-56iiz4adbp] .confirm-delete-button {
    background: #dc2626 !important;
    color: #fff !important;
    box-shadow: 0 9px 24px rgba(220, 38, 38, .2) !important;
}

@media (max-width: 1380px) {
    .premium-hero[b-56iiz4adbp] {
        grid-template-columns: minmax(0, 1fr) 350px;
    }

    .filter-grid[b-56iiz4adbp] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .filter-search[b-56iiz4adbp] {
        grid-column: span 2;
    }

    .product-card-grid[b-56iiz4adbp] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .page-shell[b-56iiz4adbp] {
        width: min(100% - 28px, 1540px);
    }

    .premium-hero[b-56iiz4adbp] {
        grid-template-columns: 1fr;
        padding: 36px;
    }

    .hero-action-panel[b-56iiz4adbp] {
        width: 100%;
        max-width: none;
    }

    .quick-insights[b-56iiz4adbp] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .section-heading[b-56iiz4adbp] {
        align-items: flex-start;
        flex-direction: column;
    }

    .section-action-group[b-56iiz4adbp] {
        width: 100%;
    }

    .shop-directory-button[b-56iiz4adbp] {
        flex: 1;
    }

    .product-card-grid[b-56iiz4adbp] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .feature-switch-panel[b-56iiz4adbp] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .detail-modal[b-56iiz4adbp] {
        grid-template-columns: 1fr;
        max-height: calc(100vh - 30px);
    }

    .detail-image[b-56iiz4adbp] {
        min-height: 320px;
        max-height: 360px;
    }
}

@media (max-width: 760px) {
    .market-products-page[b-56iiz4adbp] {
        font-size: 16px;
    }

    .page-shell[b-56iiz4adbp] {
        width: calc(100% - 20px);
        padding-top: 10px;
    }

    .premium-hero[b-56iiz4adbp] {
        min-height: auto;
        padding: 27px 22px;
        border-radius: 24px;
    }

    .hero-eyebrow[b-56iiz4adbp] {
        font-size: .78rem;
    }

    .hero-content h1[b-56iiz4adbp] {
        font-size: 2.35rem;
    }

    .hero-content > p[b-56iiz4adbp] {
        font-size: 1rem;
        line-height: 1.7;
    }

    .hero-stat-row[b-56iiz4adbp] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .hero-stat-row span[b-56iiz4adbp] {
        width: 100%;
    }

    .hero-action-panel[b-56iiz4adbp] {
        padding: 18px;
    }

    .summary-card[b-56iiz4adbp] {
        min-height: 132px;
        padding: 20px;
    }

    .quick-insights[b-56iiz4adbp] {
        grid-template-columns: 1fr;
        padding: 13px;
    }

    .catalog-panel[b-56iiz4adbp] {
        padding: 19px 14px;
        border-radius: 22px;
    }

    .section-action-group[b-56iiz4adbp] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .result-count-box[b-56iiz4adbp] {
        min-width: 0;
    }

    .filter-panel[b-56iiz4adbp] {
        padding: 15px;
    }

    .filter-grid[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .filter-search[b-56iiz4adbp] {
        grid-column: auto;
    }

    .filter-footer[b-56iiz4adbp] {
        align-items: stretch;
        flex-direction: column;
    }

    .filter-switches[b-56iiz4adbp],
    .filter-buttons[b-56iiz4adbp] {
        width: 100%;
    }

    .filter-buttons[b-56iiz4adbp] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .product-card-grid[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .product-image-wrap[b-56iiz4adbp] {
        height: 235px;
    }

    .pagination-bar[b-56iiz4adbp] {
        gap: 9px;
    }

    .pagination-bar button[b-56iiz4adbp] {
        padding: 0 11px;
        font-size: .84rem;
    }

    .pagination-bar > div span[b-56iiz4adbp] {
        display: none;
    }

    .modal-overlay[b-56iiz4adbp] {
        align-items: start;
        padding: 10px;
    }

    .modal-shell[b-56iiz4adbp] {
        max-height: calc(100vh - 20px);
        border-radius: 21px;
    }

    .modal-header[b-56iiz4adbp] {
        padding: 20px;
    }

    .modal-header p[b-56iiz4adbp] {
        display: none;
    }

    .modal-body[b-56iiz4adbp] {
        padding: 16px;
    }

    .form-section[b-56iiz4adbp] {
        padding: 16px;
    }

    .feature-switch-panel[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .modal-footer[b-56iiz4adbp] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        padding: 14px 16px;
    }

    .detail-content[b-56iiz4adbp] {
        padding: 21px 18px;
    }

    .detail-info-grid[b-56iiz4adbp],
    .detail-service-row[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .detail-price-box[b-56iiz4adbp] {
        align-items: flex-start;
        flex-direction: column;
    }

    .confirm-modal[b-56iiz4adbp] {
        padding: 25px 19px;
    }
}

@media (max-width: 430px) {
    .hero-button-row[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    [b-56iiz4adbp] .hero-refresh-button {
        width: 100%;
    }

    .summary-card[b-56iiz4adbp] {
        gap: 13px;
    }

    .summary-icon[b-56iiz4adbp] {
        flex-basis: 54px;
        width: 54px;
        height: 54px;
    }

    .card-actions[b-56iiz4adbp] {
        grid-template-columns: 1fr repeat(3, 39px);
    }

    [b-56iiz4adbp] .edit-icon-button,
    [b-56iiz4adbp] .status-icon-button,
    [b-56iiz4adbp] .delete-icon-button {
        width: 39px;
        height: 42px;
    }

    .modal-footer[b-56iiz4adbp],
    .confirm-actions[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   SALE SCOPE โ€” เธ‚เธฒเธขเธ—เธฑเนˆเธงเน„เธ› / เธ‚เธฒเธขเนƒเธ™เธžเธทเน‰เธ™เธ—เธตเนˆเธ•เธฒเธกเธฃเธฑเธจเธกเธต
   ========================================================= */
.sale-scope-panel[b-56iiz4adbp] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: 68px;
    margin-bottom: 10px;
    padding: 11px 13px;
    border: 1px solid transparent;
    border-radius: 14px;
}

.sale-scope-panel .sale-scope-icon[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 11px;
}

.sale-scope-panel small[b-56iiz4adbp],
.sale-scope-panel strong[b-56iiz4adbp],
.sale-scope-panel p[b-56iiz4adbp] {
    display: block;
}

.sale-scope-panel small[b-56iiz4adbp] {
    color: var(--ink-600);
    font-size: .76rem;
    font-weight: 600;
}

.sale-scope-panel strong[b-56iiz4adbp] {
    margin-top: 1px;
    color: var(--ink-900);
    font-size: .98rem;
    line-height: 1.35;
}

.sale-scope-panel p[b-56iiz4adbp] {
    margin: 3px 0 0;
    color: var(--ink-600);
    font-size: .76rem;
    line-height: 1.4;
}

.sale-scope-general[b-56iiz4adbp] {
    border-color: #cfe4dc;
    background: linear-gradient(135deg, #f0fdf8 0%, #ecfdf5 100%);
}

.sale-scope-general .sale-scope-icon[b-56iiz4adbp] {
    background: #d1fae5;
    color: #047857;
}

.sale-scope-local[b-56iiz4adbp] {
    border-color: #fed7aa;
    background: linear-gradient(135deg, #fffaf2 0%, #fff7ed 100%);
}

.sale-scope-local .sale-scope-icon[b-56iiz4adbp] {
    background: #ffedd5;
    color: #c2410c;
}

.local-sale-hint[b-56iiz4adbp],
.general-sale-hint[b-56iiz4adbp] {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 15px 16px;
    border-radius: 16px;
}

.local-sale-hint[b-56iiz4adbp] {
    border: 1px solid #fed7aa;
    background: linear-gradient(135deg, #fffaf2 0%, #fff7ed 100%);
}

.general-sale-hint[b-56iiz4adbp] {
    border: 1px solid #bbf7d0;
    background: linear-gradient(135deg, #f0fdf8 0%, #ecfdf5 100%);
}

.local-sale-hint > span[b-56iiz4adbp],
.general-sale-hint > span[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
}

.local-sale-hint > span[b-56iiz4adbp] {
    background: #ffedd5;
    color: #c2410c;
}

.general-sale-hint > span[b-56iiz4adbp] {
    background: #d1fae5;
    color: #047857;
}

.local-sale-hint strong[b-56iiz4adbp],
.general-sale-hint strong[b-56iiz4adbp] {
    display: block;
    color: var(--ink-900);
    font-size: 1.02rem;
    line-height: 1.45;
}

.local-sale-hint p[b-56iiz4adbp],
.general-sale-hint p[b-56iiz4adbp] {
    margin: 4px 0 0;
    color: var(--ink-600);
    font-size: .9rem;
    line-height: 1.55;
}

@media (max-width: 600px) {
    .local-sale-hint[b-56iiz4adbp],
    .general-sale-hint[b-56iiz4adbp] {
        padding: 13px;
    }

    .local-sale-hint strong[b-56iiz4adbp],
    .general-sale-hint strong[b-56iiz4adbp] {
        font-size: .94rem;
    }

    .local-sale-hint p[b-56iiz4adbp],
    .general-sale-hint p[b-56iiz4adbp] {
        font-size: .84rem;
    }
}


/* ===== Unlimited product images ===== */
.product-images-section[b-56iiz4adbp] {
    overflow: hidden;
}

.image-upload-toolbar[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px;
    gap: 14px;
    align-items: stretch;
}

.image-file-picker[b-56iiz4adbp] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 92px;
    padding: 17px 19px;
    overflow: hidden;
    border: 2px dashed #9ccbb5;
    border-radius: 18px;
    background: linear-gradient(135deg, #f0fdf7, #f8fffb);
    color: var(--green-800);
    cursor: pointer;
    transition: .18s ease;
}

.image-file-picker:hover[b-56iiz4adbp] {
    border-color: var(--green-600);
    background: #ecfdf5;
    transform: translateY(-1px);
}

.image-file-picker.is-disabled[b-56iiz4adbp] {
    cursor: wait;
    opacity: .7;
}

.image-file-picker input[type="file"][b-56iiz4adbp] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.picker-icon[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 16px;
    background: var(--green-700);
    color: #fff;
    box-shadow: 0 10px 24px rgba(4, 120, 87, .2);
}

.picker-icon[b-56iiz4adbp]  .mud-icon-root {
    font-size: 28px !important;
}

.image-file-picker strong[b-56iiz4adbp],
.image-file-picker small[b-56iiz4adbp] {
    display: block;
}

.image-file-picker strong[b-56iiz4adbp] {
    font-size: 1.08rem;
    font-weight: 700;
}

.image-file-picker small[b-56iiz4adbp] {
    margin-top: 3px;
    color: var(--ink-600);
    font-size: .88rem;
    line-height: 1.5;
}

.image-upload-summary[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: auto auto;
    align-content: center;
    justify-content: center;
    column-gap: 8px;
    min-width: 130px;
    border: 1px solid #cfe3d9;
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    text-align: center;
}

.image-upload-summary span[b-56iiz4adbp] {
    grid-column: 1 / -1;
    color: var(--ink-600);
    font-size: .84rem;
}

.image-upload-summary strong[b-56iiz4adbp] {
    color: var(--green-700);
    font-size: 2rem;
    line-height: 1.1;
}

.image-upload-summary em[b-56iiz4adbp] {
    align-self: end;
    color: var(--ink-600);
    font-size: .83rem;
    font-style: normal;
}

[b-56iiz4adbp] .image-upload-progress {
    margin-top: 12px;
    border-radius: 999px;
}

.image-path-adder[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    margin-top: 15px;
}

[b-56iiz4adbp] .add-image-path-button {
    min-height: 58px;
    padding: 0 20px !important;
    border-radius: 14px !important;
    background: var(--green-700) !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
    text-transform: none !important;
}

.image-empty-state[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 16px;
    padding: 18px;
    border: 1px dashed #bfd7cc;
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.image-empty-state > span[b-56iiz4adbp] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 14px;
    background: #e8f7f0;
    color: var(--green-700);
}

.image-empty-state strong[b-56iiz4adbp],
.image-empty-state p[b-56iiz4adbp] {
    display: block;
}

.image-empty-state strong[b-56iiz4adbp] {
    font-size: 1rem;
}

.image-empty-state p[b-56iiz4adbp] {
    margin: 2px 0 0;
    color: var(--ink-600);
    font-size: .88rem;
}

.editor-image-grid[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
    margin-top: 18px;
}

.editor-image-card[b-56iiz4adbp] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d8e7df;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(29, 72, 55, .07);
}

.editor-image-card.is-primary[b-56iiz4adbp] {
    border-color: #55b98d;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, .12), 0 12px 28px rgba(29, 72, 55, .1);
}

.editor-image-preview[b-56iiz4adbp] {
    position: relative;
    height: 170px;
    overflow: hidden;
    background: #e7f0ec;
}

.editor-image-preview img[b-56iiz4adbp] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.primary-image-badge[b-56iiz4adbp],
.image-order-badge[b-56iiz4adbp] {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 9px;
    border-radius: 999px;
    backdrop-filter: blur(7px);
    font-size: .75rem;
    font-weight: 700;
}

.primary-image-badge[b-56iiz4adbp] {
    left: 10px;
    bottom: 10px;
    background: rgba(236, 253, 245, .94);
    color: #047857;
}

.image-order-badge[b-56iiz4adbp] {
    top: 10px;
    right: 10px;
    background: rgba(4, 33, 24, .68);
    color: #fff;
}

.editor-image-meta[b-56iiz4adbp] {
    padding: 13px 13px 5px;
}

.editor-image-meta > strong[b-56iiz4adbp],
.editor-image-meta > small[b-56iiz4adbp] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.editor-image-meta > strong[b-56iiz4adbp] {
    color: var(--ink-950);
    font-size: .94rem;
}

.editor-image-meta > small[b-56iiz4adbp] {
    margin: 2px 0 9px;
    color: var(--ink-600);
    font-size: .75rem;
}

[b-56iiz4adbp] .image-alt-control .mud-input-root,
[b-56iiz4adbp] .image-alt-control input {
    font-family: inherit !important;
    font-size: .88rem !important;
}

.editor-image-actions[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
    padding: 9px 12px 12px;
}

[b-56iiz4adbp] .image-action-button {
    width: 100%;
    height: 39px;
    border-radius: 11px !important;
    background: color-mix(in srgb, var(--theme-bg) 82%, white) !important;
    color: var(--ink-700) !important;
}

[b-56iiz4adbp] .image-action-button.active-primary {
    background: #dcfce7 !important;
    color: #15803d !important;
}

[b-56iiz4adbp] .delete-image-button {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}

.image-source-grid[b-56iiz4adbp] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px dashed #d4e4dc;
}

.detail-thumbnail-row[b-56iiz4adbp] {
    display: flex;
    gap: 10px;
    margin: 0 0 18px;
    overflow-x: auto;
    padding: 3px 2px 8px;
}

.detail-thumbnail[b-56iiz4adbp] {
    flex: 0 0 78px;
    width: 78px;
    height: 66px;
    padding: 0;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 12px;
    background: #e7f0ec;
    cursor: pointer;
    transition: .16s ease;
}

.detail-thumbnail.active[b-56iiz4adbp] {
    border-color: var(--green-600);
    box-shadow: 0 0 0 3px rgba(16, 185, 129, .12);
}

.detail-thumbnail img[b-56iiz4adbp] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 900px) {
    .editor-image-grid[b-56iiz4adbp] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .image-upload-toolbar[b-56iiz4adbp],
    .image-path-adder[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .image-upload-summary[b-56iiz4adbp] {
        min-height: 82px;
    }

    .editor-image-grid[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    .editor-image-preview[b-56iiz4adbp] {
        height: 210px;
    }
}

/* ===== Google Maps local sale selector ===== */
.map-origin-selector[b-56iiz4adbp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: stretch;
}

.map-origin-text[b-56iiz4adbp] {
    min-width: 0;
}

[b-56iiz4adbp] .open-google-map-button {
    min-height: 56px;
    padding: 0 22px;
    border-radius: 14px;
    background: linear-gradient(135deg, #047857 0%, var(--theme-primary) 100%);
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 12px 24px rgba(4, 120, 87, .2);
}

[b-56iiz4adbp] .coordinate-control .mud-input-root {
    background: #f8fafc;
}

.google-map-panel[b-56iiz4adbp] {
    overflow: hidden;
    border: 1px solid rgba(4, 120, 87, .2);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .1);
}

.google-map-panel-head[b-56iiz4adbp] {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    padding: 20px 22px;
    background:
        radial-gradient(circle at 90% 0%, rgba(16, 185, 129, .18), transparent 34%),
        linear-gradient(135deg, #ecfdf5 0%, #f8fafc 100%);
    border-bottom: 1px solid rgba(4, 120, 87, .13);
}

.google-map-panel-head small[b-56iiz4adbp],
.google-map-panel-head h4[b-56iiz4adbp],
.google-map-panel-head p[b-56iiz4adbp] {
    display: block;
    margin: 0;
}

.google-map-panel-head small[b-56iiz4adbp] {
    margin-bottom: 5px;
    color: #047857;
    font-size: .88rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.google-map-panel-head h4[b-56iiz4adbp] {
    color: #0f172a;
    font-size: 1.28rem;
    font-weight: 800;
}

.google-map-panel-head p[b-56iiz4adbp] {
    margin-top: 4px;
    color: #526172;
    font-size: 1rem;
    line-height: 1.65;
}

.google-map-head-actions[b-56iiz4adbp] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

[b-56iiz4adbp] .use-workplace-button {
    min-height: 44px;
    border-radius: 12px;
    border-color: rgba(4, 120, 87, .3);
    background: rgba(255, 255, 255, .84);
    color: #047857;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

[b-56iiz4adbp] .close-map-button {
    flex: 0 0 auto;
    color: #475569;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(15, 23, 42, .08);
}

[b-56iiz4adbp] .map-alert {
    margin: 16px 18px 0;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.google-place-autocomplete-host[b-56iiz4adbp] {
    position: relative;
    z-index: 4;
    padding: 16px 18px;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
}

.google-place-autocomplete-host[b-56iiz4adbp]::before {
    content: "เธ„เน‰เธ™เธซเธฒเธชเธ–เธฒเธ™เธ—เธตเนˆเน€เธฃเธดเนˆเธกเธ•เน‰เธ™";
    display: block;
    margin-bottom: 8px;
    color: #334155;
    font-size: .98rem;
    font-weight: 700;
}

.google-place-autocomplete-host[b-56iiz4adbp]  gmp-place-autocomplete,
.google-place-autocomplete-host[b-56iiz4adbp]  .marketplace-place-autocomplete {
    display: block;
    width: 100%;
    min-height: 54px;
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
}

.map-canvas-wrap[b-56iiz4adbp] {
    position: relative;
    min-height: 440px;
    background: #e2e8f0;
}

.local-sale-google-map[b-56iiz4adbp] {
    width: 100%;
    height: 440px;
}

.map-loading-overlay[b-56iiz4adbp] {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: var(--theme-dark);
    background: rgba(248, 250, 252, .84);
    backdrop-filter: blur(4px);
}

.map-loading-overlay strong[b-56iiz4adbp] {
    font-size: 1.08rem;
}

.map-coordinate-summary[b-56iiz4adbp] {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    padding: 18px 20px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.map-coordinate-summary > span[b-56iiz4adbp] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, #059669, var(--theme-primary));
    box-shadow: 0 9px 20px rgba(5, 150, 105, .2);
}

.map-coordinate-summary small[b-56iiz4adbp],
.map-coordinate-summary strong[b-56iiz4adbp],
.map-coordinate-summary p[b-56iiz4adbp] {
    display: block;
    margin: 0;
}

.map-coordinate-summary small[b-56iiz4adbp] {
    color: #64748b;
    font-size: .91rem;
}

.map-coordinate-summary strong[b-56iiz4adbp] {
    margin-top: 2px;
    color: #0f172a;
    font-size: 1.08rem;
    line-height: 1.55;
}

.map-coordinate-summary p[b-56iiz4adbp] {
    margin-top: 3px;
    color: #475569;
    font-size: .98rem;
    line-height: 1.55;
}

@media (max-width: 720px) {
    .map-origin-selector[b-56iiz4adbp] {
        grid-template-columns: 1fr;
    }

    [b-56iiz4adbp] .open-google-map-button {
        width: 100%;
    }

    .google-map-panel-head[b-56iiz4adbp] {
        flex-direction: column;
        padding: 17px;
    }

    .google-map-head-actions[b-56iiz4adbp] {
        width: 100%;
        justify-content: space-between;
    }

    [b-56iiz4adbp] .use-workplace-button {
        flex: 1 1 auto;
    }

    .google-map-panel-head h4[b-56iiz4adbp] {
        font-size: 1.16rem;
    }

    .google-map-panel-head p[b-56iiz4adbp] {
        font-size: .94rem;
    }

    .map-canvas-wrap[b-56iiz4adbp],
    .local-sale-google-map[b-56iiz4adbp] {
        min-height: 360px;
        height: 360px;
    }

    .map-coordinate-summary[b-56iiz4adbp] {
        padding: 15px;
    }
}
/* /Components/Pages/03Marketplace/01Marketplace/03Order/MarketplaceOrders.razor.rz.scp.css */
.market-orders-page[b-v8q3mk4k01] {
    --green-950: #052e2b;
    --green-900: var(--theme-dark);
    --green-800: #065f46;
    --green-700: #047857;
    --green-600: #059669;
    --green-500: #10b981;
    --green-100: #d1fae5;
    --green-50: #ecfdf5;
    --slate-950: #0f172a;
    --slate-800: #1e293b;
    --slate-700: #334155;
    --slate-600: #475569;
    --slate-500: #64748b;
    --slate-400: #94a3b8;
    --slate-300: #cbd5e1;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;
    --surface: #ffffff;
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 5% 4%, rgba(16, 185, 129, .11), transparent 28%),
        radial-gradient(circle at 95% 20%, rgba(14, 165, 233, .09), transparent 25%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #f8fafc 43%, #f2f7f5 100%);
    color: var(--slate-800);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
    font-size: 17px;
    line-height: 1.65;
}

.market-orders-page *[b-v8q3mk4k01] { box-sizing: border-box; }

.page-shell[b-v8q3mk4k01] {
    position: relative;
    z-index: 2;
    width: min(1720px, calc(100% - 40px));
    margin: 0 auto;
    padding: 30px 0 70px;
}

.page-orb[b-v8q3mk4k01] {
    position: absolute;
    z-index: 0;
    border-radius: 999px;
    filter: blur(2px);
    pointer-events: none;
}
.orb-one[b-v8q3mk4k01] { width: 360px; height: 360px; top: 340px; left: -220px; background: rgba(16, 185, 129, .08); }
.orb-two[b-v8q3mk4k01] { width: 430px; height: 430px; top: 930px; right: -270px; background: rgba(59, 130, 246, .07); }

.premium-hero[b-v8q3mk4k01] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(360px, .65fr);
    gap: 32px;
    min-height: 310px;
    padding: 42px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 30px;
    color: white;
    background:
        linear-gradient(135deg, rgba(5, 46, 43, .98), rgba(6, 95, 70, .97) 48%, rgba(5, 150, 105, .94)),
        radial-gradient(circle at 70% 10%, rgba(255, 255, 255, .16), transparent 25%);
    box-shadow: 0 28px 65px rgba(5, 46, 43, .24);
}

.premium-hero[b-v8q3mk4k01]::before,
.premium-hero[b-v8q3mk4k01]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .14);
}
.premium-hero[b-v8q3mk4k01]::before { width: 340px; height: 340px; right: 24%; top: -230px; }
.premium-hero[b-v8q3mk4k01]::after { width: 470px; height: 470px; right: -230px; bottom: -330px; }

.hero-content[b-v8q3mk4k01], .hero-action-panel[b-v8q3mk4k01] { position: relative; z-index: 2; }
.hero-eyebrow[b-v8q3mk4k01] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 11px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, .88);
    font-size: .94rem;
    font-weight: 600;
    letter-spacing: .03em;
}
.hero-eyebrow i[b-v8q3mk4k01] { width: 5px; height: 5px; border-radius: 50%; background: #6ee7b7; }
.eyebrow-icon[b-v8q3mk4k01] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .2);
}
.hero-content h1[b-v8q3mk4k01] { margin: 0 0 12px; font-size: clamp(2.35rem, 4.2vw, 4.3rem); line-height: 1.1; font-weight: 800; letter-spacing: -.035em; }
.hero-content > p[b-v8q3mk4k01] { max-width: 860px; margin: 0; color: rgba(255, 255, 255, .84); font-size: 1.08rem; line-height: 1.9; }
.hero-stat-row[b-v8q3mk4k01] { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-stat-row span[b-v8q3mk4k01] { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid rgba(255, 255, 255, .15); border-radius: 999px; background: rgba(255, 255, 255, .1); font-size: .95rem; font-weight: 600; }

.hero-action-panel[b-v8q3mk4k01] {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 24px;
    background: rgba(255, 255, 255, .09);
    backdrop-filter: blur(18px);
}
.hero-live-row[b-v8q3mk4k01] { display: flex; align-items: center; gap: 12px; }
.hero-live-row div[b-v8q3mk4k01] { display: flex; flex-direction: column; }
.hero-live-row strong[b-v8q3mk4k01] { font-size: 1.05rem; }
.hero-live-row small[b-v8q3mk4k01] { color: rgba(255, 255, 255, .72); font-size: .9rem; }
.live-dot[b-v8q3mk4k01] { width: 12px; height: 12px; border: 3px solid rgba(110, 231, 183, .35); border-radius: 50%; background: #6ee7b7; box-shadow: 0 0 0 5px rgba(110, 231, 183, .12); }
.hero-sales-box[b-v8q3mk4k01] { padding: 20px; border-radius: 20px; background: rgba(0, 0, 0, .13); }
.hero-sales-box small[b-v8q3mk4k01], .hero-sales-box span[b-v8q3mk4k01] { display: block; color: rgba(255, 255, 255, .74); }
.hero-sales-box strong[b-v8q3mk4k01] { display: block; margin: 3px 0; font-size: 2.15rem; line-height: 1.25; }
.hero-button-row[b-v8q3mk4k01] { display: flex; gap: 11px; }
.hero-add-button.mud-button-root[b-v8q3mk4k01] { flex: 1; min-height: 52px; border-radius: 15px; background: white !important; color: var(--green-800) !important; font-family: inherit; font-size: 1rem; font-weight: 700; box-shadow: 0 10px 24px rgba(0, 0, 0, .12); }
.hero-refresh-button.mud-icon-button[b-v8q3mk4k01] { width: 52px; height: 52px; border-radius: 15px; color: white; background: rgba(255, 255, 255, .13); border: 1px solid rgba(255, 255, 255, .19); }

.page-loading[b-v8q3mk4k01] { margin: 18px 0 0; border-radius: 999px; overflow: hidden; }
.page-alert[b-v8q3mk4k01] { margin-top: 18px; border-radius: 17px; font-family: inherit; font-size: 1rem; }
.success-alert[b-v8q3mk4k01] { background: #047857 !important; }

.summary-grid[b-v8q3mk4k01] { margin-top: 18px !important; }
.summary-card[b-v8q3mk4k01] {
    display: flex;
    align-items: center;
    gap: 17px;
    height: 100%;
    min-height: 146px;
    padding: 23px;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 22px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .07);
}
.summary-icon[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 58px; width: 58px; height: 58px; border-radius: 18px; }
.summary-card div[b-v8q3mk4k01] { min-width: 0; }
.summary-card small[b-v8q3mk4k01] { display: block; color: var(--slate-500); font-size: .93rem; }
.summary-card strong[b-v8q3mk4k01] { display: block; color: var(--slate-950); font-size: 2rem; line-height: 1.25; }
.summary-card strong em[b-v8q3mk4k01] { color: var(--slate-500); font-size: .92rem; font-style: normal; font-weight: 500; }
.summary-card p[b-v8q3mk4k01] { margin: 4px 0 0; color: var(--slate-600); font-size: .9rem; }
.summary-green .summary-icon[b-v8q3mk4k01] { color: #047857; background: #d1fae5; }
.summary-blue .summary-icon[b-v8q3mk4k01] { color: #1d4ed8; background: #dbeafe; }
.summary-orange .summary-icon[b-v8q3mk4k01] { color: #c2410c; background: #ffedd5; }
.summary-purple .summary-icon[b-v8q3mk4k01] { color: #7e22ce; background: #f3e8ff; }

.status-overview[b-v8q3mk4k01] { display: grid; grid-template-columns: repeat(6, minmax(150px, 1fr)); gap: 12px; margin: 18px 0; }
.status-tile[b-v8q3mk4k01] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 16px;
    text-align: left;
    color: var(--slate-700);
    border: 1px solid var(--slate-200);
    border-radius: 18px;
    background: rgba(255, 255, 255, .92);
    font-family: inherit;
    cursor: pointer;
    transition: .2s ease;
}
.status-tile:hover[b-v8q3mk4k01] { transform: translateY(-2px); border-color: #86efac; box-shadow: 0 10px 25px rgba(15, 23, 42, .08); }
.status-tile.active[b-v8q3mk4k01] { color: #065f46; border-color: #34d399; background: #ecfdf5; box-shadow: inset 0 0 0 1px rgba(52, 211, 153, .25); }
.status-icon[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 45px; height: 45px; flex: 0 0 45px; border-radius: 14px; }
.status-icon.status-all[b-v8q3mk4k01] { color: #475569; background: #f1f5f9; }
.status-icon.status-new[b-v8q3mk4k01] { color: #0369a1; background: #e0f2fe; }
.status-icon.status-confirmed[b-v8q3mk4k01] { color: #1d4ed8; background: #dbeafe; }
.status-icon.status-preparing[b-v8q3mk4k01] { color: #b45309; background: #fef3c7; }
.status-icon.status-shipping[b-v8q3mk4k01] { color: #7e22ce; background: #f3e8ff; }
.status-icon.status-completed[b-v8q3mk4k01] { color: #047857; background: #d1fae5; }
.status-tile div[b-v8q3mk4k01] { display: flex; flex-direction: column; min-width: 0; }
.status-tile small[b-v8q3mk4k01] { font-size: .86rem; white-space: nowrap; }
.status-tile strong[b-v8q3mk4k01] { color: var(--slate-950); font-size: 1.5rem; line-height: 1.25; }

.orders-panel[b-v8q3mk4k01] {
    padding: 28px;
    border: 1px solid rgba(226, 232, 240, .9);
    border-radius: 28px;
    background: rgba(255, 255, 255, .93);
    box-shadow: 0 18px 55px rgba(15, 23, 42, .075);
}
.section-heading[b-v8q3mk4k01] { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 23px; }
.section-heading small[b-v8q3mk4k01] { color: var(--green-700); font-size: .8rem; font-weight: 700; letter-spacing: .13em; }
.section-heading h2[b-v8q3mk4k01] { margin: 2px 0 3px; color: var(--slate-950); font-size: clamp(1.55rem, 2.3vw, 2.15rem); line-height: 1.3; }
.section-heading p[b-v8q3mk4k01] { margin: 0; color: var(--slate-500); }
.section-actions[b-v8q3mk4k01] { display: flex; align-items: center; gap: 12px; }
.related-page-button[b-v8q3mk4k01] { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 16px; color: var(--green-800); border: 1px solid #a7f3d0; border-radius: 14px; background: #ecfdf5; font-family: inherit; font-size: .96rem; font-weight: 650; cursor: pointer; }
.result-count-box[b-v8q3mk4k01] { display: flex; align-items: baseline; gap: 7px; padding: 10px 15px; border-radius: 15px; background: var(--slate-100); }
.result-count-box span[b-v8q3mk4k01], .result-count-box em[b-v8q3mk4k01] { color: var(--slate-500); font-size: .85rem; font-style: normal; }
.result-count-box strong[b-v8q3mk4k01] { color: var(--slate-950); font-size: 1.45rem; }

.filter-panel[b-v8q3mk4k01] { margin-bottom: 24px; padding: 20px; border: 1px solid var(--slate-200); border-radius: 22px; background: color-mix(in srgb, var(--theme-bg) 42%, white); }
.filter-grid[b-v8q3mk4k01] { display: grid; grid-template-columns: minmax(330px, 1.7fr) repeat(4, minmax(190px, 1fr)); gap: 14px; }
.filter-search[b-v8q3mk4k01] { grid-column: span 2; }
.large-control :deep(.mud-input-control)[b-v8q3mk4k01] { margin: 0; }
.large-control :deep(.mud-input-slot)[b-v8q3mk4k01],
.large-control :deep(input)[b-v8q3mk4k01],
.large-control :deep(textarea)[b-v8q3mk4k01],
.large-control :deep(.mud-select-input)[b-v8q3mk4k01] { font-family: "Kanit", sans-serif !important; font-size: 1rem !important; }
.large-control :deep(.mud-input-label)[b-v8q3mk4k01] { font-family: "Kanit", sans-serif !important; font-size: .98rem !important; }
.large-control :deep(.mud-input-outlined-border)[b-v8q3mk4k01] { border-color: #cbd5e1 !important; border-radius: 13px !important; }
.native-date-field[b-v8q3mk4k01] { display: flex; flex-direction: column; justify-content: center; min-height: 56px; padding: 5px 13px 7px; border: 1px solid #cbd5e1; border-radius: 13px; background: white; }
.native-date-field span[b-v8q3mk4k01] { color: var(--slate-600); font-size: .79rem; }
.native-date-field input[b-v8q3mk4k01] { width: 100%; padding: 0; color: var(--slate-800); border: 0; outline: 0; background: transparent; font-family: inherit; font-size: 1rem; }
.filter-footer[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 15px; padding-top: 15px; border-top: 1px dashed var(--slate-200); }
.large-switch :deep(.mud-switch-label)[b-v8q3mk4k01] { font-family: "Kanit", sans-serif; font-size: 1rem; }
.filter-buttons[b-v8q3mk4k01] { display: flex; gap: 10px; }
.reset-button.mud-button-root[b-v8q3mk4k01], .search-button.mud-button-root[b-v8q3mk4k01] { min-height: 47px; padding-inline: 18px; border-radius: 13px; font-family: inherit; font-size: .98rem; font-weight: 650; }
.reset-button.mud-button-root[b-v8q3mk4k01] { color: var(--slate-700); border-color: var(--slate-300); }
.search-button.mud-button-root[b-v8q3mk4k01] { color: white !important; background: var(--green-700) !important; }

.order-list[b-v8q3mk4k01] { display: flex; flex-direction: column; gap: 16px; }
.order-card[b-v8q3mk4k01] { overflow: hidden; border: 1px solid var(--slate-200); border-radius: 22px; background: white; box-shadow: 0 8px 24px rgba(15, 23, 42, .055); transition: .2s ease; }
.order-card:hover[b-v8q3mk4k01] { transform: translateY(-2px); border-color: #a7f3d0; box-shadow: 0 16px 35px rgba(15, 23, 42, .08); }
.order-card.urgent-order[b-v8q3mk4k01] { border-left: 5px solid #f97316; }
.order-card-header[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 20px; border-bottom: 1px solid var(--slate-100); background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--theme-bg) 42%, white)); }
.order-number-block[b-v8q3mk4k01] { display: flex; align-items: center; gap: 13px; min-width: 0; }
.order-icon[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; flex: 0 0 50px; color: #047857; border-radius: 15px; background: #d1fae5; }
.order-number-block small[b-v8q3mk4k01] { display: block; color: var(--slate-500); font-size: .8rem; }
.order-number-block h3[b-v8q3mk4k01] { margin: 0; color: var(--slate-950); font-size: 1.16rem; line-height: 1.35; }
.order-number-block p[b-v8q3mk4k01] { margin: 1px 0 0; color: var(--slate-500); font-size: .86rem; }
.header-badges[b-v8q3mk4k01] { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.status-badge[b-v8q3mk4k01], .payment-badge[b-v8q3mk4k01], .urgent-badge[b-v8q3mk4k01] { display: inline-flex; align-items: center; gap: 5px; padding: 7px 11px; border-radius: 999px; font-size: .84rem; font-weight: 650; white-space: nowrap; }
.status-badge.new[b-v8q3mk4k01], .detail-status-banner.new[b-v8q3mk4k01] { color: #075985; background: #e0f2fe; }
.status-badge.confirmed[b-v8q3mk4k01], .detail-status-banner.confirmed[b-v8q3mk4k01] { color: #1e40af; background: #dbeafe; }
.status-badge.preparing[b-v8q3mk4k01], .detail-status-banner.preparing[b-v8q3mk4k01] { color: #92400e; background: #fef3c7; }
.status-badge.shipping[b-v8q3mk4k01], .detail-status-banner.shipping[b-v8q3mk4k01] { color: #6b21a8; background: #f3e8ff; }
.status-badge.completed[b-v8q3mk4k01], .detail-status-banner.completed[b-v8q3mk4k01] { color: #047857; background: #d1fae5; }
.status-badge.cancelled[b-v8q3mk4k01], .detail-status-banner.cancelled[b-v8q3mk4k01] { color: #b91c1c; background: #fee2e2; }
.payment-badge.pending[b-v8q3mk4k01] { color: #b45309; background: #fff7ed; border: 1px solid #fed7aa; }
.payment-badge.paid[b-v8q3mk4k01] { color: #047857; background: #ecfdf5; border: 1px solid #a7f3d0; }
.payment-badge.refunded[b-v8q3mk4k01] { color: #7e22ce; background: #faf5ff; border: 1px solid #e9d5ff; }
.urgent-badge[b-v8q3mk4k01] { color: #c2410c; background: #fff7ed; border: 1px solid #fdba74; }

.order-card-grid[b-v8q3mk4k01] { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(240px, .72fr) minmax(210px, .62fr); gap: 0; }
.order-products[b-v8q3mk4k01], .order-customer[b-v8q3mk4k01], .order-payment[b-v8q3mk4k01] { padding: 18px 20px; }
.order-customer[b-v8q3mk4k01], .order-payment[b-v8q3mk4k01] { border-left: 1px solid var(--slate-100); }
.order-product-line[b-v8q3mk4k01] { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 0; }
.order-product-line + .order-product-line[b-v8q3mk4k01] { border-top: 1px dashed var(--slate-200); }
.order-product-line img[b-v8q3mk4k01] { width: 62px; height: 62px; object-fit: cover; border-radius: 13px; background: var(--slate-100); }
.product-line-info[b-v8q3mk4k01] { display: flex; flex-direction: column; min-width: 0; }
.product-line-info strong[b-v8q3mk4k01] { overflow: hidden; color: var(--slate-900); font-size: .96rem; text-overflow: ellipsis; white-space: nowrap; }
.product-line-info span[b-v8q3mk4k01] { color: var(--slate-500); font-size: .79rem; }
.product-line-info small[b-v8q3mk4k01] { color: var(--slate-700); font-size: .85rem; }
.order-product-line > b[b-v8q3mk4k01] { color: var(--slate-950); font-size: 1rem; }
.more-items[b-v8q3mk4k01] { padding: 4px 0; color: var(--green-700); border: 0; background: transparent; font-family: inherit; font-weight: 600; cursor: pointer; }
.info-title[b-v8q3mk4k01] { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: var(--slate-500); font-size: .84rem; font-weight: 600; }
.order-customer > strong[b-v8q3mk4k01] { display: block; color: var(--slate-950); font-size: 1.04rem; }
.order-customer > span[b-v8q3mk4k01], .order-customer > p[b-v8q3mk4k01] { display: flex; align-items: center; gap: 5px; margin: 4px 0; color: var(--slate-700); font-size: .88rem; }
.order-customer > small[b-v8q3mk4k01] { display: -webkit-box; overflow: hidden; margin-top: 6px; color: var(--slate-500); font-size: .82rem; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.payment-total[b-v8q3mk4k01] { margin-bottom: 7px; }
.payment-total small[b-v8q3mk4k01] { display: block; color: var(--slate-500); font-size: .82rem; }
.payment-total strong[b-v8q3mk4k01] { color: var(--green-800); font-size: 1.8rem; line-height: 1.2; }
.order-payment > span[b-v8q3mk4k01] { display: block; color: var(--slate-700); font-size: .88rem; }
.order-payment > em[b-v8q3mk4k01] { display: block; margin-top: 7px; color: #b45309; font-size: .83rem; font-style: normal; }
.order-payment > em.paid-text[b-v8q3mk4k01] { color: #047857; }
.order-card-footer[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 20px; border-top: 1px solid var(--slate-100); background: color-mix(in srgb, var(--theme-bg) 42%, white); }
.shop-tracking[b-v8q3mk4k01] { display: flex; flex-wrap: wrap; gap: 14px; color: var(--slate-600); font-size: .84rem; }
.shop-tracking span[b-v8q3mk4k01] { display: inline-flex; align-items: center; gap: 5px; }
.card-actions[b-v8q3mk4k01] { display: flex; gap: 8px; }
.quick-action-button.mud-button-root[b-v8q3mk4k01], .detail-button.mud-button-root[b-v8q3mk4k01] { min-height: 42px; border-radius: 12px; font-family: inherit; font-size: .9rem; font-weight: 650; }
.quick-action-button.mud-button-root[b-v8q3mk4k01] { color: white !important; background: var(--green-700) !important; }
.detail-button.mud-button-root[b-v8q3mk4k01] { color: var(--slate-700); border-color: var(--slate-300); }

.empty-state[b-v8q3mk4k01] { padding: 70px 20px; text-align: center; }
.empty-state > span[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 80px; color: var(--green-700); border-radius: 24px; background: var(--green-50); }
.empty-state h3[b-v8q3mk4k01] { margin: 16px 0 4px; color: var(--slate-900); font-size: 1.35rem; }
.empty-state p[b-v8q3mk4k01] { margin: 0 0 18px; color: var(--slate-500); }
.pagination-bar[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 25px; }
.pagination-bar button[b-v8q3mk4k01] { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 15px; color: var(--slate-700); border: 1px solid var(--slate-300); border-radius: 12px; background: white; font-family: inherit; font-size: .93rem; cursor: pointer; }
.pagination-bar button:disabled[b-v8q3mk4k01] { opacity: .45; cursor: not-allowed; }
.pagination-bar div[b-v8q3mk4k01] { display: flex; align-items: baseline; gap: 7px; color: var(--slate-500); }
.pagination-bar strong[b-v8q3mk4k01] { color: var(--green-700); font-size: 1.35rem; }

.modal-backdrop[b-v8q3mk4k01] { position: fixed; z-index: 1200; inset: 0; display: flex; align-items: center; justify-content: center; padding: 22px; background: rgba(15, 23, 42, .7); backdrop-filter: blur(6px); }
.modal-panel[b-v8q3mk4k01] { display: flex; flex-direction: column; width: min(1180px, 100%); max-height: calc(100vh - 44px); overflow: hidden; border: 1px solid rgba(255, 255, 255, .25); border-radius: 28px; background: #f8fafc; box-shadow: 0 35px 90px rgba(15, 23, 42, .32); }
.detail-modal[b-v8q3mk4k01] { width: min(1240px, 100%); }
.editor-modal[b-v8q3mk4k01] { width: min(1320px, 100%); }
.modal-header[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 26px; color: white; background: linear-gradient(135deg, #052e2b, #047857); }
.modal-header small[b-v8q3mk4k01] { color: #a7f3d0; font-size: .76rem; font-weight: 700; letter-spacing: .13em; }
.modal-header h2[b-v8q3mk4k01] { margin: 1px 0; font-size: 1.65rem; }
.modal-header p[b-v8q3mk4k01] { margin: 0; color: rgba(255, 255, 255, .74); font-size: .9rem; }
.modal-close.mud-icon-button[b-v8q3mk4k01] { color: white; background: rgba(255, 255, 255, .12); }
.detail-status-banner[b-v8q3mk4k01] { display: flex; align-items: center; gap: 13px; padding: 15px 26px; }
.detail-status-banner > span[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; background: rgba(255, 255, 255, .66); }
.detail-status-banner > div[b-v8q3mk4k01] { display: flex; flex: 1; flex-direction: column; }
.detail-status-banner small[b-v8q3mk4k01] { font-size: .78rem; opacity: .78; }
.detail-status-banner strong[b-v8q3mk4k01] { font-size: 1.08rem; }
.detail-status-banner > em[b-v8q3mk4k01] { font-style: normal; }
.detail-scroll[b-v8q3mk4k01], .editor-scroll[b-v8q3mk4k01] { flex: 1; overflow-y: auto; padding: 22px 24px; }
.detail-two-column[b-v8q3mk4k01] { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.detail-card[b-v8q3mk4k01], .form-section[b-v8q3mk4k01] { padding: 20px; border: 1px solid var(--slate-200); border-radius: 19px; background: white; }
.detail-card-title[b-v8q3mk4k01] { display: flex; align-items: center; gap: 9px; margin-bottom: 15px; color: var(--slate-900); font-size: 1.04rem; font-weight: 700; }
.detail-card-title svg[b-v8q3mk4k01] { color: var(--green-700); }
.detail-card dl[b-v8q3mk4k01] { margin: 0; }
.detail-card dl > div[b-v8q3mk4k01] { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--slate-200); }
.detail-card dt[b-v8q3mk4k01] { color: var(--slate-500); font-size: .86rem; }
.detail-card dd[b-v8q3mk4k01] { margin: 0; color: var(--slate-800); font-size: .92rem; font-weight: 550; text-align: right; }
.address-box[b-v8q3mk4k01] { display: flex; gap: 8px; margin-top: 12px; padding: 12px; color: var(--slate-700); border-radius: 13px; background: var(--slate-100); font-size: .88rem; }
.address-box svg[b-v8q3mk4k01] { flex: 0 0 auto; color: var(--green-700); }
.product-detail-card[b-v8q3mk4k01] { margin-bottom: 16px; }
.detail-product-list[b-v8q3mk4k01] { display: flex; flex-direction: column; }
.detail-product-list article[b-v8q3mk4k01] { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto auto; align-items: center; gap: 14px; padding: 12px 0; }
.detail-product-list article + article[b-v8q3mk4k01] { border-top: 1px dashed var(--slate-200); }
.detail-product-list img[b-v8q3mk4k01] { width: 72px; height: 72px; object-fit: cover; border-radius: 14px; }
.detail-product-list article > div[b-v8q3mk4k01] { display: flex; flex-direction: column; min-width: 0; }
.detail-product-list strong[b-v8q3mk4k01] { color: var(--slate-900); }
.detail-product-list span[b-v8q3mk4k01] { color: var(--slate-500); font-size: .82rem; }
.detail-product-list small[b-v8q3mk4k01] { overflow: hidden; color: var(--slate-400); font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.detail-product-list p[b-v8q3mk4k01] { margin: 0; color: var(--slate-600); font-size: .88rem; }
.detail-product-list b[b-v8q3mk4k01] { min-width: 90px; color: var(--slate-950); font-size: 1.05rem; text-align: right; }
.money-summary > div[b-v8q3mk4k01] { display: flex; justify-content: space-between; gap: 15px; padding: 7px 0; color: var(--slate-600); }
.money-summary strong[b-v8q3mk4k01] { color: var(--slate-800); }
.money-summary .grand-total[b-v8q3mk4k01] { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--slate-200); color: var(--slate-900); font-size: 1.05rem; font-weight: 700; }
.money-summary .grand-total strong[b-v8q3mk4k01] { color: var(--green-700); font-size: 1.45rem; }
.payment-method-box[b-v8q3mk4k01] { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 11px 13px; border-radius: 12px; background: var(--green-50); }
.payment-method-box span[b-v8q3mk4k01] { color: var(--slate-700); font-size: .88rem; }
.payment-method-box strong[b-v8q3mk4k01] { color: var(--green-700); }
.timeline-list[b-v8q3mk4k01] { display: flex; flex-direction: column; gap: 12px; }
.timeline-list article[b-v8q3mk4k01] { display: flex; gap: 11px; }
.timeline-list article > span[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 31px; height: 31px; flex: 0 0 31px; color: #059669; border-radius: 50%; background: #d1fae5; }
.timeline-list article > div[b-v8q3mk4k01] { min-width: 0; }
.timeline-list strong[b-v8q3mk4k01] { display: block; color: var(--slate-900); font-size: .9rem; }
.timeline-list p[b-v8q3mk4k01] { margin: 0; color: var(--slate-600); font-size: .82rem; }
.timeline-list small[b-v8q3mk4k01] { color: var(--slate-400); font-size: .74rem; }
.note-card[b-v8q3mk4k01] { margin-bottom: 16px; }
.note-card p[b-v8q3mk4k01] { margin: 7px 0; color: var(--slate-700); }
.inline-action-panel[b-v8q3mk4k01] { display: grid; grid-template-columns: minmax(250px, 1fr) minmax(230px, .8fr) auto; align-items: center; gap: 13px; margin-top: 16px; padding: 16px; border: 1px solid #fed7aa; border-radius: 17px; background: #fff7ed; }
.inline-action-panel.tracking-panel[b-v8q3mk4k01] { grid-template-columns: minmax(230px, 1fr) minmax(180px, .7fr) minmax(210px, .7fr) auto; border-color: #bfdbfe; background: #eff6ff; }
.inline-action-panel > div[b-v8q3mk4k01] { display: flex; align-items: center; gap: 11px; color: #9a3412; }
.tracking-panel > div[b-v8q3mk4k01] { color: #1d4ed8; }
.inline-action-panel > div > span[b-v8q3mk4k01] { display: flex; flex-direction: column; }
.inline-action-panel small[b-v8q3mk4k01] { opacity: .8; }
.confirm-payment-button.mud-button-root[b-v8q3mk4k01], .save-tracking-button.mud-button-root[b-v8q3mk4k01] { min-height: 49px; border-radius: 13px; color: white !important; font-family: inherit; font-weight: 650; }
.confirm-payment-button.mud-button-root[b-v8q3mk4k01] { background: #ea580c !important; }
.save-tracking-button.mud-button-root[b-v8q3mk4k01] { background: #2563eb !important; }
.modal-footer[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 24px; border-top: 1px solid var(--slate-200); background: white; }
.workflow-actions[b-v8q3mk4k01], .footer-right-actions[b-v8q3mk4k01] { display: flex; align-items: center; gap: 9px; }
.workflow-button.mud-button-root[b-v8q3mk4k01], .edit-order-button.mud-button-root[b-v8q3mk4k01], .close-button.mud-button-root[b-v8q3mk4k01], .cancel-order-button.mud-button-root[b-v8q3mk4k01], .save-order-button.mud-button-root[b-v8q3mk4k01] { min-height: 46px; border-radius: 13px; font-family: inherit; font-size: .92rem; font-weight: 650; }
.workflow-button.mud-button-root[b-v8q3mk4k01], .save-order-button.mud-button-root[b-v8q3mk4k01] { color: white !important; background: var(--green-700) !important; }
.cancel-order-button.mud-button-root[b-v8q3mk4k01] { color: #b91c1c; }
.edit-order-button.mud-button-root[b-v8q3mk4k01], .close-button.mud-button-root[b-v8q3mk4k01] { color: var(--slate-700); border-color: var(--slate-300); }

.form-section + .form-section[b-v8q3mk4k01] { margin-top: 16px; }
.form-section-heading[b-v8q3mk4k01] { display: flex; align-items: center; gap: 12px; margin-bottom: 17px; }
.form-section-heading > span[b-v8q3mk4k01] { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; flex: 0 0 48px; color: var(--green-700); border-radius: 15px; background: var(--green-50); }
.form-section-heading h3[b-v8q3mk4k01] { margin: 0; color: var(--slate-950); font-size: 1.13rem; }
.form-section-heading p[b-v8q3mk4k01] { margin: 0; color: var(--slate-500); font-size: .85rem; }
.form-grid[b-v8q3mk4k01] { display: grid; gap: 14px; }
.form-grid.two-columns[b-v8q3mk4k01] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid.three-columns[b-v8q3mk4k01] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.full-width-field[b-v8q3mk4k01] { margin-top: 14px; }
.editor-switch[b-v8q3mk4k01] { align-self: center; }
.add-product-panel[b-v8q3mk4k01] { display: grid; grid-template-columns: minmax(280px, 1fr) 130px auto; align-items: end; gap: 12px; margin-top: 14px; padding: 15px; border: 1px dashed #86efac; border-radius: 16px; background: #f0fdf4; }
.add-line-button.mud-button-root[b-v8q3mk4k01] { min-height: 54px; border-radius: 13px; color: white !important; background: var(--green-700) !important; font-family: inherit; font-weight: 650; }
.editor-empty-lines[b-v8q3mk4k01] { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 110px; margin-top: 14px; color: var(--slate-500); border: 1px dashed var(--slate-300); border-radius: 16px; background: var(--slate-50); }
.editor-line-list[b-v8q3mk4k01] { margin-top: 14px; border: 1px solid var(--slate-200); border-radius: 16px; overflow: hidden; }
.editor-line-list article[b-v8q3mk4k01] { display: grid; grid-template-columns: 66px minmax(230px, 1fr) 120px 140px 110px 44px; align-items: center; gap: 12px; padding: 12px; background: white; }
.editor-line-list article + article[b-v8q3mk4k01] { border-top: 1px solid var(--slate-100); }
.editor-line-list img[b-v8q3mk4k01] { width: 66px; height: 66px; object-fit: cover; border-radius: 13px; }
.editor-product-info[b-v8q3mk4k01] { display: flex; flex-direction: column; min-width: 0; }
.editor-product-info strong[b-v8q3mk4k01] { color: var(--slate-900); }
.editor-product-info span[b-v8q3mk4k01] { color: var(--slate-500); font-size: .82rem; }
.editor-product-info small[b-v8q3mk4k01] { overflow: hidden; color: var(--slate-400); font-size: .73rem; text-overflow: ellipsis; white-space: nowrap; }
.line-qty[b-v8q3mk4k01], .line-discount[b-v8q3mk4k01] { width: 100%; }
.editor-line-total[b-v8q3mk4k01] { display: flex; flex-direction: column; text-align: right; }
.editor-line-total small[b-v8q3mk4k01] { color: var(--slate-500); font-size: .74rem; }
.editor-line-total strong[b-v8q3mk4k01] { color: var(--green-800); }
.remove-line-button.mud-icon-button[b-v8q3mk4k01] { color: #dc2626; background: #fef2f2; }
.editor-total-summary[b-v8q3mk4k01] { width: min(510px, 100%); margin: 17px 0 0 auto; padding: 15px; border-radius: 16px; background: var(--slate-100); }
.editor-total-summary > div[b-v8q3mk4k01] { display: flex; justify-content: space-between; gap: 15px; padding: 4px 0; color: var(--slate-600); }
.editor-total-summary strong[b-v8q3mk4k01] { color: var(--slate-800); }
.editor-total-summary .editor-grand-total[b-v8q3mk4k01] { margin-top: 8px; padding-top: 11px; border-top: 1px solid var(--slate-300); color: var(--slate-900); font-size: 1.08rem; font-weight: 700; }
.editor-grand-total strong[b-v8q3mk4k01] { color: var(--green-700); font-size: 1.5rem; }
.editor-footer[b-v8q3mk4k01] { justify-content: flex-end; }
.save-order-button.mud-button-root[b-v8q3mk4k01] { min-width: 190px; }

@media (max-width: 1450px) {
    .filter-grid[b-v8q3mk4k01] { grid-template-columns: repeat(4, minmax(180px, 1fr)); }
    .filter-search[b-v8q3mk4k01] { grid-column: span 2; }
    .status-overview[b-v8q3mk4k01] { grid-template-columns: repeat(3, 1fr); }
    .order-card-grid[b-v8q3mk4k01] { grid-template-columns: minmax(0, 1.4fr) minmax(230px, .7fr); }
    .order-payment[b-v8q3mk4k01] { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 20px; border-top: 1px solid var(--slate-100); border-left: 0; }
    .order-payment .info-title[b-v8q3mk4k01] { margin: 0; }
    .payment-total[b-v8q3mk4k01] { margin: 0; }
    .order-payment > em[b-v8q3mk4k01] { margin: 0; }
}

@media (max-width: 1120px) {
    .premium-hero[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .hero-action-panel[b-v8q3mk4k01] { display: grid; grid-template-columns: 1fr 1.2fr auto; align-items: center; }
    .hero-button-row[b-v8q3mk4k01] { min-width: 270px; }
    .filter-grid[b-v8q3mk4k01] { grid-template-columns: repeat(3, minmax(180px, 1fr)); }
    .filter-search[b-v8q3mk4k01] { grid-column: span 2; }
    .order-card-grid[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .order-customer[b-v8q3mk4k01], .order-payment[b-v8q3mk4k01] { border-top: 1px solid var(--slate-100); border-left: 0; }
    .order-payment[b-v8q3mk4k01] { grid-column: auto; }
    .detail-two-column[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .inline-action-panel[b-v8q3mk4k01], .inline-action-panel.tracking-panel[b-v8q3mk4k01] { grid-template-columns: 1fr 1fr; }
    .editor-line-list article[b-v8q3mk4k01] { grid-template-columns: 62px minmax(190px, 1fr) 110px 125px; }
    .editor-line-total[b-v8q3mk4k01] { text-align: left; }
    .remove-line-button[b-v8q3mk4k01] { justify-self: end; }
}

@media (max-width: 820px) {
    .market-orders-page[b-v8q3mk4k01] { font-size: 16px; }
    .page-shell[b-v8q3mk4k01] { width: min(100% - 22px, 1720px); padding-top: 12px; }
    .premium-hero[b-v8q3mk4k01] { padding: 26px 22px; border-radius: 23px; }
    .hero-action-panel[b-v8q3mk4k01] { display: flex; }
    .orders-panel[b-v8q3mk4k01] { padding: 18px; border-radius: 22px; }
    .section-heading[b-v8q3mk4k01], .section-actions[b-v8q3mk4k01], .filter-footer[b-v8q3mk4k01], .order-card-header[b-v8q3mk4k01], .order-card-footer[b-v8q3mk4k01], .modal-footer[b-v8q3mk4k01] { align-items: stretch; flex-direction: column; }
    .section-actions[b-v8q3mk4k01], .filter-buttons[b-v8q3mk4k01], .card-actions[b-v8q3mk4k01], .workflow-actions[b-v8q3mk4k01], .footer-right-actions[b-v8q3mk4k01] { width: 100%; }
    .related-page-button[b-v8q3mk4k01], .result-count-box[b-v8q3mk4k01] { justify-content: center; }
    .filter-grid[b-v8q3mk4k01] { grid-template-columns: 1fr 1fr; }
    .filter-search[b-v8q3mk4k01] { grid-column: 1 / -1; }
    .status-overview[b-v8q3mk4k01] { grid-template-columns: 1fr 1fr; }
    .order-payment[b-v8q3mk4k01] { display: block; }
    .order-card-footer .card-actions > *[b-v8q3mk4k01] { flex: 1; }
    .modal-backdrop[b-v8q3mk4k01] { padding: 0; }
    .modal-panel[b-v8q3mk4k01] { width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
    .detail-product-list article[b-v8q3mk4k01] { grid-template-columns: 62px minmax(0, 1fr) auto; }
    .detail-product-list p[b-v8q3mk4k01] { grid-column: 2; }
    .inline-action-panel[b-v8q3mk4k01], .inline-action-panel.tracking-panel[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .form-grid.two-columns[b-v8q3mk4k01], .form-grid.three-columns[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .add-product-panel[b-v8q3mk4k01] { grid-template-columns: 1fr 120px; }
    .add-line-button[b-v8q3mk4k01] { grid-column: 1 / -1; }
    .editor-line-list article[b-v8q3mk4k01] { grid-template-columns: 58px minmax(0, 1fr) 44px; }
    .line-qty[b-v8q3mk4k01], .line-discount[b-v8q3mk4k01], .editor-line-total[b-v8q3mk4k01] { grid-column: span 1; }
    .line-qty[b-v8q3mk4k01] { grid-column: 1 / 2; }
    .line-discount[b-v8q3mk4k01] { grid-column: 2 / 3; }
    .editor-line-total[b-v8q3mk4k01] { grid-column: 3 / 4; }
}

@media (max-width: 560px) {
    .page-shell[b-v8q3mk4k01] { width: min(100% - 14px, 1720px); }
    .premium-hero[b-v8q3mk4k01] { padding: 22px 18px; }
    .hero-content h1[b-v8q3mk4k01] { font-size: 2.25rem; }
    .hero-stat-row[b-v8q3mk4k01] { display: grid; grid-template-columns: 1fr; }
    .hero-stat-row span[b-v8q3mk4k01] { justify-content: center; }
    .hero-button-row[b-v8q3mk4k01] { min-width: 0; }
    .summary-card[b-v8q3mk4k01] { min-height: 128px; padding: 18px; }
    .status-overview[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .filter-grid[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .filter-search[b-v8q3mk4k01] { grid-column: auto; }
    .filter-buttons[b-v8q3mk4k01], .card-actions[b-v8q3mk4k01] { flex-direction: column; }
    .order-card-header[b-v8q3mk4k01] { align-items: flex-start; }
    .header-badges[b-v8q3mk4k01] { justify-content: flex-start; }
    .order-products[b-v8q3mk4k01], .order-customer[b-v8q3mk4k01], .order-payment[b-v8q3mk4k01] { padding: 15px; }
    .order-product-line[b-v8q3mk4k01] { grid-template-columns: 55px minmax(0, 1fr); }
    .order-product-line img[b-v8q3mk4k01] { width: 55px; height: 55px; }
    .order-product-line > b[b-v8q3mk4k01] { grid-column: 2; }
    .detail-scroll[b-v8q3mk4k01], .editor-scroll[b-v8q3mk4k01] { padding: 14px; }
    .modal-header[b-v8q3mk4k01] { padding: 18px; }
    .detail-card[b-v8q3mk4k01], .form-section[b-v8q3mk4k01] { padding: 16px; }
    .detail-card dl > div[b-v8q3mk4k01] { grid-template-columns: 1fr; gap: 1px; }
    .detail-card dd[b-v8q3mk4k01] { text-align: left; }
    .detail-product-list article[b-v8q3mk4k01] { grid-template-columns: 55px minmax(0, 1fr); }
    .detail-product-list article > b[b-v8q3mk4k01], .detail-product-list p[b-v8q3mk4k01] { grid-column: 2; text-align: left; }
    .add-product-panel[b-v8q3mk4k01] { grid-template-columns: 1fr; }
    .editor-line-list article[b-v8q3mk4k01] { grid-template-columns: 54px minmax(0, 1fr) 40px; }
    .line-qty[b-v8q3mk4k01], .line-discount[b-v8q3mk4k01], .editor-line-total[b-v8q3mk4k01] { grid-column: 1 / -1; }
    .remove-line-button[b-v8q3mk4k01] { grid-column: 3; grid-row: 1; }
}
/* /Components/Pages/03Marketplace/01Marketplace/MarketplaceOverview.razor.rz.scp.css */
.marketplace-page[b-7s6a2qw17r] {
    --market-green-950: #052e23;
    --market-green-900: var(--theme-dark);
    --market-green-800: #065f46;
    --market-green-700: #047857;
    --market-green-600: #059669;
    --market-green-500: #10b981;
    --market-green-100: #d1fae5;
    --market-green-50: #ecfdf5;
    --market-gold-600: #ca8a04;
    --market-orange-600: #ea580c;
    --market-blue-600: #2563eb;
    --market-purple-600: #7c3aed;
    --market-ink: #14251f;
    --market-muted: #5f6f68;
    --market-line: #dce8e2;
    --market-surface: #ffffff;
    --market-background: var(--theme-bg);
    min-height: 100vh;
    background:
        radial-gradient(circle at 8% 3%, rgba(16, 185, 129, .10), transparent 24%),
        radial-gradient(circle at 95% 14%, rgba(202, 138, 4, .08), transparent 22%),
        var(--market-background);
    color: var(--market-ink);
    font-size: 17px;
}

.marketplace-container[b-7s6a2qw17r] {
    width: 100%;
    max-width: 1780px;
    margin: 0 auto;
    padding: 28px 30px 72px !important;
}

.marketplace-hero[b-7s6a2qw17r] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(330px, .55fr);
    gap: 30px;
    min-height: 338px;
    overflow: hidden;
    padding: 40px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 32px;
    background:
        linear-gradient(120deg, rgba(5, 46, 35, .98), rgba(6, 95, 70, .96) 55%, rgba(4, 120, 87, .92)),
        linear-gradient(45deg, #052e23, #059669);
    box-shadow: 0 24px 60px rgba(5, 46, 35, .22);
    isolation: isolate;
}

.hero-pattern[b-7s6a2qw17r] {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .5;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(90deg, #000, transparent 82%);
}

.marketplace-hero[b-7s6a2qw17r]::before,
.marketplace-hero[b-7s6a2qw17r]::after {
    position: absolute;
    z-index: -1;
    content: "";
    border-radius: 50%;
}

.marketplace-hero[b-7s6a2qw17r]::before {
    width: 360px;
    height: 360px;
    right: -120px;
    top: -155px;
    background: rgba(255,255,255,.08);
}

.marketplace-hero[b-7s6a2qw17r]::after {
    width: 270px;
    height: 270px;
    right: 24%;
    bottom: -210px;
    background: rgba(250, 204, 21, .11);
}

.hero-content[b-7s6a2qw17r],
.hero-side-panel[b-7s6a2qw17r] {
    position: relative;
    z-index: 1;
}

.hero-badge[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 23px;
    padding: 9px 15px 9px 10px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 16px;
    background: rgba(255,255,255,.09);
    backdrop-filter: blur(10px);
}

.hero-badge > span[b-7s6a2qw17r] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    color: var(--market-green-950);
    background: #fff;
}

.hero-badge small[b-7s6a2qw17r],
.hero-badge strong[b-7s6a2qw17r] {
    display: block;
}

.hero-badge small[b-7s6a2qw17r] {
    margin-bottom: 3px;
    color: #a7f3d0;
    font-size: .79rem;
    font-weight: 800;
    letter-spacing: .11em;
}

.hero-badge strong[b-7s6a2qw17r] {
    color: rgba(255,255,255,.92);
    font-size: .98rem;
    font-weight: 600;
}

.hero-content h1[b-7s6a2qw17r] {
    margin: 0 0 14px;
    color: #fff;
    font-size: clamp(2.35rem, 4vw, 4.45rem);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.035em;
}

.hero-content > p[b-7s6a2qw17r] {
    max-width: 850px;
    margin: 0;
    color: rgba(255,255,255,.82);
    font-size: 1.12rem;
    line-height: 1.85;
}

.hero-meta[b-7s6a2qw17r] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 27px;
}

.hero-meta span[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 999px;
    color: rgba(255,255,255,.92);
    background: rgba(255,255,255,.07);
    font-size: .94rem;
    font-weight: 600;
}

.hero-side-panel[b-7s6a2qw17r] {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 17px;
    padding: 23px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 25px;
    background: rgba(4, 44, 34, .46);
    box-shadow: inset 0 1px rgba(255,255,255,.07);
    backdrop-filter: blur(16px);
}

.hero-side-status[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(255,255,255,.12);
}

.live-dot[b-7s6a2qw17r] {
    position: relative;
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #86efac;
    box-shadow: 0 0 0 7px rgba(134, 239, 172, .12);
}

.hero-side-status strong[b-7s6a2qw17r],
.hero-side-status small[b-7s6a2qw17r] {
    display: block;
}

.hero-side-status strong[b-7s6a2qw17r] {
    color: #fff;
    font-size: 1.07rem;
}

.hero-side-status small[b-7s6a2qw17r] {
    margin-top: 4px;
    color: rgba(255,255,255,.68);
    font-size: .91rem;
}

.hero-sales-box small[b-7s6a2qw17r],
.hero-sales-box strong[b-7s6a2qw17r],
.hero-sales-box span[b-7s6a2qw17r] {
    display: block;
}

.hero-sales-box small[b-7s6a2qw17r] {
    color: #a7f3d0;
    font-size: .97rem;
    font-weight: 700;
}

.hero-sales-box strong[b-7s6a2qw17r] {
    margin: 4px 0 7px;
    color: #fff;
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    font-weight: 900;
    line-height: 1.1;
}

.hero-sales-box span[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #bbf7d0;
    font-size: .95rem;
    font-weight: 650;
}

.hero-action-row[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 11px;
}

.primary-hero-button[b-7s6a2qw17r] {
    min-height: 50px;
    border-radius: 14px !important;
    color: var(--market-green-950) !important;
    background: #fff !important;
    font-size: 1.02rem !important;
    font-weight: 800 !important;
    box-shadow: 0 12px 25px rgba(0,0,0,.16) !important;
}

.refresh-hero-button[b-7s6a2qw17r] {
    width: 50px !important;
    height: 50px !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    border-radius: 14px !important;
    color: #fff !important;
    background: rgba(255,255,255,.09) !important;
}

.marketplace-loading[b-7s6a2qw17r] {
    margin: 18px 0 0;
    border-radius: 999px;
}

.marketplace-alert[b-7s6a2qw17r] {
    margin-top: 18px;
    border-radius: 18px !important;
    font-size: 1rem;
}

.summary-grid[b-7s6a2qw17r] {
    margin-top: 8px !important;
}

.summary-card[b-7s6a2qw17r] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 17px;
    min-height: 155px;
    overflow: hidden;
    padding: 22px;
    border: 1px solid var(--market-line);
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 14px 35px rgba(29, 55, 45, .08);
}

.summary-card[b-7s6a2qw17r]::after {
    position: absolute;
    width: 92px;
    height: 92px;
    right: -34px;
    bottom: -44px;
    content: "";
    border-radius: 50%;
    background: var(--summary-soft);
}

.summary-icon[b-7s6a2qw17r] {
    display: grid;
    width: 62px;
    height: 62px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 19px;
    color: var(--summary-color);
    background: var(--summary-soft);
}

.summary-icon .mud-icon-root[b-7s6a2qw17r] {
    font-size: 32px;
}

.summary-body[b-7s6a2qw17r] {
    min-width: 0;
}

.summary-body small[b-7s6a2qw17r],
.summary-body strong[b-7s6a2qw17r],
.summary-body span[b-7s6a2qw17r] {
    display: block;
}

.summary-body > small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .98rem;
    font-weight: 650;
}

.summary-body > strong[b-7s6a2qw17r] {
    margin: 5px 0 3px;
    color: var(--market-ink);
    font-size: 1.82rem;
    font-weight: 900;
    line-height: 1.13;
}

.summary-body > strong em[b-7s6a2qw17r] {
    font-size: .95rem;
    font-style: normal;
    font-weight: 650;
}

.summary-body > span[b-7s6a2qw17r] {
    color: #75827d;
    font-size: .91rem;
    font-weight: 600;
}

.sales-card[b-7s6a2qw17r] { --summary-color: #047857; --summary-soft: #d1fae5; }
.shop-card[b-7s6a2qw17r] { --summary-color: #2563eb; --summary-soft: #dbeafe; }
.product-card-summary[b-7s6a2qw17r] { --summary-color: #7c3aed; --summary-soft: #ede9fe; }
.order-card[b-7s6a2qw17r] { --summary-color: #c2410c; --summary-soft: #ffedd5; }

.positive-text[b-7s6a2qw17r],
.warning-text[b-7s6a2qw17r] {
    display: flex !important;
    align-items: center;
    gap: 4px;
}

.positive-text[b-7s6a2qw17r] { color: #047857 !important; }
.warning-text[b-7s6a2qw17r] { color: #b45309 !important; }

.quick-stat-strip[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    margin: 19px 0 0;
    border: 1px solid var(--market-line);
    border-radius: 20px;
    background: var(--market-line);
    box-shadow: 0 12px 30px rgba(29,55,45,.06);
}

.quick-stat-strip article[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 17px 20px;
    background: rgba(255,255,255,.96);
}

.quick-stat-strip article > span[b-7s6a2qw17r] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
    color: var(--market-green-700);
    background: var(--market-green-50);
}

.quick-stat-strip small[b-7s6a2qw17r],
.quick-stat-strip strong[b-7s6a2qw17r] {
    display: block;
}

.quick-stat-strip small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .9rem;
}

.quick-stat-strip strong[b-7s6a2qw17r] {
    margin-top: 2px;
    font-size: 1.08rem;
    font-weight: 800;
}

.content-section[b-7s6a2qw17r],
.analytics-panel[b-7s6a2qw17r],
.orders-panel[b-7s6a2qw17r],
.announcement-panel[b-7s6a2qw17r] {
    margin-top: 25px;
    border: 1px solid var(--market-line);
    border-radius: 27px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 16px 42px rgba(29,55,45,.07);
}

.content-section[b-7s6a2qw17r] {
    padding: 27px;
}

.section-heading[b-7s6a2qw17r],
.panel-heading[b-7s6a2qw17r] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.section-heading small[b-7s6a2qw17r],
.panel-heading small[b-7s6a2qw17r] {
    color: var(--market-green-700);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.section-heading h2[b-7s6a2qw17r],
.panel-heading h2[b-7s6a2qw17r] {
    margin: 4px 0 0;
    color: var(--market-ink);
    font-size: clamp(1.45rem, 2.1vw, 2.05rem);
    font-weight: 900;
    line-height: 1.25;
}

.section-heading p[b-7s6a2qw17r] {
    margin: 5px 0 0;
    color: var(--market-muted);
    font-size: 1rem;
}

.section-link[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 43px;
    padding: 0 14px;
    border: 1px solid var(--market-line);
    border-radius: 13px;
    color: var(--market-green-700);
    background: #fff;
    font: inherit;
    font-size: .97rem;
    font-weight: 750;
    cursor: pointer;
}

.category-grid[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    margin-top: 23px;
}

.category-card[b-7s6a2qw17r] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 204px;
    padding: 18px;
    overflow: hidden;
    border: 1px solid var(--market-line);
    border-radius: 20px;
    text-align: left;
    color: var(--market-ink);
    background: #fff;
    font: inherit;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.category-card[b-7s6a2qw17r]::after {
    position: absolute;
    width: 90px;
    height: 90px;
    right: -36px;
    bottom: -42px;
    content: "";
    border-radius: 50%;
    background: color-mix(in srgb, var(--category-accent) 13%, white);
}

.category-card:hover[b-7s6a2qw17r],
.category-card.active[b-7s6a2qw17r] {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--category-accent) 42%, white);
    box-shadow: 0 16px 30px color-mix(in srgb, var(--category-accent) 12%, transparent);
}

.category-card.active[b-7s6a2qw17r] {
    background: color-mix(in srgb, var(--category-accent) 5%, white);
}

.category-icon[b-7s6a2qw17r] {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 15px;
    color: var(--category-accent);
    background: color-mix(in srgb, var(--category-accent) 11%, white);
}

.category-card strong[b-7s6a2qw17r],
.category-card small[b-7s6a2qw17r],
.category-card p[b-7s6a2qw17r] {
    display: block;
}

.category-card strong[b-7s6a2qw17r] {
    margin-top: 15px;
    font-size: 1.05rem;
    font-weight: 850;
}

.category-card small[b-7s6a2qw17r] {
    min-height: 42px;
    margin-top: 5px;
    color: var(--market-muted);
    font-size: .86rem;
    line-height: 1.5;
}

.category-card p[b-7s6a2qw17r] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 13px 0 0;
}

.category-card p span[b-7s6a2qw17r] {
    padding: 4px 8px;
    border-radius: 999px;
    color: #66746f;
    background: #f4f7f5;
    font-size: .78rem;
    font-weight: 700;
}

.category-card em[b-7s6a2qw17r] {
    position: absolute;
    top: 18px;
    right: 16px;
    color: var(--category-accent);
    font-size: .83rem;
    font-style: normal;
    font-weight: 800;
}

.dashboard-grid[b-7s6a2qw17r],
.bottom-dashboard-grid[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(360px, .6fr);
    gap: 25px;
}

.analytics-panel[b-7s6a2qw17r] {
    padding: 27px;
}

.panel-badge[b-7s6a2qw17r] {
    padding: 7px 11px;
    border-radius: 999px;
    color: #047857;
    background: #d1fae5;
    font-size: .88rem;
    font-weight: 800;
}

.panel-badge.soft[b-7s6a2qw17r] {
    color: #475569;
    background: #f1f5f9;
}

.sales-chart[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 14px;
    min-height: 270px;
    margin-top: 24px;
    padding: 14px 4px 0;
}

.sales-column[b-7s6a2qw17r] {
    display: grid;
    grid-template-rows: 28px 1fr 25px 22px;
    align-items: end;
    justify-items: center;
    min-width: 0;
}

.sales-value[b-7s6a2qw17r] {
    color: #475569;
    font-size: .78rem;
    font-weight: 750;
}

.sales-bar-track[b-7s6a2qw17r] {
    position: relative;
    width: 74%;
    height: 100%;
    min-height: 155px;
    overflow: hidden;
    border-radius: 13px 13px 7px 7px;
    background: linear-gradient(180deg, #f0fdf4, #f8faf9);
}

.sales-bar[b-7s6a2qw17r] {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 18%;
    border-radius: 13px 13px 7px 7px;
    background: linear-gradient(180deg, #34d399, #047857);
    box-shadow: 0 8px 20px rgba(5,150,105,.25);
}

.sales-column strong[b-7s6a2qw17r] {
    margin-top: 5px;
    font-size: .94rem;
}

.sales-column small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .74rem;
}

.area-performance-list[b-7s6a2qw17r] {
    display: grid;
    gap: 17px;
    margin-top: 24px;
}

.area-row-head[b-7s6a2qw17r] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.area-row-head strong[b-7s6a2qw17r] {
    font-size: .96rem;
}

.area-row-head span[b-7s6a2qw17r] {
    color: var(--market-green-700);
    font-size: .93rem;
    font-weight: 800;
}

.area-progress-track[b-7s6a2qw17r] {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #eaf1ed;
}

.area-progress-track span[b-7s6a2qw17r] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #34d399, #047857);
}

.area-row > small[b-7s6a2qw17r] {
    display: block;
    margin-top: 6px;
    color: var(--market-muted);
    font-size: .82rem;
}

.outline-action-button[b-7s6a2qw17r],
.green-action-button[b-7s6a2qw17r] {
    min-height: 47px;
    border-radius: 13px !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
}

.outline-action-button[b-7s6a2qw17r] {
    border-color: #b7d6c8 !important;
    color: var(--market-green-700) !important;
}

.green-action-button[b-7s6a2qw17r] {
    color: #fff !important;
    background: var(--market-green-700) !important;
}

.shop-grid[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 23px;
}

.shop-card-item[b-7s6a2qw17r],
.product-card-item[b-7s6a2qw17r],
.campaign-card[b-7s6a2qw17r] {
    overflow: hidden;
    border: 1px solid var(--market-line);
    border-radius: 22px;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

.shop-card-item:hover[b-7s6a2qw17r],
.product-card-item:hover[b-7s6a2qw17r],
.campaign-card:hover[b-7s6a2qw17r] {
    transform: translateY(-4px);
    box-shadow: 0 18px 34px rgba(29,55,45,.11);
}

.shop-cover[b-7s6a2qw17r],
.product-image-wrap[b-7s6a2qw17r],
.campaign-image[b-7s6a2qw17r] {
    position: relative;
    overflow: hidden;
}

.shop-cover[b-7s6a2qw17r] {
    height: 188px;
}

.shop-cover img[b-7s6a2qw17r],
.product-image-wrap img[b-7s6a2qw17r],
.campaign-image img[b-7s6a2qw17r] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.shop-cover[b-7s6a2qw17r]::after,
.product-image-wrap[b-7s6a2qw17r]::after {
    position: absolute;
    inset: auto 0 0;
    height: 44%;
    content: "";
    pointer-events: none;
    background: linear-gradient(transparent, rgba(0,0,0,.48));
}

.shop-source-badge[b-7s6a2qw17r],
.verified-badge[b-7s6a2qw17r] {
    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 750;
}

.shop-source-badge[b-7s6a2qw17r] {
    right: 11px;
    bottom: 11px;
    max-width: calc(100% - 22px);
    padding: 6px 9px;
    color: #fff;
    background: rgba(0,0,0,.38);
    backdrop-filter: blur(8px);
}

.verified-badge[b-7s6a2qw17r] {
    top: 11px;
    left: 11px;
    padding: 6px 9px;
    color: #065f46;
    background: rgba(236,253,245,.94);
}

.shop-card-content[b-7s6a2qw17r] {
    padding: 19px;
}

.shop-title-row[b-7s6a2qw17r] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.shop-title-row h3[b-7s6a2qw17r],
.product-card-content h3[b-7s6a2qw17r],
.campaign-content h3[b-7s6a2qw17r] {
    margin: 0;
    color: var(--market-ink);
    font-size: 1.13rem;
    font-weight: 850;
    line-height: 1.4;
}

.shop-title-row > div > span[b-7s6a2qw17r],
.product-shop[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 5px;
    color: var(--market-muted);
    font-size: .86rem;
}

.rating-box[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 8px;
    border-radius: 10px;
    color: #a16207;
    background: #fef9c3;
    font-size: .86rem;
    white-space: nowrap;
}

.shop-card-content > p[b-7s6a2qw17r] {
    min-height: 70px;
    margin: 13px 0;
    color: var(--market-muted);
    font-size: .92rem;
    line-height: 1.7;
}

.shop-metrics[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: .7fr 1.3fr .8fr;
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--theme-border);
    border-radius: 14px;
    background: var(--theme-border);
}

.shop-metrics div[b-7s6a2qw17r] {
    padding: 10px 8px;
    text-align: center;
    background: #fafcfb;
}

.shop-metrics small[b-7s6a2qw17r],
.shop-metrics strong[b-7s6a2qw17r] {
    display: block;
}

.shop-metrics small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .72rem;
}

.shop-metrics strong[b-7s6a2qw17r] {
    margin-top: 3px;
    font-size: .92rem;
    font-weight: 800;
}

.shop-detail-button[b-7s6a2qw17r],
.product-detail-button[b-7s6a2qw17r] {
    display: flex;
    width: 100%;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 15px;
    border: 0;
    border-radius: 13px;
    color: var(--market-green-700);
    background: var(--market-green-50);
    font: inherit;
    font-size: .94rem;
    font-weight: 800;
    cursor: pointer;
}

.filter-panel[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: minmax(280px, 1.5fr) repeat(3, minmax(170px, .7fr));
    gap: 13px;
    margin-top: 23px;
    padding: 17px;
    border: 1px solid #dce8e2;
    border-radius: 20px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.large-control .mud-input-control-input-container[b-7s6a2qw17r],
.large-control .mud-input-root[b-7s6a2qw17r] {
    min-height: 56px;
}

.large-control .mud-input-label[b-7s6a2qw17r],
.large-control input[b-7s6a2qw17r],
.large-control .mud-select-input[b-7s6a2qw17r] {
    font-size: 1rem !important;
}

.result-summary-row[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin: 18px 0 14px;
}

.result-summary-row strong[b-7s6a2qw17r] {
    font-size: 1.02rem;
}

.result-summary-row button[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 0;
    color: #b45309;
    background: transparent;
    font: inherit;
    font-size: .9rem;
    font-weight: 750;
    cursor: pointer;
}

.product-grid[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.product-image-wrap[b-7s6a2qw17r] {
    height: 225px;
}

.product-badges[b-7s6a2qw17r] {
    position: absolute;
    z-index: 2;
    top: 11px;
    left: 11px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.badge[b-7s6a2qw17r] {
    padding: 6px 9px;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 800;
}

.badge.bestseller[b-7s6a2qw17r] { color: #fff; background: #c2410c; }
.badge.new[b-7s6a2qw17r] { color: #fff; background: #2563eb; }
.badge.discount[b-7s6a2qw17r] { color: #fff; background: #dc2626; }

.favorite-button[b-7s6a2qw17r] {
    position: absolute;
    z-index: 2;
    top: 11px;
    right: 11px;
    display: grid;
    width: 41px;
    height: 41px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    color: #dc2626;
    background: rgba(255,255,255,.92);
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(0,0,0,.15);
}

.product-card-content[b-7s6a2qw17r] {
    padding: 18px;
}

.product-category[b-7s6a2qw17r] {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--market-green-700);
    font-size: .8rem;
    font-weight: 850;
    letter-spacing: .025em;
}

.product-card-content h3[b-7s6a2qw17r] {
    min-height: 50px;
}

.product-shop[b-7s6a2qw17r] {
    margin: 6px 0 0;
}

.product-description[b-7s6a2qw17r] {
    display: -webkit-box;
    min-height: 48px;
    margin: 10px 0;
    overflow: hidden;
    color: var(--market-muted);
    font-size: .88rem;
    line-height: 1.6;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.rating-row[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid #edf2ef;
    border-bottom: 1px solid #edf2ef;
}

.rating-row span[b-7s6a2qw17r] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #a16207;
    font-size: .88rem;
    font-weight: 800;
}

.rating-row small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .76rem;
}

.price-row[b-7s6a2qw17r] {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin-top: 12px;
}

.price-row strong[b-7s6a2qw17r] {
    color: var(--market-green-800);
    font-size: 1.42rem;
    font-weight: 900;
}

.price-row del[b-7s6a2qw17r] {
    color: #9ca3af;
    font-size: .88rem;
}

.stock-row[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 5px;
    font-size: .82rem;
    font-weight: 700;
}

.stock-row span[b-7s6a2qw17r] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.stock-row.ready[b-7s6a2qw17r] { color: #047857; }
.stock-row.ready span[b-7s6a2qw17r] { background: #10b981; }
.stock-row.low[b-7s6a2qw17r] { color: #b45309; }
.stock-row.low span[b-7s6a2qw17r] { background: #f59e0b; }
.stock-row.out[b-7s6a2qw17r] { color: #b91c1c; }
.stock-row.out span[b-7s6a2qw17r] { background: #ef4444; }

.product-source-row[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 7px 9px;
    border-radius: 10px;
    color: #64748b;
    background: #f8fafc;
    font-size: .75rem;
    font-weight: 650;
}

.empty-state[b-7s6a2qw17r] {
    display: grid;
    justify-items: center;
    padding: 45px 20px;
    text-align: center;
}

.empty-state > span[b-7s6a2qw17r] {
    display: grid;
    width: 72px;
    height: 72px;
    place-items: center;
    border-radius: 22px;
    color: var(--market-green-700);
    background: var(--market-green-50);
}

.empty-state h3[b-7s6a2qw17r] {
    margin: 15px 0 5px;
    font-size: 1.35rem;
}

.empty-state p[b-7s6a2qw17r] {
    margin: 0 0 17px;
    color: var(--market-muted);
}

.campaign-grid[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 23px;
}

.campaign-image[b-7s6a2qw17r] {
    height: 182px;
}

.campaign-image > span[b-7s6a2qw17r] {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #fff;
    background: var(--campaign-accent);
    font-size: .78rem;
    font-weight: 800;
}

.campaign-content[b-7s6a2qw17r] {
    padding: 18px;
}

.campaign-title-row[b-7s6a2qw17r] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.campaign-title-row p[b-7s6a2qw17r] {
    margin: 5px 0 0;
    color: var(--market-muted);
    font-size: .88rem;
    line-height: 1.55;
}

.campaign-status[b-7s6a2qw17r] {
    flex: 0 0 auto;
    padding: 6px 8px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
}

.campaign-status.active[b-7s6a2qw17r] { color: #047857; background: #d1fae5; }
.campaign-status.upcoming[b-7s6a2qw17r] { color: #1d4ed8; background: #dbeafe; }

.campaign-date[b-7s6a2qw17r] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 14px 0;
    color: #64748b;
    font-size: .85rem;
    font-weight: 650;
}

.campaign-metrics[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--theme-border);
    border-radius: 13px;
    background: var(--theme-border);
}

.campaign-metrics div[b-7s6a2qw17r] {
    padding: 9px 5px;
    text-align: center;
    background: #fafcfb;
}

.campaign-metrics small[b-7s6a2qw17r],
.campaign-metrics strong[b-7s6a2qw17r] {
    display: block;
}

.campaign-metrics small[b-7s6a2qw17r] {
    color: var(--market-muted);
    font-size: .68rem;
}

.campaign-metrics strong[b-7s6a2qw17r] {
    margin-top: 3px;
    font-size: .84rem;
}

.bottom-dashboard-grid[b-7s6a2qw17r] {
    grid-template-columns: minmax(0, 1.45fr) minmax(360px, .55fr);
}

.orders-panel[b-7s6a2qw17r],
.announcement-panel[b-7s6a2qw17r] {
    padding: 25px;
}

.bottom-panel-heading[b-7s6a2qw17r] {
    align-items: center;
}

.order-table-wrap[b-7s6a2qw17r] {
    margin-top: 18px;
    overflow-x: auto;
}

.order-table[b-7s6a2qw17r] {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

.order-table th[b-7s6a2qw17r],
.order-table td[b-7s6a2qw17r] {
    padding: 14px 12px;
    border-bottom: 1px solid var(--theme-border);
    text-align: left;
    vertical-align: middle;
}

.order-table th[b-7s6a2qw17r] {
    color: #62706a;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    font-size: .83rem;
    font-weight: 800;
}

.order-table td[b-7s6a2qw17r] {
    color: #36453f;
    font-size: .9rem;
}

.order-table td strong[b-7s6a2qw17r],
.order-table td small[b-7s6a2qw17r] {
    display: block;
}

.order-table td small[b-7s6a2qw17r] {
    margin-top: 3px;
    color: #7b8983;
    font-size: .77rem;
}

.order-total[b-7s6a2qw17r] {
    color: var(--market-green-700);
    font-size: 1rem;
}

.order-status[b-7s6a2qw17r] {
    display: inline-block;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
    white-space: nowrap;
}

.order-status.new[b-7s6a2qw17r] { color: #1d4ed8; background: #dbeafe; }
.order-status.preparing[b-7s6a2qw17r] { color: #b45309; background: #fef3c7; }
.order-status.shipping[b-7s6a2qw17r] { color: #6d28d9; background: #ede9fe; }
.order-status.completed[b-7s6a2qw17r] { color: #047857; background: #d1fae5; }
.order-status.cancelled[b-7s6a2qw17r] { color: #b91c1c; background: #fee2e2; }

.announcement-list[b-7s6a2qw17r] {
    display: grid;
    gap: 11px;
    margin-top: 18px;
}

.announcement-list button[b-7s6a2qw17r] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: start;
    width: 100%;
    padding: 14px;
    border: 1px solid #e6eeea;
    border-radius: 16px;
    text-align: left;
    color: var(--market-ink);
    background: #fff;
    font: inherit;
    cursor: pointer;
}

.announcement-icon[b-7s6a2qw17r] {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 13px;
}

.announcement-icon.training[b-7s6a2qw17r] { color: #2563eb; background: #dbeafe; }
.announcement-icon.notice[b-7s6a2qw17r] { color: #c2410c; background: #ffedd5; }
.announcement-icon.event[b-7s6a2qw17r] { color: #7c3aed; background: #ede9fe; }

.announcement-list strong[b-7s6a2qw17r] {
    display: block;
    font-size: .96rem;
    font-weight: 800;
    line-height: 1.4;
}

.announcement-list p[b-7s6a2qw17r] {
    margin: 5px 0;
    color: var(--market-muted);
    font-size: .84rem;
    line-height: 1.5;
}

.announcement-list small[b-7s6a2qw17r] {
    color: #7b8983;
    font-size: .77rem;
}

@media (max-width: 1450px) {
    .category-grid[b-7s6a2qw17r] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .shop-grid[b-7s6a2qw17r],
    .product-grid[b-7s6a2qw17r] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .marketplace-hero[b-7s6a2qw17r],
    .dashboard-grid[b-7s6a2qw17r],
    .bottom-dashboard-grid[b-7s6a2qw17r] {
        grid-template-columns: 1fr;
    }

    .hero-side-panel[b-7s6a2qw17r] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }

    .hero-action-row[b-7s6a2qw17r] {
        grid-column: 1 / -1;
    }

    .quick-stat-strip[b-7s6a2qw17r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-panel[b-7s6a2qw17r] {
        grid-template-columns: 1fr 1fr;
    }

    .shop-grid[b-7s6a2qw17r],
    .product-grid[b-7s6a2qw17r] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .campaign-grid[b-7s6a2qw17r] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .marketplace-page[b-7s6a2qw17r] {
        font-size: 16px;
    }

    .marketplace-container[b-7s6a2qw17r] {
        padding: 14px 13px 45px !important;
    }

    .marketplace-hero[b-7s6a2qw17r] {
        padding: 25px 20px;
        border-radius: 25px;
    }

    .hero-badge[b-7s6a2qw17r] {
        align-items: flex-start;
    }

    .hero-badge strong[b-7s6a2qw17r] {
        font-size: .86rem;
    }

    .hero-side-panel[b-7s6a2qw17r] {
        display: flex;
    }

    .summary-card[b-7s6a2qw17r] {
        min-height: 135px;
    }

    .quick-stat-strip[b-7s6a2qw17r],
    .category-grid[b-7s6a2qw17r],
    .shop-grid[b-7s6a2qw17r],
    .product-grid[b-7s6a2qw17r],
    .filter-panel[b-7s6a2qw17r] {
        grid-template-columns: 1fr;
    }

    .content-section[b-7s6a2qw17r],
    .analytics-panel[b-7s6a2qw17r],
    .orders-panel[b-7s6a2qw17r],
    .announcement-panel[b-7s6a2qw17r] {
        padding: 19px;
        border-radius: 22px;
    }

    .section-heading[b-7s6a2qw17r],
    .panel-heading[b-7s6a2qw17r],
    .product-heading[b-7s6a2qw17r] {
        flex-direction: column;
        align-items: stretch;
    }

    .section-link[b-7s6a2qw17r],
    .outline-action-button[b-7s6a2qw17r],
    .green-action-button[b-7s6a2qw17r] {
        width: 100%;
        justify-content: center;
    }

    .category-card[b-7s6a2qw17r] {
        min-height: 180px;
    }

    .sales-chart[b-7s6a2qw17r] {
        gap: 6px;
        min-width: 620px;
    }

    .sales-panel[b-7s6a2qw17r] {
        overflow-x: auto;
    }

    .shop-cover[b-7s6a2qw17r],
    .product-image-wrap[b-7s6a2qw17r] {
        height: 220px;
    }

    .campaign-metrics[b-7s6a2qw17r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .result-summary-row[b-7s6a2qw17r] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (min-width: 1900px) {
    .marketplace-page[b-7s6a2qw17r] {
        font-size: 18px;
    }

    .marketplace-container[b-7s6a2qw17r] {
        max-width: 1920px;
        padding-inline: 42px !important;
    }

    .summary-card[b-7s6a2qw17r] {
        min-height: 170px;
    }

    .shop-cover[b-7s6a2qw17r] {
        height: 205px;
    }

    .product-image-wrap[b-7s6a2qw17r] {
        height: 250px;
    }
}
/* /Components/Pages/03Marketplace/02Community-jobs/CommunityJobApplications.razor.rz.scp.css */
.community-applications-page[b-10qiashkfn] {
    --app-green-950: #063c2d;
    --app-green-900: #0a4c39;
    --app-green-800: #0f6247;
    --app-green-700: #157a55;
    --app-green-600: #23946a;
    --app-green-100: #e7f7ef;
    --app-ink: #18352b;
    --app-muted: #687a73;
    --app-border: #dce9e3;
    --app-bg: var(--theme-bg);
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px 20px 64px;
    color: var(--app-ink);
    font-family: "Kanit", sans-serif;
}

.community-applications-page[b-10qiashkfn]  * {
    box-sizing: border-box;
}

.community-applications-page[b-10qiashkfn]  .applications-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4.5vw, 60px);
    border-radius: 32px;
    color: #fff;
    background:
        linear-gradient(128deg, rgba(5, 56, 41, .99), rgba(19, 119, 82, .96)),
        radial-gradient(circle at 90% 10%, rgba(255, 255, 255, .18), transparent 34%);
    box-shadow: 0 24px 58px rgba(10, 69, 50, .24);
}

.community-applications-page[b-10qiashkfn]  .hero-pattern {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .10);
}

.community-applications-page[b-10qiashkfn]  .hero-pattern-one {
    width: 470px;
    height: 470px;
    right: -150px;
    top: -270px;
    background: rgba(255, 255, 255, .055);
}

.community-applications-page[b-10qiashkfn]  .hero-pattern-two {
    width: 280px;
    height: 280px;
    right: 28%;
    bottom: -210px;
    background: rgba(255, 213, 110, .10);
}

.community-applications-page[b-10qiashkfn]  .hero-kicker {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .11);
    backdrop-filter: blur(12px);
    font-size: 1.05rem;
    font-weight: 600;
}

.community-applications-page[b-10qiashkfn]  .hero-title {
    position: relative;
    z-index: 2;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.15rem, 4.4vw, 3.75rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.025em;
}

.community-applications-page[b-10qiashkfn]  .hero-subtitle {
    position: relative;
    z-index: 2;
    max-width: 920px;
    margin-top: 14px;
    color: rgba(255, 255, 255, .84);
    font-size: clamp(1.08rem, 1.7vw, 1.35rem);
    line-height: 1.75;
}

.community-applications-page[b-10qiashkfn]  .hero-features {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    margin-top: 26px;
}

.community-applications-page[b-10qiashkfn]  .hero-features span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .93);
    font-size: 1.03rem;
    font-weight: 500;
}

.community-applications-page[b-10qiashkfn]  .hero-action-card {
    position: relative;
    z-index: 2;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: 25px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(15px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11);
}

.community-applications-page[b-10qiashkfn]  .hero-action-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.community-applications-page[b-10qiashkfn]  .hero-action-icon {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 20px;
    color: var(--app-green-900);
    background: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
}

.community-applications-page[b-10qiashkfn]  .hero-action-chip {
    color: #fff !important;
    background: rgba(255, 255, 255, .16) !important;
    border: 1px solid rgba(255, 255, 255, .20);
    font-family: "Kanit", sans-serif;
    font-weight: 600;
}

.community-applications-page[b-10qiashkfn]  .hero-action-title {
    color: #fff;
    font-size: 1.42rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .hero-action-description {
    margin: 8px 0 20px;
    color: rgba(255, 255, 255, .80);
    font-size: 1.03rem;
    line-height: 1.65;
}

.community-applications-page[b-10qiashkfn]  .hero-primary-button {
    width: 100%;
    min-height: 52px;
    border-radius: 15px;
    color: var(--app-green-900) !important;
    background: #fff !important;
    font-family: "Kanit", sans-serif;
    font-size: 1.08rem;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .13);
}

.community-applications-page[b-10qiashkfn]  .summary-grid {
    margin-top: 12px;
}

.community-applications-page[b-10qiashkfn]  .summary-card {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 122px;
    padding: 22px;
    border: 1px solid var(--app-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 30px rgba(18, 70, 53, .075);
    transition: transform .2s ease, box-shadow .2s ease;
}

.community-applications-page[b-10qiashkfn]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 17px 38px rgba(18, 70, 53, .11);
}

.community-applications-page[b-10qiashkfn]  .summary-icon {
    display: grid;
    place-items: center;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 19px;
}

.community-applications-page[b-10qiashkfn]  .summary-yellow .summary-icon { color: #a46805; background: #fff4d9; }
.community-applications-page[b-10qiashkfn]  .summary-green .summary-icon { color: #0b7e50; background: #e4f7ed; }
.community-applications-page[b-10qiashkfn]  .summary-blue .summary-icon { color: #256bb3; background: #edf5ff; }
.community-applications-page[b-10qiashkfn]  .summary-purple .summary-icon { color: #7554b6; background: #f3efff; }

.community-applications-page[b-10qiashkfn]  .summary-number {
    color: var(--app-ink);
    font-size: clamp(1.8rem, 2.9vw, 2.35rem);
    font-weight: 800;
    line-height: 1;
}

.community-applications-page[b-10qiashkfn]  .summary-label {
    margin-top: 8px;
    color: var(--app-muted);
    font-size: 1.03rem;
    font-weight: 500;
}

.community-applications-page[b-10qiashkfn]  .role-switch-panel,
.community-applications-page[b-10qiashkfn]  .editor-panel,
.community-applications-page[b-10qiashkfn]  .detail-panel,
.community-applications-page[b-10qiashkfn]  .filter-panel {
    margin-top: 25px;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid var(--app-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 15px 40px rgba(18, 70, 53, .08);
}

.community-applications-page[b-10qiashkfn]  .role-switch-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.community-applications-page[b-10qiashkfn]  .role-title,
.community-applications-page[b-10qiashkfn]  .filter-title {
    color: var(--app-ink);
    font-size: clamp(1.35rem, 2vw, 1.72rem);
    font-weight: 750;
}

.community-applications-page[b-10qiashkfn]  .role-subtitle,
.community-applications-page[b-10qiashkfn]  .filter-subtitle {
    margin-top: 5px;
    color: var(--app-muted);
    font-size: 1.03rem;
    line-height: 1.55;
}

.community-applications-page[b-10qiashkfn]  .mock-chip {
    color: var(--app-green-800) !important;
    border-color: #98c9b4 !important;
    font-family: "Kanit", sans-serif;
    font-weight: 600;
}

.community-applications-page[b-10qiashkfn]  .role-buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 23px;
}

.community-applications-page[b-10qiashkfn]  .role-button {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 90px;
    padding: 17px 20px;
    border: 1px solid #d8e6df;
    border-radius: 20px;
    color: var(--app-ink);
    background: #f9fcfa;
    font-family: "Kanit", sans-serif;
    text-align: left;
    cursor: pointer;
    transition: .2s ease;
}

.community-applications-page[b-10qiashkfn]  .role-button:hover {
    border-color: #9fcdb9;
    transform: translateY(-2px);
}

.community-applications-page[b-10qiashkfn]  .role-button.active {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--app-green-800), var(--app-green-600));
    box-shadow: 0 14px 30px rgba(20, 123, 85, .23);
}

.community-applications-page[b-10qiashkfn]  .role-button-icon {
    display: grid;
    place-items: center;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    border-radius: 17px;
    color: var(--app-green-800);
    background: #e6f6ee;
}

.community-applications-page[b-10qiashkfn]  .role-button.active .role-button-icon {
    color: var(--app-green-900);
    background: #fff;
}

.community-applications-page[b-10qiashkfn]  .role-button strong,
.community-applications-page[b-10qiashkfn]  .role-button small {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .role-button strong {
    font-size: 1.14rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .role-button small {
    margin-top: 3px;
    color: var(--app-muted);
    font-size: .98rem;
}

.community-applications-page[b-10qiashkfn]  .role-button.active small {
    color: rgba(255, 255, 255, .78);
}

.community-applications-page[b-10qiashkfn]  .editor-panel {
    border-top: 5px solid var(--app-green-700);
}

.community-applications-page[b-10qiashkfn]  .section-heading,
.community-applications-page[b-10qiashkfn]  .filter-heading {
    display: flex;
    align-items: center;
    gap: 16px;
}

.community-applications-page[b-10qiashkfn]  .section-heading-icon,
.community-applications-page[b-10qiashkfn]  .filter-heading-icon {
    display: grid;
    place-items: center;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, var(--app-green-700), var(--app-green-950));
    box-shadow: 0 10px 22px rgba(23, 123, 85, .24);
}

.community-applications-page[b-10qiashkfn]  .detail-icon {
    background: linear-gradient(145deg, #2f72ba, #164a83);
}

.community-applications-page[b-10qiashkfn]  .section-heading-text {
    flex: 1;
    min-width: 0;
}

.community-applications-page[b-10qiashkfn]  .section-title {
    color: var(--app-ink);
    font-size: clamp(1.36rem, 2vw, 1.72rem);
    font-weight: 750;
}

.community-applications-page[b-10qiashkfn]  .section-subtitle {
    margin-top: 4px;
    color: var(--app-muted);
    font-size: 1.03rem;
    line-height: 1.58;
}

.community-applications-page[b-10qiashkfn]  .section-divider {
    margin: 22px 0 27px;
}

.community-applications-page[b-10qiashkfn]  .large-input .mud-input-label,
.community-applications-page[b-10qiashkfn]  .large-input input,
.community-applications-page[b-10qiashkfn]  .large-input textarea,
.community-applications-page[b-10qiashkfn]  .large-input .mud-select-input,
.community-applications-page[b-10qiashkfn]  .large-input .mud-input-adornment,
.community-applications-page[b-10qiashkfn]  .large-input .mud-input-helper-text {
    font-family: "Kanit", sans-serif;
}

.community-applications-page[b-10qiashkfn]  .large-input .mud-input-label,
.community-applications-page[b-10qiashkfn]  .large-input input,
.community-applications-page[b-10qiashkfn]  .large-input textarea,
.community-applications-page[b-10qiashkfn]  .large-input .mud-select-input {
    font-size: 1.05rem;
}

.community-applications-page[b-10qiashkfn]  .large-input .mud-input-outlined-border {
    border-color: #cfded7;
    border-radius: 14px;
}

.community-applications-page[b-10qiashkfn]  .large-input:hover .mud-input-outlined-border {
    border-color: #8fb9a7;
}

.community-applications-page[b-10qiashkfn]  .large-input .mud-input-root {
    min-height: 53px;
}

.community-applications-page[b-10qiashkfn]  .large-input textarea {
    line-height: 1.75;
}

.community-applications-page[b-10qiashkfn]  .selected-job-preview {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px;
    border: 1px solid #cae2d7;
    border-radius: 20px;
    background: linear-gradient(135deg, #f0faf5, color-mix(in srgb, var(--theme-bg) 42%, white));
}

.community-applications-page[b-10qiashkfn]  .selected-job-image {
    display: grid;
    place-items: center;
    flex: 0 0 118px;
    width: 118px;
    height: 88px;
    overflow: hidden;
    border-radius: 16px;
    color: var(--app-green-700);
    background: #deefe7;
}

.community-applications-page[b-10qiashkfn]  .selected-job-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.community-applications-page[b-10qiashkfn]  .selected-job-info {
    min-width: 0;
}

.community-applications-page[b-10qiashkfn]  .selected-job-code {
    display: block;
    color: var(--app-green-700);
    font-size: .94rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .selected-job-info strong {
    display: block;
    margin-top: 4px;
    color: var(--app-ink);
    font-size: 1.18rem;
}

.community-applications-page[b-10qiashkfn]  .selected-job-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
    margin-top: 10px;
}

.community-applications-page[b-10qiashkfn]  .selected-job-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--app-muted);
    font-size: .98rem;
}

.community-applications-page[b-10qiashkfn]  .image-storage-box {
    padding: 20px;
    border: 1px dashed #9fc8b6;
    border-radius: 20px;
    background: #f8fcfa;
}

.community-applications-page[b-10qiashkfn]  .image-storage-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 17px;
    color: var(--app-green-800);
}

.community-applications-page[b-10qiashkfn]  .image-storage-heading strong,
.community-applications-page[b-10qiashkfn]  .image-storage-heading span {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .image-storage-heading strong {
    font-size: 1.08rem;
}

.community-applications-page[b-10qiashkfn]  .image-storage-heading span {
    margin-top: 2px;
    color: var(--app-muted);
    font-size: .96rem;
}

.community-applications-page[b-10qiashkfn]  .form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
}

.community-applications-page[b-10qiashkfn]  .primary-button,
.community-applications-page[b-10qiashkfn]  .secondary-button {
    min-height: 50px;
    padding-inline: 23px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .primary-button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--app-green-700), var(--app-green-900)) !important;
    box-shadow: 0 10px 22px rgba(20, 123, 85, .22);
}

.community-applications-page[b-10qiashkfn]  .secondary-button {
    color: #576a62 !important;
}

.community-applications-page[b-10qiashkfn]  .detail-section {
    height: 100%;
    padding: 22px;
    border: 1px solid #e0ebe6;
    border-radius: 21px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.community-applications-page[b-10qiashkfn]  .detail-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--app-green-800);
    font-size: 1.05rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .detail-section h3 {
    margin: 13px 0 17px;
    color: var(--app-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.35rem;
}

.community-applications-page[b-10qiashkfn]  .detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.community-applications-page[b-10qiashkfn]  .detail-grid div,
.community-applications-page[b-10qiashkfn]  .compact-detail div {
    padding: 12px 14px;
    border-radius: 14px;
    background: #f1f7f4;
}

.community-applications-page[b-10qiashkfn]  .detail-grid span,
.community-applications-page[b-10qiashkfn]  .detail-grid strong,
.community-applications-page[b-10qiashkfn]  .compact-detail span,
.community-applications-page[b-10qiashkfn]  .compact-detail strong {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .detail-grid span,
.community-applications-page[b-10qiashkfn]  .compact-detail span {
    color: var(--app-muted);
    font-size: .94rem;
}

.community-applications-page[b-10qiashkfn]  .detail-grid strong,
.community-applications-page[b-10qiashkfn]  .compact-detail strong {
    margin-top: 4px;
    color: var(--app-ink);
    font-size: 1.03rem;
}

.community-applications-page[b-10qiashkfn]  .detail-applicant-row {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 17px;
}

.community-applications-page[b-10qiashkfn]  .detail-avatar {
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    overflow: hidden;
    border-radius: 21px;
    color: var(--app-green-700);
    background: #e4f5ed;
}

.community-applications-page[b-10qiashkfn]  .detail-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.community-applications-page[b-10qiashkfn]  .detail-applicant-row strong,
.community-applications-page[b-10qiashkfn]  .detail-applicant-row span {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .detail-applicant-row strong {
    color: var(--app-ink);
    font-size: 1.17rem;
}

.community-applications-page[b-10qiashkfn]  .detail-applicant-row span {
    margin-top: 3px;
    color: var(--app-muted);
    font-size: .98rem;
}

.community-applications-page[b-10qiashkfn]  .rating-line {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    color: #aa710a;
}

.community-applications-page[b-10qiashkfn]  .rating-line span {
    color: var(--app-muted);
}

.community-applications-page[b-10qiashkfn]  .message-card {
    padding: 21px 23px;
    border-left: 5px solid var(--app-green-600);
    border-radius: 16px;
    background: #eef8f3;
}

.community-applications-page[b-10qiashkfn]  .message-label {
    color: var(--app-green-800);
    font-size: .96rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .message-card p {
    margin: 8px 0 0;
    color: #314b40;
    font-size: 1.06rem;
    line-height: 1.75;
}

.community-applications-page[b-10qiashkfn]  .compact-detail {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.community-applications-page[b-10qiashkfn]  .detail-price {
    color: var(--app-green-800) !important;
    font-size: 1.28rem !important;
}

.community-applications-page[b-10qiashkfn]  .filter-heading {
    margin-bottom: 22px;
}

.community-applications-page[b-10qiashkfn]  .filter-grid {
    align-items: center;
}

.community-applications-page[b-10qiashkfn]  .applications-list {
    display: grid;
    gap: 20px;
    margin-top: 25px;
}

.community-applications-page[b-10qiashkfn]  .application-card {
    display: grid;
    grid-template-columns: 275px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: 27px;
    background: #fff;
    box-shadow: 0 13px 38px rgba(18, 70, 53, .08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.community-applications-page[b-10qiashkfn]  .application-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 19px 46px rgba(18, 70, 53, .12);
}

.community-applications-page[b-10qiashkfn]  .job-media {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    background: linear-gradient(145deg, #e4f4ec, #d8ede3);
}

.community-applications-page[b-10qiashkfn]  .job-media img,
.community-applications-page[b-10qiashkfn]  .media-fallback {
    width: 100%;
    height: 100%;
    min-height: 420px;
}

.community-applications-page[b-10qiashkfn]  .job-media img {
    display: block;
    object-fit: cover;
}

.community-applications-page[b-10qiashkfn]  .media-fallback {
    display: grid;
    place-items: center;
    color: var(--app-green-700);
}

.community-applications-page[b-10qiashkfn]  .media-fallback .mud-icon-root {
    font-size: 5rem;
}

.community-applications-page[b-10qiashkfn]  .media-category {
    position: absolute;
    left: 16px;
    bottom: 16px;
    padding: 8px 13px;
    border-radius: 999px;
    color: #fff;
    background: rgba(8, 69, 50, .88);
    backdrop-filter: blur(8px);
    font-size: .94rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .application-main {
    min-width: 0;
    padding: clamp(21px, 2.5vw, 31px);
}

.community-applications-page[b-10qiashkfn]  .card-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.community-applications-page[b-10qiashkfn]  .application-code {
    display: block;
    margin-bottom: 5px;
    color: var(--app-green-700);
    font-size: .94rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .application-title {
    color: var(--app-ink);
    font-size: clamp(1.35rem, 2vw, 1.65rem);
    font-weight: 750;
    line-height: 1.35;
}

.community-applications-page[b-10qiashkfn]  .status-chip {
    flex: 0 0 auto;
    font-family: "Kanit", sans-serif;
    font-size: .98rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .job-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 14px;
}

.community-applications-page[b-10qiashkfn]  .job-meta-row span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--app-muted);
    font-size: 1rem;
}

.community-applications-page[b-10qiashkfn]  .applicant-box {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    padding: 15px 17px;
    border: 1px solid #dfebe5;
    border-radius: 19px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.community-applications-page[b-10qiashkfn]  .applicant-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    overflow: hidden;
    border-radius: 19px;
    color: var(--app-green-700);
    background: #e1f3ea;
}

.community-applications-page[b-10qiashkfn]  .applicant-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.community-applications-page[b-10qiashkfn]  .applicant-info {
    flex: 1;
    min-width: 0;
}

.community-applications-page[b-10qiashkfn]  .applicant-info span,
.community-applications-page[b-10qiashkfn]  .applicant-info strong,
.community-applications-page[b-10qiashkfn]  .applicant-info small {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .applicant-label {
    color: var(--app-green-700);
    font-size: .88rem;
    font-weight: 650;
}

.community-applications-page[b-10qiashkfn]  .applicant-info strong {
    margin-top: 2px;
    color: var(--app-ink);
    font-size: 1.1rem;
}

.community-applications-page[b-10qiashkfn]  .applicant-info small {
    margin-top: 2px;
    color: var(--app-muted);
    font-size: .94rem;
}

.community-applications-page[b-10qiashkfn]  .applicant-stats {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    color: var(--app-muted);
    font-size: .94rem;
}

.community-applications-page[b-10qiashkfn]  .applicant-stats .rating {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #a96f08;
    font-size: 1rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .offer-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.community-applications-page[b-10qiashkfn]  .offer-row > div {
    padding: 13px 15px;
    border-radius: 15px;
    background: #f2f7f5;
}

.community-applications-page[b-10qiashkfn]  .offer-row span,
.community-applications-page[b-10qiashkfn]  .offer-row strong {
    display: block;
}

.community-applications-page[b-10qiashkfn]  .offer-row span {
    color: var(--app-muted);
    font-size: .9rem;
}

.community-applications-page[b-10qiashkfn]  .offer-row strong {
    margin-top: 4px;
    color: var(--app-ink);
    font-size: 1.02rem;
}

.community-applications-page[b-10qiashkfn]  .offer-row > div:first-child strong {
    color: var(--app-green-800);
    font-size: 1.32rem;
}

.community-applications-page[b-10qiashkfn]  .offer-row strong small {
    font-size: .84rem;
    font-weight: 500;
}

.community-applications-page[b-10qiashkfn]  .application-message {
    display: -webkit-box;
    overflow: hidden;
    margin: 17px 0 0;
    color: #4e645b;
    font-size: 1.02rem;
    line-height: 1.7;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.community-applications-page[b-10qiashkfn]  .card-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #edf2ef;
}

.community-applications-page[b-10qiashkfn]  .outline-action,
.community-applications-page[b-10qiashkfn]  .primary-action,
.community-applications-page[b-10qiashkfn]  .reject-action,
.community-applications-page[b-10qiashkfn]  .danger-text-button,
.community-applications-page[b-10qiashkfn]  .reset-button {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 600;
}

.community-applications-page[b-10qiashkfn]  .outline-action {
    color: var(--app-green-800) !important;
    border-color: #9cc8b5 !important;
}

.community-applications-page[b-10qiashkfn]  .primary-action {
    color: #fff !important;
    background: linear-gradient(135deg, var(--app-green-700), var(--app-green-900)) !important;
}

.community-applications-page[b-10qiashkfn]  .reject-action {
    color: #b13d45 !important;
    border-color: #e1a9ae !important;
}

.community-applications-page[b-10qiashkfn]  .danger-text-button {
    color: #b13d45 !important;
}

.community-applications-page[b-10qiashkfn]  .loading-state,
.community-applications-page[b-10qiashkfn]  .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-height: 330px;
    margin-top: 25px;
    padding: 35px;
    text-align: center;
}

.community-applications-page[b-10qiashkfn]  .empty-state {
    border: 1px solid var(--app-border);
    border-radius: 27px;
    background: #fff;
}

.community-applications-page[b-10qiashkfn]  .empty-icon {
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    margin-bottom: 5px;
    border-radius: 25px;
    color: var(--app-green-700);
    background: var(--app-green-100);
}

.community-applications-page[b-10qiashkfn]  .empty-icon .mud-icon-root {
    font-size: 2.8rem;
}

.community-applications-page[b-10qiashkfn]  .empty-state .mud-typography-h5 {
    color: var(--app-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.38rem;
    font-weight: 700;
}

.community-applications-page[b-10qiashkfn]  .empty-state .mud-typography-body1 {
    color: var(--app-muted);
    font-size: 1.03rem;
}

@media (max-width: 1180px) {
    .community-applications-page[b-10qiashkfn]  .application-card {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .community-applications-page[b-10qiashkfn]  .job-media img,
    .community-applications-page[b-10qiashkfn]  .media-fallback {
        min-height: 450px;
    }
}

@media (max-width: 900px) {
    .community-applications-page[b-10qiashkfn] {
        padding-inline: 14px;
    }

    .community-applications-page[b-10qiashkfn]  .applications-hero {
        border-radius: 25px;
    }

    .community-applications-page[b-10qiashkfn]  .role-buttons {
        grid-template-columns: 1fr;
    }

    .community-applications-page[b-10qiashkfn]  .application-card {
        grid-template-columns: 1fr;
    }

    .community-applications-page[b-10qiashkfn]  .job-media {
        height: 230px;
        min-height: 230px;
    }

    .community-applications-page[b-10qiashkfn]  .job-media img,
    .community-applications-page[b-10qiashkfn]  .media-fallback {
        min-height: 230px;
    }

    .community-applications-page[b-10qiashkfn]  .offer-row {
        grid-template-columns: 1fr 1fr;
    }

    .community-applications-page[b-10qiashkfn]  .offer-row > div:first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .community-applications-page[b-10qiashkfn] {
        padding: 14px 10px 45px;
    }

    .community-applications-page[b-10qiashkfn]  .applications-hero {
        padding: 26px 20px;
        border-radius: 22px;
    }

    .community-applications-page[b-10qiashkfn]  .hero-title {
        font-size: 2.05rem;
    }

    .community-applications-page[b-10qiashkfn]  .hero-features {
        display: grid;
    }

    .community-applications-page[b-10qiashkfn]  .summary-card {
        min-height: 106px;
        padding: 16px;
        gap: 12px;
        border-radius: 19px;
    }

    .community-applications-page[b-10qiashkfn]  .summary-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
        border-radius: 15px;
    }

    .community-applications-page[b-10qiashkfn]  .summary-number {
        font-size: 1.7rem;
    }

    .community-applications-page[b-10qiashkfn]  .summary-label {
        font-size: .94rem;
    }

    .community-applications-page[b-10qiashkfn]  .role-switch-panel,
    .community-applications-page[b-10qiashkfn]  .editor-panel,
    .community-applications-page[b-10qiashkfn]  .detail-panel,
    .community-applications-page[b-10qiashkfn]  .filter-panel {
        padding: 20px 16px;
        border-radius: 22px;
    }

    .community-applications-page[b-10qiashkfn]  .role-switch-heading,
    .community-applications-page[b-10qiashkfn]  .card-heading-row {
        flex-direction: column;
    }

    .community-applications-page[b-10qiashkfn]  .selected-job-preview,
    .community-applications-page[b-10qiashkfn]  .applicant-box {
        align-items: flex-start;
    }

    .community-applications-page[b-10qiashkfn]  .selected-job-image {
        flex-basis: 86px;
        width: 86px;
        height: 78px;
    }

    .community-applications-page[b-10qiashkfn]  .applicant-stats {
        display: none;
    }

    .community-applications-page[b-10qiashkfn]  .offer-row,
    .community-applications-page[b-10qiashkfn]  .detail-grid,
    .community-applications-page[b-10qiashkfn]  .compact-detail {
        grid-template-columns: 1fr;
    }

    .community-applications-page[b-10qiashkfn]  .offer-row > div:first-child {
        grid-column: auto;
    }

    .community-applications-page[b-10qiashkfn]  .card-actions,
    .community-applications-page[b-10qiashkfn]  .form-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .community-applications-page[b-10qiashkfn]  .card-actions .mud-button-root,
    .community-applications-page[b-10qiashkfn]  .form-actions .mud-button-root {
        width: 100%;
    }
}
/* /Components/Pages/03Marketplace/02Community-jobs/CommunityJobProviders.razor.rz.scp.css */
.community-providers-page[b-gazrf4uczo] {
    --provider-green-950: #073c2d;
    --provider-green-900: #0b4d39;
    --provider-green-800: #126347;
    --provider-green-700: #177b55;
    --provider-green-600: #24966c;
    --provider-green-100: color-mix(in srgb, var(--theme-light) 13%, white);
    --provider-ink: #17342a;
    --provider-muted: #687a73;
    --provider-border: #dce8e2;
    --provider-surface: #ffffff;
    --provider-bg: var(--theme-bg);
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px 20px 64px;
    color: var(--provider-ink);
    font-family: "Kanit", sans-serif;
}

.community-providers-page[b-gazrf4uczo]  * {
    box-sizing: border-box;
}

.community-providers-page[b-gazrf4uczo]  .providers-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(28px, 4.5vw, 58px);
    border-radius: 32px;
    color: #fff;
    background:
        linear-gradient(125deg, rgba(6, 55, 41, .99), rgba(18, 108, 74, .97)),
        radial-gradient(circle at 92% 10%, rgba(255, 255, 255, .18), transparent 34%);
    box-shadow: 0 24px 58px rgba(10, 69, 50, .24);
}

.community-providers-page[b-gazrf4uczo]  .hero-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .11);
}

.community-providers-page[b-gazrf4uczo]  .hero-orb-one {
    width: 430px;
    height: 430px;
    top: -240px;
    right: -130px;
    background: rgba(255, 255, 255, .06);
}

.community-providers-page[b-gazrf4uczo]  .hero-orb-two {
    width: 260px;
    height: 260px;
    right: 28%;
    bottom: -190px;
    background: rgba(255, 216, 118, .10);
}

.community-providers-page[b-gazrf4uczo]  .hero-kicker {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .11);
    backdrop-filter: blur(12px);
    font-size: 1.05rem;
    font-weight: 600;
}

.community-providers-page[b-gazrf4uczo]  .hero-title {
    position: relative;
    z-index: 2;
    max-width: 860px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.15rem, 4.3vw, 3.7rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.025em;
}

.community-providers-page[b-gazrf4uczo]  .hero-subtitle {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin-top: 14px;
    color: rgba(255, 255, 255, .84);
    font-size: clamp(1.08rem, 1.7vw, 1.35rem);
    font-weight: 400;
    line-height: 1.75;
}

.community-providers-page[b-gazrf4uczo]  .hero-feature-row {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    margin-top: 26px;
}

.community-providers-page[b-gazrf4uczo]  .hero-feature-row span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .92);
    font-size: 1.03rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .hero-register-card {
    position: relative;
    z-index: 2;
    padding: 25px;
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: 25px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(15px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10);
}

.community-providers-page[b-gazrf4uczo]  .register-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 18px;
}

.community-providers-page[b-gazrf4uczo]  .register-icon {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    border-radius: 19px;
    color: var(--provider-green-900);
    background: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .17);
}

.community-providers-page[b-gazrf4uczo]  .register-chip {
    color: #fff !important;
    background: rgba(255, 255, 255, .16) !important;
    border: 1px solid rgba(255, 255, 255, .20);
    font-family: "Kanit", sans-serif;
    font-weight: 600;
}

.community-providers-page[b-gazrf4uczo]  .register-title {
    color: #fff;
    font-size: 1.42rem;
    font-weight: 700;
}

.community-providers-page[b-gazrf4uczo]  .register-description {
    margin: 8px 0 20px;
    color: rgba(255, 255, 255, .80);
    font-size: 1.03rem;
    line-height: 1.65;
}

.community-providers-page[b-gazrf4uczo]  .register-button {
    width: 100%;
    min-height: 50px;
    border-radius: 15px;
    color: var(--provider-green-900) !important;
    background: #fff !important;
    font-family: "Kanit", sans-serif;
    font-size: 1.08rem;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .13);
}

.community-providers-page[b-gazrf4uczo]  .summary-grid {
    margin-top: 12px;
}

.community-providers-page[b-gazrf4uczo]  .summary-card {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 122px;
    padding: 22px;
    border: 1px solid var(--provider-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 30px rgba(18, 70, 53, .075);
    transition: transform .2s ease, box-shadow .2s ease;
}

.community-providers-page[b-gazrf4uczo]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 17px 38px rgba(18, 70, 53, .11);
}

.community-providers-page[b-gazrf4uczo]  .summary-icon {
    display: grid;
    place-items: center;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 19px;
}

.community-providers-page[b-gazrf4uczo]  .summary-green .summary-icon { color: #0c7d50; background: #e4f7ed; }
.community-providers-page[b-gazrf4uczo]  .summary-blue .summary-icon { color: #256bb3; background: #edf5ff; }
.community-providers-page[b-gazrf4uczo]  .summary-orange .summary-icon { color: #b66b08; background: #fff5df; }
.community-providers-page[b-gazrf4uczo]  .summary-purple .summary-icon { color: #7554b6; background: #f3efff; }

.community-providers-page[b-gazrf4uczo]  .summary-number {
    color: var(--provider-ink);
    font-size: clamp(1.8rem, 2.9vw, 2.35rem);
    font-weight: 800;
    line-height: 1;
}

.community-providers-page[b-gazrf4uczo]  .summary-label {
    margin-top: 8px;
    color: var(--provider-muted);
    font-size: 1.03rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .editor-panel,
.community-providers-page[b-gazrf4uczo]  .detail-panel,
.community-providers-page[b-gazrf4uczo]  .filter-panel {
    margin-top: 25px;
    padding: clamp(21px, 3vw, 34px);
    border: 1px solid var(--provider-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 15px 40px rgba(18, 70, 53, .08);
}

.community-providers-page[b-gazrf4uczo]  .editor-panel {
    border-top: 5px solid var(--provider-green-700);
}

.community-providers-page[b-gazrf4uczo]  .section-heading,
.community-providers-page[b-gazrf4uczo]  .filter-heading {
    display: flex;
    align-items: center;
    gap: 16px;
}

.community-providers-page[b-gazrf4uczo]  .section-heading-icon {
    display: grid;
    place-items: center;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, var(--provider-green-700), var(--provider-green-950));
    box-shadow: 0 10px 22px rgba(23, 123, 85, .24);
}

.community-providers-page[b-gazrf4uczo]  .section-heading-text {
    flex: 1;
    min-width: 0;
}

.community-providers-page[b-gazrf4uczo]  .section-title {
    color: var(--provider-ink);
    font-size: clamp(1.36rem, 2vw, 1.72rem);
    font-weight: 750;
}

.community-providers-page[b-gazrf4uczo]  .section-subtitle {
    margin-top: 4px;
    color: var(--provider-muted);
    font-size: 1.03rem;
    line-height: 1.58;
}

.community-providers-page[b-gazrf4uczo]  .close-button {
    flex: 0 0 auto;
}

.community-providers-page[b-gazrf4uczo]  .section-divider {
    margin: 22px 0 27px;
}

.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-label,
.community-providers-page[b-gazrf4uczo]  .large-input input,
.community-providers-page[b-gazrf4uczo]  .large-input textarea,
.community-providers-page[b-gazrf4uczo]  .large-input .mud-select-input,
.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-adornment,
.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-helper-text {
    font-family: "Kanit", sans-serif;
}

.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-label,
.community-providers-page[b-gazrf4uczo]  .large-input input,
.community-providers-page[b-gazrf4uczo]  .large-input textarea,
.community-providers-page[b-gazrf4uczo]  .large-input .mud-select-input {
    font-size: 1.05rem;
}

.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-outlined-border {
    border-color: #cfded7;
    border-radius: 14px;
}

.community-providers-page[b-gazrf4uczo]  .large-input:hover .mud-input-outlined-border {
    border-color: #8fb9a7;
}

.community-providers-page[b-gazrf4uczo]  .large-input .mud-input-root {
    min-height: 52px;
}

.community-providers-page[b-gazrf4uczo]  .large-input textarea {
    line-height: 1.7;
}

.community-providers-page[b-gazrf4uczo]  .switch-card {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 86px;
    padding: 16px 18px;
    border: 1px solid var(--provider-border);
    border-radius: 18px;
    background: #f9fcfa;
}

.community-providers-page[b-gazrf4uczo]  .switch-icon {
    display: grid;
    place-items: center;
    flex: 0 0 47px;
    width: 47px;
    height: 47px;
    border-radius: 15px;
}

.community-providers-page[b-gazrf4uczo]  .switch-icon-green { color: #087b4f; background: #e5f7ee; }
.community-providers-page[b-gazrf4uczo]  .switch-icon-blue { color: #2a6eb2; background: #eaf4ff; }

.community-providers-page[b-gazrf4uczo]  .switch-text {
    flex: 1;
}

.community-providers-page[b-gazrf4uczo]  .switch-text .mud-typography-subtitle1 {
    color: var(--provider-ink);
    font-size: 1.07rem;
    font-weight: 650;
}

.community-providers-page[b-gazrf4uczo]  .switch-text .mud-typography-body2 {
    margin-top: 2px;
    color: var(--provider-muted);
    font-size: .95rem;
}

.community-providers-page[b-gazrf4uczo]  .image-upload-panel {
    padding: 22px;
    border: 1px dashed #b6d3c5;
    border-radius: 22px;
    background: linear-gradient(145deg, #fbfefc, #f3faf6);
}

.community-providers-page[b-gazrf4uczo]  .upload-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}

.community-providers-page[b-gazrf4uczo]  .upload-heading-icon {
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    border-radius: 16px;
    color: #0a7d51;
    background: #e4f6ed;
}

.community-providers-page[b-gazrf4uczo]  .upload-title {
    color: var(--provider-ink);
    font-size: 1.22rem;
    font-weight: 700;
}

.community-providers-page[b-gazrf4uczo]  .upload-subtitle {
    margin-top: 3px;
    color: var(--provider-muted);
    font-size: 1rem;
    line-height: 1.55;
}

.community-providers-page[b-gazrf4uczo]  .file-picker {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 148px;
    padding: 20px;
    border: 2px dashed #a7cbbb;
    border-radius: 19px;
    color: var(--provider-green-800);
    background: #fff;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.community-providers-page[b-gazrf4uczo]  .file-picker:hover {
    border-color: var(--provider-green-600);
    background: #f4fbf7;
    transform: translateY(-2px);
}

.community-providers-page[b-gazrf4uczo]  .file-picker .mud-icon-root {
    font-size: 2.2rem;
}

.community-providers-page[b-gazrf4uczo]  .file-picker span {
    margin-top: 8px;
    font-size: 1.1rem;
    font-weight: 700;
}

.community-providers-page[b-gazrf4uczo]  .file-picker small {
    margin-top: 4px;
    color: var(--provider-muted);
    font-size: .92rem;
}

.community-providers-page[b-gazrf4uczo]  .file-picker input[type="file"] {
    display: none;
}

.community-providers-page[b-gazrf4uczo]  .selected-file-row {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 45px;
    margin-top: 11px;
    padding: 7px 9px 7px 13px;
    border-radius: 12px;
    background: #eaf7f0;
    color: #205b43;
    font-size: 1rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .selected-file-row span {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.community-providers-page[b-gazrf4uczo]  .image-preview-row {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 18px;
    padding: 14px;
    border: 1px solid var(--provider-border);
    border-radius: 17px;
    background: #fff;
}

.community-providers-page[b-gazrf4uczo]  .image-preview-row img {
    width: 86px;
    height: 86px;
    object-fit: cover;
    border-radius: 18px;
    box-shadow: 0 7px 18px rgba(19, 66, 51, .12);
}

.community-providers-page[b-gazrf4uczo]  .image-preview-row .mud-typography-subtitle1 {
    color: var(--provider-ink);
    font-size: 1.08rem;
    font-weight: 700;
}

.community-providers-page[b-gazrf4uczo]  .image-preview-row .mud-typography-body2 {
    margin-top: 3px;
    color: var(--provider-muted);
    font-size: .96rem;
    word-break: break-word;
}

.community-providers-page[b-gazrf4uczo]  .editor-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid var(--provider-border);
}

.community-providers-page[b-gazrf4uczo]  .editor-actions .mud-button-root,
.community-providers-page[b-gazrf4uczo]  .save-button {
    min-height: 48px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
    font-weight: 650;
}

.community-providers-page[b-gazrf4uczo]  .detail-panel {
    border-left: 5px solid var(--provider-green-700);
}

.community-providers-page[b-gazrf4uczo]  .detail-close-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.community-providers-page[b-gazrf4uczo]  .detail-close-row .mud-typography-overline {
    color: var(--provider-green-700);
    font-size: .95rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.community-providers-page[b-gazrf4uczo]  .detail-image-wrap {
    overflow: hidden;
    width: 100%;
    max-width: 330px;
    aspect-ratio: 1 / 1;
    margin: 0 auto;
    border: 8px solid color-mix(in srgb, var(--theme-bg) 82%, white);
    border-radius: 28px;
    background: #eef7f2;
    box-shadow: 0 14px 32px rgba(17, 70, 52, .12);
}

.community-providers-page[b-gazrf4uczo]  .detail-image-wrap img,
.community-providers-page[b-gazrf4uczo]  .detail-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.community-providers-page[b-gazrf4uczo]  .detail-placeholder {
    display: grid;
    place-items: center;
    color: var(--provider-green-700);
    background: linear-gradient(145deg, #eaf7f0, #dcefe5);
}

.community-providers-page[b-gazrf4uczo]  .detail-placeholder .mud-icon-root {
    font-size: 5rem;
}

.community-providers-page[b-gazrf4uczo]  .detail-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.community-providers-page[b-gazrf4uczo]  .provider-code {
    color: var(--provider-green-700);
    font-size: .94rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.community-providers-page[b-gazrf4uczo]  .detail-name {
    margin-top: 4px;
    color: var(--provider-ink);
    font-size: clamp(1.75rem, 3vw, 2.4rem);
    font-weight: 800;
    line-height: 1.22;
}

.community-providers-page[b-gazrf4uczo]  .detail-business {
    margin-top: 5px;
    color: var(--provider-muted);
    font-size: 1.16rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .detail-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.community-providers-page[b-gazrf4uczo]  .detail-badges .mud-chip {
    font-family: "Kanit", sans-serif;
    font-size: .97rem;
    font-weight: 600;
}

.community-providers-page[b-gazrf4uczo]  .detail-rating {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 17px;
    color: var(--provider-muted);
    font-size: 1.03rem;
}

.community-providers-page[b-gazrf4uczo]  .detail-rating .mud-icon-root {
    color: #f4aa22;
}

.community-providers-page[b-gazrf4uczo]  .detail-rating strong {
    color: var(--provider-ink);
    font-size: 1.16rem;
}

.community-providers-page[b-gazrf4uczo]  .detail-rating .dot {
    color: #a9b7b1;
}

.community-providers-page[b-gazrf4uczo]  .detail-about {
    margin-top: 18px;
    color: #4f625a;
    font-size: 1.08rem;
    line-height: 1.78;
}

.community-providers-page[b-gazrf4uczo]  .detail-info-grid {
    margin-top: 15px;
}

.community-providers-page[b-gazrf4uczo]  .detail-info-item {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    height: 100%;
    padding: 14px;
    border: 1px solid var(--provider-border);
    border-radius: 15px;
    background: #fafcfb;
}

.community-providers-page[b-gazrf4uczo]  .detail-info-item > .mud-icon-root {
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--provider-green-700);
}

.community-providers-page[b-gazrf4uczo]  .detail-info-item span,
.community-providers-page[b-gazrf4uczo]  .provider-meta-item span {
    display: block;
    color: var(--provider-muted);
    font-size: .9rem;
}

.community-providers-page[b-gazrf4uczo]  .detail-info-item strong,
.community-providers-page[b-gazrf4uczo]  .provider-meta-item strong {
    display: block;
    margin-top: 3px;
    color: var(--provider-ink);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5;
}

.community-providers-page[b-gazrf4uczo]  .detail-skills,
.community-providers-page[b-gazrf4uczo]  .skill-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.community-providers-page[b-gazrf4uczo]  .detail-skills {
    margin-top: 18px;
}

.community-providers-page[b-gazrf4uczo]  .detail-skills span,
.community-providers-page[b-gazrf4uczo]  .skill-list span {
    display: inline-flex;
    align-items: center;
    min-height: 31px;
    padding: 5px 11px;
    border: 1px solid #cfe4da;
    border-radius: 999px;
    color: #24684c;
    background: #f0f8f4;
    font-size: .92rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 22px;
}

.community-providers-page[b-gazrf4uczo]  .detail-actions .mud-button-root {
    min-height: 46px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 650;
}

.community-providers-page[b-gazrf4uczo]  .filter-heading {
    justify-content: space-between;
    margin-bottom: 22px;
}

.community-providers-page[b-gazrf4uczo]  .filter-heading .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 600;
}

.community-providers-page[b-gazrf4uczo]  .filter-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 17px;
    padding-top: 17px;
    border-top: 1px solid var(--provider-border);
}

.community-providers-page[b-gazrf4uczo]  .verified-checkbox .mud-typography {
    color: var(--provider-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .result-count {
    color: var(--provider-muted);
    font-size: 1.03rem;
}

.community-providers-page[b-gazrf4uczo]  .result-count strong {
    color: var(--provider-green-700);
    font-size: 1.2rem;
}

.community-providers-page[b-gazrf4uczo]  .providers-grid {
    margin-top: 12px;
}

.community-providers-page[b-gazrf4uczo]  .provider-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    border: 1px solid var(--provider-border);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 13px 34px rgba(17, 70, 52, .08);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.community-providers-page[b-gazrf4uczo]  .provider-card:hover {
    transform: translateY(-5px);
    border-color: #bad6c8;
    box-shadow: 0 22px 48px rgba(17, 70, 52, .14);
}

.community-providers-page[b-gazrf4uczo]  .provider-cover {
    position: relative;
    height: 118px;
    background:
        linear-gradient(135deg, rgba(8, 70, 51, .98), rgba(31, 137, 92, .94)),
        radial-gradient(circle at 85% 10%, rgba(255, 255, 255, .20), transparent 30%);
}

.community-providers-page[b-gazrf4uczo]  .cover-pattern {
    position: absolute;
    inset: 0;
    opacity: .14;
    background-image:
        linear-gradient(30deg, rgba(255,255,255,.25) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.25) 87.5%, rgba(255,255,255,.25)),
        linear-gradient(150deg, rgba(255,255,255,.25) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.25) 87.5%, rgba(255,255,255,.25));
    background-size: 38px 66px;
}

.community-providers-page[b-gazrf4uczo]  .provider-status-row {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 17px;
    right: 17px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
}

.community-providers-page[b-gazrf4uczo]  .provider-status-row .mud-chip {
    min-height: 30px;
    font-family: "Kanit", sans-serif;
    font-size: .9rem;
    font-weight: 650;
    box-shadow: 0 5px 13px rgba(0,0,0,.13);
}

.community-providers-page[b-gazrf4uczo]  .provider-photo-wrap {
    position: relative;
    width: 116px;
    height: 116px;
    margin: -58px auto 0;
    padding: 6px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 26px rgba(17, 65, 50, .18);
}

.community-providers-page[b-gazrf4uczo]  .provider-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.community-providers-page[b-gazrf4uczo]  .provider-photo-placeholder {
    display: grid;
    place-items: center;
    color: var(--provider-green-700);
    background: linear-gradient(145deg, #eaf7f0, #d8eee3);
}

.community-providers-page[b-gazrf4uczo]  .provider-photo-placeholder .mud-icon-root {
    font-size: 3.25rem;
}

.community-providers-page[b-gazrf4uczo]  .verified-badge {
    position: absolute;
    right: 4px;
    bottom: 7px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 4px solid #fff;
    border-radius: 50%;
    color: #fff;
    background: #2d77be;
}

.community-providers-page[b-gazrf4uczo]  .verified-badge .mud-icon-root {
    font-size: 1.16rem;
}

.community-providers-page[b-gazrf4uczo]  .provider-card-content {
    display: flex;
    flex-direction: column;
    min-height: 510px;
    padding: 15px 23px 21px;
}

.community-providers-page[b-gazrf4uczo]  .provider-code-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #819088;
    font-size: .87rem;
    font-weight: 500;
}

.community-providers-page[b-gazrf4uczo]  .provider-name {
    margin-top: 11px;
    color: var(--provider-ink);
    font-size: 1.35rem;
    font-weight: 750;
    line-height: 1.35;
    text-align: center;
}

.community-providers-page[b-gazrf4uczo]  .provider-business {
    min-height: 27px;
    margin-top: 3px;
    color: var(--provider-green-700);
    font-size: 1rem;
    font-weight: 550;
    text-align: center;
}

.community-providers-page[b-gazrf4uczo]  .rating-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 15px;
    padding: 12px 13px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.community-providers-page[b-gazrf4uczo]  .rating-score,
.community-providers-page[b-gazrf4uczo]  .completed-jobs {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--provider-muted);
    font-size: .92rem;
}

.community-providers-page[b-gazrf4uczo]  .rating-score .mud-icon-root {
    color: #f3aa22;
    font-size: 1.24rem;
}

.community-providers-page[b-gazrf4uczo]  .rating-score strong,
.community-providers-page[b-gazrf4uczo]  .completed-jobs strong {
    color: var(--provider-ink);
    font-size: 1rem;
}

.community-providers-page[b-gazrf4uczo]  .provider-about {
    display: -webkit-box;
    overflow: hidden;
    min-height: 77px;
    margin-top: 15px;
    color: #596b63;
    font-size: 1rem;
    line-height: 1.62;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.community-providers-page[b-gazrf4uczo]  .provider-meta-list {
    display: grid;
    gap: 10px;
    margin-top: 15px;
}

.community-providers-page[b-gazrf4uczo]  .provider-meta-item {
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.community-providers-page[b-gazrf4uczo]  .meta-icon {
    display: grid;
    place-items: center;
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    border-radius: 12px;
    color: var(--provider-green-700);
    background: var(--provider-green-100);
}

.community-providers-page[b-gazrf4uczo]  .meta-icon .mud-icon-root {
    font-size: 1.22rem;
}

.community-providers-page[b-gazrf4uczo]  .skill-list {
    min-height: 35px;
    margin-top: 15px;
}

.community-providers-page[b-gazrf4uczo]  .skill-list .more-skill {
    color: #596b63;
    background: #f2f5f3;
    border-color: #dfe7e3;
}

.community-providers-page[b-gazrf4uczo]  .price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: auto;
    padding: 18px 0 16px;
}

.community-providers-page[b-gazrf4uczo]  .price-row > div > span {
    display: block;
    color: var(--provider-muted);
    font-size: .9rem;
}

.community-providers-page[b-gazrf4uczo]  .price-row > div > strong {
    display: block;
    margin-top: 2px;
    color: var(--provider-green-700);
    font-size: 1.17rem;
    font-weight: 750;
}

.community-providers-page[b-gazrf4uczo]  .contact-button {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 650;
}

.community-providers-page[b-gazrf4uczo]  .provider-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 10px;
}

.community-providers-page[b-gazrf4uczo]  .provider-actions .mud-button-root {
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 650;
}

.community-providers-page[b-gazrf4uczo]  .state-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 270px;
    margin-top: 25px;
    padding: 30px;
    border: 1px solid var(--provider-border);
    border-radius: 25px;
    color: var(--provider-muted);
    background: #fff;
    text-align: center;
}

.community-providers-page[b-gazrf4uczo]  .state-panel .mud-typography-h6,
.community-providers-page[b-gazrf4uczo]  .state-panel .mud-typography-h5 {
    color: var(--provider-ink);
    font-weight: 700;
}

.community-providers-page[b-gazrf4uczo]  .empty-icon {
    display: grid;
    place-items: center;
    width: 74px;
    height: 74px;
    border-radius: 22px;
    color: var(--provider-green-700);
    background: var(--provider-green-100);
}

.community-providers-page[b-gazrf4uczo]  .empty-icon .mud-icon-root {
    font-size: 2.7rem;
}

.community-providers-page[b-gazrf4uczo]  .load-alert {
    margin-top: 25px;
    border-radius: 18px;
    font-family: "Kanit", sans-serif;
}

@media (max-width: 959.98px) {
    .community-providers-page[b-gazrf4uczo] {
        padding: 16px 12px 48px;
    }

    .community-providers-page[b-gazrf4uczo]  .providers-hero {
        border-radius: 25px;
    }

    .community-providers-page[b-gazrf4uczo]  .hero-register-card {
        max-width: 560px;
    }

    .community-providers-page[b-gazrf4uczo]  .detail-title-row {
        flex-direction: column;
    }

    .community-providers-page[b-gazrf4uczo]  .detail-badges {
        justify-content: flex-start;
    }

    .community-providers-page[b-gazrf4uczo]  .filter-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-card-content {
        min-height: 500px;
    }
}

@media (max-width: 599.98px) {
    .community-providers-page[b-gazrf4uczo]  .providers-hero {
        padding: 25px 20px;
        border-radius: 22px;
    }

    .community-providers-page[b-gazrf4uczo]  .hero-title {
        font-size: 2rem;
    }

    .community-providers-page[b-gazrf4uczo]  .hero-feature-row {
        flex-direction: column;
        gap: 10px;
    }

    .community-providers-page[b-gazrf4uczo]  .summary-card {
        min-height: 110px;
        padding: 16px;
        gap: 12px;
    }

    .community-providers-page[b-gazrf4uczo]  .summary-icon {
        flex-basis: 49px;
        width: 49px;
        height: 49px;
        border-radius: 15px;
    }

    .community-providers-page[b-gazrf4uczo]  .summary-number {
        font-size: 1.7rem;
    }

    .community-providers-page[b-gazrf4uczo]  .summary-label {
        font-size: .94rem;
    }

    .community-providers-page[b-gazrf4uczo]  .editor-panel,
    .community-providers-page[b-gazrf4uczo]  .detail-panel,
    .community-providers-page[b-gazrf4uczo]  .filter-panel {
        padding: 19px 15px;
        border-radius: 21px;
    }

    .community-providers-page[b-gazrf4uczo]  .section-heading {
        align-items: flex-start;
    }

    .community-providers-page[b-gazrf4uczo]  .section-heading-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
        border-radius: 15px;
    }

    .community-providers-page[b-gazrf4uczo]  .editor-actions,
    .community-providers-page[b-gazrf4uczo]  .detail-actions,
    .community-providers-page[b-gazrf4uczo]  .filter-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .community-providers-page[b-gazrf4uczo]  .editor-actions .mud-button-root,
    .community-providers-page[b-gazrf4uczo]  .detail-actions .mud-button-root {
        width: 100%;
    }

    .community-providers-page[b-gazrf4uczo]  .image-preview-row {
        align-items: flex-start;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-status-row {
        justify-content: flex-start;
    }

    .community-providers-page[b-gazrf4uczo]  .rating-row,
    .community-providers-page[b-gazrf4uczo]  .price-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .community-providers-page[b-gazrf4uczo]  .contact-button {
        width: 100%;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-card-content {
        min-height: auto;
        padding: 15px 18px 19px;
    }
}

@media (min-width: 1900px) {
    .community-providers-page[b-gazrf4uczo] {
        max-width: 1840px;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-card-content {
        min-height: 535px;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-name {
        font-size: 1.45rem;
    }

    .community-providers-page[b-gazrf4uczo]  .provider-about,
    .community-providers-page[b-gazrf4uczo]  .detail-about {
        font-size: 1.08rem;
    }
}
/* /Components/Pages/03Marketplace/02Community-jobs/CommunityJobReviews.razor.rz.scp.css */
.community-reviews-page[b-y280umcnse] {
    --rv-green-950: #053b2c;
    --rv-green-900: #07503a;
    --rv-green-800: #0d6849;
    --rv-green-700: #15825a;
    --rv-green-600: #249b6b;
    --rv-green-100: #e5f7ee;
    --rv-gold: #f4b942;
    --rv-gold-soft: #fff5d9;
    --rv-ink: #17382d;
    --rv-muted: var(--theme-muted);
    --rv-border: #dbe9e2;
    --rv-bg: var(--theme-bg);
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px 20px 64px;
    color: var(--rv-ink);
    font-family: "Kanit", sans-serif;
}

.community-reviews-page[b-y280umcnse]  * { box-sizing: border-box; }

.community-reviews-page[b-y280umcnse]  .reviews-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4.8vw, 62px);
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 14%, rgba(255, 211, 91, .18), transparent 30%),
        linear-gradient(128deg, #043a2b 0%, #0a6548 58%, #14805a 100%);
    box-shadow: 0 25px 62px rgba(7, 74, 53, .25);
}

.community-reviews-page[b-y280umcnse]  .hero-orb {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.12);
    pointer-events: none;
}
.community-reviews-page[b-y280umcnse]  .hero-orb-one { width: 480px; height: 480px; right: -170px; top: -270px; background: rgba(255,255,255,.045); }
.community-reviews-page[b-y280umcnse]  .hero-orb-two { width: 290px; height: 290px; right: 30%; bottom: -220px; background: rgba(255,198,72,.09); }

.community-reviews-page[b-y280umcnse]  .hero-kicker {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 999px;
    background: rgba(255,255,255,.11);
    backdrop-filter: blur(12px);
    font-size: 1.05rem;
    font-weight: 650;
}
.community-reviews-page[b-y280umcnse]  .hero-title {
    position: relative;
    z-index: 2;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.2rem, 4.5vw, 3.8rem);
    font-weight: 800;
    line-height: 1.13;
    letter-spacing: -.025em;
}
.community-reviews-page[b-y280umcnse]  .hero-subtitle {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-size: clamp(1.08rem, 1.65vw, 1.35rem);
    line-height: 1.75;
}
.community-reviews-page[b-y280umcnse]  .hero-trust-row {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    margin-top: 26px;
}
.community-reviews-page[b-y280umcnse]  .hero-trust-row span { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.94); font-size: 1.03rem; font-weight: 500; }

.community-reviews-page[b-y280umcnse]  .hero-rating-card {
    position: relative;
    z-index: 2;
    padding: 27px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 26px;
    background: rgba(255,255,255,.13);
    backdrop-filter: blur(16px);
    box-shadow: inset 0 1px rgba(255,255,255,.12);
}
.community-reviews-page[b-y280umcnse]  .hero-rating-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.community-reviews-page[b-y280umcnse]  .hero-rating-icon { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 19px; color: #9b6800; background: #fff8df; box-shadow: 0 12px 25px rgba(0,0,0,.15); }
.community-reviews-page[b-y280umcnse]  .verified-badge { display: inline-flex; align-items: center; gap: 5px; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.14); color: #fff; font-size: .9rem; font-weight: 600; }
.community-reviews-page[b-y280umcnse]  .hero-score-row { display: flex; align-items: center; gap: 16px; margin: 24px 0; }
.community-reviews-page[b-y280umcnse]  .hero-score-row > strong { color: #fff; font-size: clamp(3.1rem, 5vw, 4.6rem); font-weight: 800; line-height: 1; }
.community-reviews-page[b-y280umcnse]  .hero-score-row span { color: rgba(255,255,255,.76); font-size: .98rem; }
.community-reviews-page[b-y280umcnse]  .display-stars { color: #f4b942; font-size: 1.28rem; letter-spacing: 2px; white-space: nowrap; }
.community-reviews-page[b-y280umcnse]  .hero-stars { color: #ffd76a; font-size: 1.42rem; }
.community-reviews-page[b-y280umcnse]  .hero-button { width: 100%; min-height: 54px; border-radius: 15px; color: var(--rv-green-900) !important; background: #fff !important; font-family: "Kanit", sans-serif; font-size: 1.08rem; font-weight: 700; }

.community-reviews-page[b-y280umcnse]  .summary-grid { margin-top: 12px; }
.community-reviews-page[b-y280umcnse]  .summary-card {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 122px;
    padding: 22px;
    border: 1px solid var(--rv-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 30px rgba(18,70,53,.075);
    transition: transform .2s ease, box-shadow .2s ease;
}
.community-reviews-page[b-y280umcnse]  .summary-card:hover { transform: translateY(-3px); box-shadow: 0 17px 38px rgba(18,70,53,.11); }
.community-reviews-page[b-y280umcnse]  .summary-icon { display: grid; place-items: center; flex: 0 0 58px; width: 58px; height: 58px; border-radius: 19px; }
.community-reviews-page[b-y280umcnse]  .summary-gold .summary-icon { color: #a96a00; background: #fff2d1; }
.community-reviews-page[b-y280umcnse]  .summary-green .summary-icon { color: #087c4f; background: #e3f7ec; }
.community-reviews-page[b-y280umcnse]  .summary-blue .summary-icon { color: #276db4; background: #eaf4ff; }
.community-reviews-page[b-y280umcnse]  .summary-purple .summary-icon { color: #7654b6; background: #f2edff; }
.community-reviews-page[b-y280umcnse]  .summary-number { color: var(--rv-ink); font-size: clamp(1.8rem,2.9vw,2.35rem); font-weight: 800; line-height: 1; }
.community-reviews-page[b-y280umcnse]  .summary-label { margin-top: 8px; color: var(--rv-muted); font-size: 1.03rem; font-weight: 500; }

.community-reviews-page[b-y280umcnse]  .insight-grid { margin-top: 10px; }
.community-reviews-page[b-y280umcnse]  .rating-overview-card,
.community-reviews-page[b-y280umcnse]  .quality-card,
.community-reviews-page[b-y280umcnse]  .view-panel,
.community-reviews-page[b-y280umcnse]  .editor-panel,
.community-reviews-page[b-y280umcnse]  .filter-panel {
    height: 100%;
    padding: clamp(23px,3vw,34px);
    border: 1px solid var(--rv-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 15px 40px rgba(18,70,53,.08);
}
.community-reviews-page[b-y280umcnse]  .panel-heading,
.community-reviews-page[b-y280umcnse]  .view-heading,
.community-reviews-page[b-y280umcnse]  .filter-heading,
.community-reviews-page[b-y280umcnse]  .content-heading,
.community-reviews-page[b-y280umcnse]  .section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.community-reviews-page[b-y280umcnse]  .panel-title { color: var(--rv-ink); font-size: clamp(1.35rem,2vw,1.72rem); font-weight: 750; }
.community-reviews-page[b-y280umcnse]  .panel-subtitle { margin-top: 5px; color: var(--rv-muted); font-size: 1.03rem; line-height: 1.55; }
.community-reviews-page[b-y280umcnse]  .live-chip { color: #087a4d !important; background: #e6f8ee !important; font-family: "Kanit", sans-serif; font-weight: 600; }
.community-reviews-page[b-y280umcnse]  .rating-overview-content { display: grid; grid-template-columns: 170px 1fr; gap: 34px; align-items: center; margin-top: 28px; }
.community-reviews-page[b-y280umcnse]  .big-score-block { text-align: center; padding: 22px; border-radius: 22px; background: linear-gradient(145deg,#fffaf0,#fff3ce); }
.community-reviews-page[b-y280umcnse]  .big-score-block > strong { color: #835b09; font-size: 3.7rem; font-weight: 800; line-height: 1; }
.community-reviews-page[b-y280umcnse]  .big-stars { margin: 10px 0 4px; font-size: 1.3rem; }
.community-reviews-page[b-y280umcnse]  .big-score-block span { color: #7d6b42; font-size: 1rem; font-weight: 600; }
.community-reviews-page[b-y280umcnse]  .rating-bars { display: grid; gap: 11px; }
.community-reviews-page[b-y280umcnse]  .rating-bar-row { display: grid; grid-template-columns: 48px 1fr 30px; gap: 12px; align-items: center; }
.community-reviews-page[b-y280umcnse]  .bar-label { display: flex; align-items: center; gap: 3px; color: #6e6040; font-weight: 650; }
.community-reviews-page[b-y280umcnse]  .bar-label .mud-icon-root { color: var(--rv-gold); }
.community-reviews-page[b-y280umcnse]  .bar-track { height: 11px; overflow: hidden; border-radius: 999px; background: #edf1ef; }
.community-reviews-page[b-y280umcnse]  .bar-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg,#eaaa2f,#f7c85c); }
.community-reviews-page[b-y280umcnse]  .bar-count { color: var(--rv-muted); font-size: .95rem; text-align: right; }

.community-reviews-page[b-y280umcnse]  .quality-card { position: relative; overflow: hidden; background: linear-gradient(145deg,#0a503a,#0e7652); color: #fff; }
.community-reviews-page[b-y280umcnse]  .quality-card::after { content:""; position:absolute; width:250px; height:250px; border-radius:50%; right:-130px; bottom:-140px; background:rgba(255,255,255,.06); }
.community-reviews-page[b-y280umcnse]  .quality-icon { display:grid; place-items:center; width:66px; height:66px; border-radius:20px; color:#0a5b40; background:#fff; }
.community-reviews-page[b-y280umcnse]  .quality-title { margin-top: 20px; color:#fff; font-size:1.5rem; font-weight:700; }
.community-reviews-page[b-y280umcnse]  .quality-description { margin-top:9px; color:rgba(255,255,255,.79); font-size:1.03rem; line-height:1.7; }
.community-reviews-page[b-y280umcnse]  .quality-list { position:relative; z-index:2; display:grid; gap:12px; margin-top:23px; }
.community-reviews-page[b-y280umcnse]  .quality-list span { display:flex; align-items:center; gap:9px; color:rgba(255,255,255,.94); font-size:1.02rem; }
.community-reviews-page[b-y280umcnse]  .quality-list .mud-icon-root { color:#80e3b4; }

.community-reviews-page[b-y280umcnse]  .view-panel,
.community-reviews-page[b-y280umcnse]  .editor-panel,
.community-reviews-page[b-y280umcnse]  .filter-panel { margin-top: 25px; height: auto; }
.community-reviews-page[b-y280umcnse]  .mock-chip,
.community-reviews-page[b-y280umcnse]  .result-chip { color: var(--rv-green-800) !important; border-color: #a8cbbb !important; font-family:"Kanit",sans-serif; font-weight:600; }
.community-reviews-page[b-y280umcnse]  .view-buttons { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:24px; }
.community-reviews-page[b-y280umcnse]  .view-button { display:flex; align-items:center; gap:14px; width:100%; min-height:92px; padding:16px; border:1px solid var(--rv-border); border-radius:20px; color:var(--rv-ink); background:#f9fcfa; text-align:left; cursor:pointer; font-family:"Kanit",sans-serif; transition:.2s ease; }
.community-reviews-page[b-y280umcnse]  .view-button:hover { transform:translateY(-2px); border-color:#a9cdbd; box-shadow:0 10px 22px rgba(14,83,59,.08); }
.community-reviews-page[b-y280umcnse]  .view-button.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,var(--rv-green-900),var(--rv-green-700)); box-shadow:0 14px 26px rgba(8,84,59,.19); }
.community-reviews-page[b-y280umcnse]  .view-icon { display:grid; place-items:center; flex:0 0 54px; width:54px; height:54px; border-radius:17px; color:var(--rv-green-800); background:#e5f6ed; }
.community-reviews-page[b-y280umcnse]  .view-button.active .view-icon { color:var(--rv-green-900); background:#fff; }
.community-reviews-page[b-y280umcnse]  .view-button span:last-child { display:grid; gap:3px; }
.community-reviews-page[b-y280umcnse]  .view-button strong { font-size:1.08rem; font-weight:700; }
.community-reviews-page[b-y280umcnse]  .view-button small { color:var(--rv-muted); font-size:.94rem; }
.community-reviews-page[b-y280umcnse]  .view-button.active small { color:rgba(255,255,255,.76); }

.community-reviews-page[b-y280umcnse]  .section-icon { display:grid; place-items:center; flex:0 0 58px; width:58px; height:58px; border-radius:18px; color:#fff; background:linear-gradient(135deg,var(--rv-green-900),var(--rv-green-600)); box-shadow:0 10px 22px rgba(8,83,58,.18); }
.community-reviews-page[b-y280umcnse]  .section-title-wrap { flex:1; }
.community-reviews-page[b-y280umcnse]  .section-title { color:var(--rv-ink); font-size:1.55rem; font-weight:750; }
.community-reviews-page[b-y280umcnse]  .section-subtitle { margin-top:5px; color:var(--rv-muted); font-size:1.02rem; line-height:1.55; }
.community-reviews-page[b-y280umcnse]  .close-button { color:#65766f; background:var(--theme-bg); }
.community-reviews-page[b-y280umcnse]  .section-divider { margin:23px 0 27px; }

.community-reviews-page[b-y280umcnse]  .large-input .mud-input-label { font-family:"Kanit",sans-serif; font-size:1.04rem; }
.community-reviews-page[b-y280umcnse]  .large-input .mud-input-slot,
.community-reviews-page[b-y280umcnse]  .large-input input,
.community-reviews-page[b-y280umcnse]  .large-input textarea,
.community-reviews-page[b-y280umcnse]  .large-input .mud-select-input { font-family:"Kanit",sans-serif; font-size:1.06rem; }
.community-reviews-page[b-y280umcnse]  .large-input .mud-input-control-input-container { min-height:57px; }
.community-reviews-page[b-y280umcnse]  .review-comment-input .mud-input-control-input-container { min-height:155px; }
.community-reviews-page[b-y280umcnse]  .selected-job-card { display:flex; gap:18px; padding:17px; border:1px solid #cfe3d9; border-radius:21px; background:#f5fbf8; }
.community-reviews-page[b-y280umcnse]  .job-image { position:relative; display:grid; place-items:center; flex:0 0 122px; width:122px; min-height:100px; border-radius:17px; color:#0b7350; background-color:#dff2e9; background-size:cover; background-position:center; }
.community-reviews-page[b-y280umcnse]  .job-image > .mud-icon-root { position:relative; z-index:0; font-size:2.2rem; opacity:.4; }
.community-reviews-page[b-y280umcnse]  .selected-job-info { display:flex; flex-direction:column; justify-content:center; gap:6px; }
.community-reviews-page[b-y280umcnse]  .job-code { display:inline-block; width:max-content; color:#0d7653; font-size:.9rem; font-weight:700; letter-spacing:.02em; }
.community-reviews-page[b-y280umcnse]  .selected-job-info > strong { color:var(--rv-ink); font-size:1.25rem; }
.community-reviews-page[b-y280umcnse]  .selected-job-info > div { display:flex; flex-wrap:wrap; gap:10px 18px; }
.community-reviews-page[b-y280umcnse]  .selected-job-info > div span { display:flex; align-items:center; gap:5px; color:var(--rv-muted); font-size:.98rem; }

.community-reviews-page[b-y280umcnse]  .overall-rating-box { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:24px; border:1px solid #ecd9a9; border-radius:22px; background:linear-gradient(135deg,#fffaf0,#fff6dc); }
.community-reviews-page[b-y280umcnse]  .overall-rating-box > div:first-child { display:grid; gap:3px; }
.community-reviews-page[b-y280umcnse]  .overall-rating-box strong { color:#6d521b; font-size:1.35rem; }
.community-reviews-page[b-y280umcnse]  .overall-rating-box span { color:#92773c; font-size:1rem; }
.community-reviews-page[b-y280umcnse]  .star-input { display:flex; gap:4px; }
.community-reviews-page[b-y280umcnse]  .star-input button { display:grid; place-items:center; padding:2px; border:0; color:#c8cfcb; background:transparent; cursor:pointer; transition:transform .15s ease,color .15s ease; }
.community-reviews-page[b-y280umcnse]  .star-input button:hover { transform:scale(1.13); color:#f2bd45; }
.community-reviews-page[b-y280umcnse]  .star-input button.selected { color:#f2b632; }
.community-reviews-page[b-y280umcnse]  .star-input .mud-icon-root { font-size:1.7rem; }
.community-reviews-page[b-y280umcnse]  .large-star-input .mud-icon-root { font-size:2.55rem; }
.community-reviews-page[b-y280umcnse]  .rating-field { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:92px; padding:18px 20px; border:1px solid var(--rv-border); border-radius:19px; background:color-mix(in srgb, var(--theme-bg) 42%, white); }
.community-reviews-page[b-y280umcnse]  .rating-field > div:first-child { display:grid; gap:2px; }
.community-reviews-page[b-y280umcnse]  .rating-field strong { font-size:1.09rem; }
.community-reviews-page[b-y280umcnse]  .rating-field small { color:var(--rv-muted); font-size:.91rem; }
.community-reviews-page[b-y280umcnse]  .privacy-row { display:flex; align-items:center; gap:11px; padding:17px; border-radius:18px; background:color-mix(in srgb, var(--theme-bg) 82%, white); }
.community-reviews-page[b-y280umcnse]  .privacy-row > div:last-child { display:grid; gap:2px; }
.community-reviews-page[b-y280umcnse]  .privacy-row strong { font-size:1.03rem; }
.community-reviews-page[b-y280umcnse]  .privacy-row span { color:var(--rv-muted); font-size:.94rem; }
.community-reviews-page[b-y280umcnse]  .editor-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:28px; }
.community-reviews-page[b-y280umcnse]  .primary-button,
.community-reviews-page[b-y280umcnse]  .small-primary-button { min-height:52px; padding:0 25px; border-radius:14px; color:#fff !important; background:linear-gradient(135deg,var(--rv-green-900),var(--rv-green-700)) !important; font-family:"Kanit",sans-serif; font-size:1.05rem; font-weight:700; }
.community-reviews-page[b-y280umcnse]  .small-primary-button { min-height:42px; font-size:.98rem; }
.community-reviews-page[b-y280umcnse]  .secondary-button { min-height:52px; padding:0 22px; border-radius:14px; border-color:#b8cbc2 !important; color:#486157 !important; font-family:"Kanit",sans-serif; font-size:1.05rem; }

.community-reviews-page[b-y280umcnse]  .reset-button { color:#557067; font-family:"Kanit",sans-serif; font-size:1rem; }
.community-reviews-page[b-y280umcnse]  .filter-grid { margin-top:17px; }
.community-reviews-page[b-y280umcnse]  .content-section { margin-top:31px; }
.community-reviews-page[b-y280umcnse]  .content-title { color:var(--rv-ink); font-size:clamp(1.55rem,2.4vw,2rem); font-weight:800; }
.community-reviews-page[b-y280umcnse]  .content-subtitle { margin-top:5px; color:var(--rv-muted); font-size:1.04rem; }
.community-reviews-page[b-y280umcnse]  .pending-chip { color:#8b610e !important; background:#fff2cd !important; font-family:"Kanit",sans-serif; font-weight:650; }

.community-reviews-page[b-y280umcnse]  .pending-review-card { height:100%; overflow:hidden; border:1px solid var(--rv-border); border-radius:25px; background:#fff; box-shadow:0 12px 30px rgba(18,70,53,.075); transition:.2s ease; }
.community-reviews-page[b-y280umcnse]  .pending-review-card:hover { transform:translateY(-4px); box-shadow:0 19px 40px rgba(18,70,53,.12); }
.community-reviews-page[b-y280umcnse]  .pending-job-image { position:relative; display:grid; place-items:center; height:190px; color:#0e7754; background:linear-gradient(145deg,color-mix(in srgb, var(--theme-light) 13%, white),#cae8da); background-size:cover; background-position:center; }
.community-reviews-page[b-y280umcnse]  .completed-badge { position:absolute; z-index:2; top:14px; left:14px; display:flex; align-items:center; gap:5px; padding:7px 11px; border-radius:999px; color:#08774c; background:rgba(255,255,255,.93); font-size:.9rem; font-weight:650; box-shadow:0 5px 15px rgba(0,0,0,.08); }
.community-reviews-page[b-y280umcnse]  .image-fallback-icon { font-size:3.6rem; opacity:.35; }
.community-reviews-page[b-y280umcnse]  .has-image > .image-fallback-icon,
.community-reviews-page[b-y280umcnse]  .has-image > .mud-icon-root { opacity: 0; }

.community-reviews-page[b-y280umcnse]  .pending-card-body { padding:22px; }
.community-reviews-page[b-y280umcnse]  .pending-job-title { margin-top:5px; color:var(--rv-ink); font-size:1.3rem; font-weight:700; line-height:1.45; }
.community-reviews-page[b-y280umcnse]  .provider-mini-row { display:flex; align-items:center; gap:11px; margin-top:17px; padding:13px; border-radius:16px; background:#f5f9f7; }
.community-reviews-page[b-y280umcnse]  .avatar-image { display:grid; place-items:center; flex:0 0 48px; width:48px; height:48px; border-radius:50%; color:#0d7452; background-color:#dcefe6; background-size:cover; background-position:center; }
.community-reviews-page[b-y280umcnse]  .provider-mini-row > div:last-child { display:grid; gap:1px; }
.community-reviews-page[b-y280umcnse]  .provider-mini-row strong { font-size:1rem; }
.community-reviews-page[b-y280umcnse]  .provider-mini-row span { color:var(--rv-muted); font-size:.9rem; }
.community-reviews-page[b-y280umcnse]  .pending-meta { display:flex; flex-wrap:wrap; gap:9px 16px; margin:16px 0; }
.community-reviews-page[b-y280umcnse]  .pending-meta span { display:flex; align-items:center; gap:4px; color:var(--rv-muted); font-size:.93rem; }
.community-reviews-page[b-y280umcnse]  .review-now-button { width:100%; min-height:49px; border-radius:14px; color:#fff !important; background:linear-gradient(135deg,var(--rv-green-900),var(--rv-green-700)) !important; font-family:"Kanit",sans-serif; font-size:1.02rem; font-weight:700; }

.community-reviews-page[b-y280umcnse]  .review-list { display:grid; gap:18px; }
.community-reviews-page[b-y280umcnse]  .review-card { display:grid; grid-template-columns:minmax(260px,330px) 1fr; overflow:hidden; border:1px solid var(--rv-border); border-radius:26px; background:#fff; box-shadow:0 12px 30px rgba(18,70,53,.07); }
.community-reviews-page[b-y280umcnse]  .review-job-column { padding:19px; border-right:1px solid var(--rv-border); background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.community-reviews-page[b-y280umcnse]  .review-job-image { position:relative; display:grid; place-items:center; height:155px; border-radius:18px; color:#0e7652; background:linear-gradient(145deg,#e3f4ec,#cde8dc); background-size:cover; background-position:center; }
.community-reviews-page[b-y280umcnse]  .review-job-info { display:grid; gap:5px; margin-top:15px; }
.community-reviews-page[b-y280umcnse]  .review-job-info > strong { color:var(--rv-ink); font-size:1.12rem; line-height:1.45; }
.community-reviews-page[b-y280umcnse]  .review-job-info > div { display:grid; gap:5px; margin-top:4px; }
.community-reviews-page[b-y280umcnse]  .review-job-info > div span { display:flex; align-items:center; gap:5px; color:var(--rv-muted); font-size:.92rem; }
.community-reviews-page[b-y280umcnse]  .review-main-column { min-width:0; padding:24px 27px; }
.community-reviews-page[b-y280umcnse]  .review-author-row { display:flex; align-items:center; gap:13px; }
.community-reviews-page[b-y280umcnse]  .large-avatar { flex-basis:56px; width:56px; height:56px; }
.community-reviews-page[b-y280umcnse]  .author-info { flex:1; min-width:0; }
.community-reviews-page[b-y280umcnse]  .author-info > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.community-reviews-page[b-y280umcnse]  .author-info strong { color:var(--rv-ink); font-size:1.09rem; }
.community-reviews-page[b-y280umcnse]  .author-info > span { display:block; margin-top:2px; color:var(--rv-muted); font-size:.92rem; }
.community-reviews-page[b-y280umcnse]  .verified-inline { display:inline-flex; align-items:center; gap:3px; padding:4px 8px; border-radius:999px; color:#08764c; background:#e5f7ed; font-size:.78rem; font-weight:650; }
.community-reviews-page[b-y280umcnse]  .review-score { text-align:right; }
.community-reviews-page[b-y280umcnse]  .review-score strong { display:block; margin-top:2px; color:#8d650d; font-size:1.1rem; }
.community-reviews-page[b-y280umcnse]  .review-comment { margin-top:19px; color:#2d463d; font-size:1.08rem; line-height:1.78; }
.community-reviews-page[b-y280umcnse]  .subrating-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:17px; }
.community-reviews-page[b-y280umcnse]  .subrating-row span { padding:7px 11px; border-radius:999px; color:#5d6f68; background:#f1f6f3; font-size:.88rem; }
.community-reviews-page[b-y280umcnse]  .subrating-row strong { color:#a27313; }
.community-reviews-page[b-y280umcnse]  .reply-box { margin-top:19px; padding:17px 19px; border-left:4px solid var(--rv-green-600); border-radius:4px 17px 17px 4px; background:#f2f8f5; }
.community-reviews-page[b-y280umcnse]  .reply-title { display:flex; align-items:center; gap:7px; color:#0d6e4d; font-size:.95rem; font-weight:700; }
.community-reviews-page[b-y280umcnse]  .reply-box p { margin:8px 0 4px; color:#3a5148; font-size:1rem; line-height:1.65; }
.community-reviews-page[b-y280umcnse]  .reply-box > span { color:#809087; font-size:.83rem; }
.community-reviews-page[b-y280umcnse]  .reply-editor { margin-top:17px; padding:16px; border:1px solid #c9ded4; border-radius:18px; background:#f9fcfa; }
.community-reviews-page[b-y280umcnse]  .reply-editor > div:last-child { display:flex; justify-content:flex-end; gap:8px; margin-top:10px; }
.community-reviews-page[b-y280umcnse]  .review-actions { display:flex; flex-wrap:wrap; gap:5px; margin-top:16px; padding-top:13px; border-top:1px solid #edf2ef; }
.community-reviews-page[b-y280umcnse]  .action-button { color:#536d63; font-family:"Kanit",sans-serif; }
.community-reviews-page[b-y280umcnse]  .delete-button { color:#b23b42; font-family:"Kanit",sans-serif; margin-left:auto; }

.community-reviews-page[b-y280umcnse]  .loading-state,
.community-reviews-page[b-y280umcnse]  .empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:280px; margin-top:18px; padding:35px; border:1px dashed #b9d0c5; border-radius:26px; background:color-mix(in srgb, var(--theme-bg) 58%, white); text-align:center; }
.community-reviews-page[b-y280umcnse]  .loading-state span { margin-top:15px; color:var(--rv-muted); font-size:1.05rem; }
.community-reviews-page[b-y280umcnse]  .empty-icon { display:grid; place-items:center; width:76px; height:76px; margin-bottom:15px; border-radius:24px; color:#0e7955; background:#e3f5ec; }
.community-reviews-page[b-y280umcnse]  .empty-state strong { color:var(--rv-ink); font-size:1.35rem; }
.community-reviews-page[b-y280umcnse]  .empty-state > span { margin-top:5px; color:var(--rv-muted); font-size:1.02rem; }

@media (max-width: 1100px) {
    .community-reviews-page[b-y280umcnse]  .rating-overview-content { grid-template-columns:145px 1fr; gap:22px; }
    .community-reviews-page[b-y280umcnse]  .review-card { grid-template-columns:260px 1fr; }
    .community-reviews-page[b-y280umcnse]  .view-buttons { grid-template-columns:1fr; }
}

@media (max-width: 800px) {
    .community-reviews-page[b-y280umcnse] { padding:14px 11px 45px; }
    .community-reviews-page[b-y280umcnse]  .reviews-hero { border-radius:24px; }
    .community-reviews-page[b-y280umcnse]  .rating-overview-content { grid-template-columns:1fr; }
    .community-reviews-page[b-y280umcnse]  .big-score-block { max-width:230px; margin:auto; }
    .community-reviews-page[b-y280umcnse]  .panel-heading,
    .community-reviews-page[b-y280umcnse]  .view-heading,
    .community-reviews-page[b-y280umcnse]  .filter-heading,
    .community-reviews-page[b-y280umcnse]  .content-heading { flex-direction:column; }
    .community-reviews-page[b-y280umcnse]  .review-card { grid-template-columns:1fr; }
    .community-reviews-page[b-y280umcnse]  .review-job-column { border-right:0; border-bottom:1px solid var(--rv-border); }
    .community-reviews-page[b-y280umcnse]  .review-job-image { height:205px; }
    .community-reviews-page[b-y280umcnse]  .overall-rating-box { flex-direction:column; align-items:flex-start; }
    .community-reviews-page[b-y280umcnse]  .large-star-input .mud-icon-root { font-size:2.2rem; }
}

@media (max-width: 560px) {
    .community-reviews-page[b-y280umcnse]  .summary-card { min-height:105px; padding:15px; gap:11px; border-radius:19px; }
    .community-reviews-page[b-y280umcnse]  .summary-icon { flex-basis:48px; width:48px; height:48px; border-radius:15px; }
    .community-reviews-page[b-y280umcnse]  .summary-label { font-size:.92rem; }
    .community-reviews-page[b-y280umcnse]  .rating-overview-card,
    .community-reviews-page[b-y280umcnse]  .quality-card,
    .community-reviews-page[b-y280umcnse]  .view-panel,
    .community-reviews-page[b-y280umcnse]  .editor-panel,
    .community-reviews-page[b-y280umcnse]  .filter-panel { padding:19px 16px; border-radius:22px; }
    .community-reviews-page[b-y280umcnse]  .selected-job-card { flex-direction:column; }
    .community-reviews-page[b-y280umcnse]  .job-image { width:100%; min-height:150px; }
    .community-reviews-page[b-y280umcnse]  .rating-field { flex-direction:column; align-items:flex-start; }
    .community-reviews-page[b-y280umcnse]  .editor-actions { flex-direction:column-reverse; }
    .community-reviews-page[b-y280umcnse]  .primary-button,
    .community-reviews-page[b-y280umcnse]  .secondary-button { width:100%; }
    .community-reviews-page[b-y280umcnse]  .review-main-column { padding:20px 17px; }
    .community-reviews-page[b-y280umcnse]  .review-author-row { align-items:flex-start; }
    .community-reviews-page[b-y280umcnse]  .review-score { width:100%; margin-top:9px; text-align:left; }
    .community-reviews-page[b-y280umcnse]  .review-author-row { flex-wrap:wrap; }
    .community-reviews-page[b-y280umcnse]  .delete-button { margin-left:0; }
}
/* /Components/Pages/03Marketplace/02Community-jobs/CommunityJobs.razor.rz.scp.css */
.community-jobs-page[b-yw6riuv7is]{
    --community-green-900: #0b3d2e;
    --community-green-800: #12533e;
    --community-green-700: #176b4d;
    --community-green-600: #1f8a62;
    --community-green-100: #e8f6ef;
    --community-ink: #18332a;
    --community-muted: #63756e;
    --community-border: #dce8e2;
    --community-surface: #ffffff;
    --community-bg: var(--theme-bg);
    max-width: 1660px;
    margin: 0 auto;
    padding: 24px 20px 56px;
    color: var(--community-ink);
    font-family: "Kanit", sans-serif;
}

.community-jobs-page[b-yw6riuv7is]  .community-hero{
    position: relative;
    overflow: hidden;
    padding: clamp(26px, 4vw, 52px);
    border-radius: 30px;
    color: #fff;
    background:
        linear-gradient(120deg, rgba(7, 47, 35, .98), rgba(18, 96, 67, .95)),
        radial-gradient(circle at 90% 20%, rgba(255,255,255,.16), transparent 35%);
    box-shadow: 0 22px 55px rgba(11, 61, 46, .22);
}

.community-jobs-page[b-yw6riuv7is]  .hero-decoration{
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    border: 1px solid rgba(255,255,255,.12);
}

.community-jobs-page[b-yw6riuv7is]  .hero-decoration-one{
    width: 360px;
    height: 360px;
    right: -120px;
    top: -170px;
    background: rgba(255,255,255,.05);
}

.community-jobs-page[b-yw6riuv7is]  .hero-decoration-two{
    width: 220px;
    height: 220px;
    right: 22%;
    bottom: -150px;
    background: rgba(255, 220, 121, .09);
}

.community-jobs-page[b-yw6riuv7is]  .hero-badge{
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    background: rgba(255,255,255,.11);
    backdrop-filter: blur(10px);
    font-size: 1rem;
    font-weight: 600;
}

.community-jobs-page[b-yw6riuv7is]  .hero-title{
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2rem, 4vw, 3.5rem);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -.025em;
}

.community-jobs-page[b-yw6riuv7is]  .hero-subtitle{
    max-width: 760px;
    margin-top: 12px;
    color: rgba(255,255,255,.82);
    font-size: clamp(1.05rem, 1.6vw, 1.32rem);
    font-weight: 400;
    line-height: 1.7;
}

.community-jobs-page[b-yw6riuv7is]  .hero-tags{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 25px;
}

.community-jobs-page[b-yw6riuv7is]  .hero-tags span{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255,255,255,.9);
    font-size: 1rem;
    font-weight: 500;
}

.community-jobs-page[b-yw6riuv7is]  .hero-action-box{
    position: relative;
    z-index: 2;
    padding: 25px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 24px;
    background: rgba(255,255,255,.11);
    backdrop-filter: blur(14px);
}

.community-jobs-page[b-yw6riuv7is]  .hero-action-icon{
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: 16px;
    border-radius: 18px;
    color: var(--community-green-900);
    background: #fff;
    box-shadow: 0 10px 25px rgba(0,0,0,.14);
}

.community-jobs-page[b-yw6riuv7is]  .hero-action-title{
    color: #fff;
    font-size: 1.3rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .hero-action-text{
    margin: 7px 0 19px;
    color: rgba(255,255,255,.78);
    font-size: 1rem;
    line-height: 1.6;
}

.community-jobs-page[b-yw6riuv7is]  .hero-create-button{
    width: 100%;
    min-height: 48px;
    border-radius: 14px;
    color: var(--community-green-900) !important;
    background: #fff !important;
    font-size: 1.05rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .summary-grid{
    margin-top: 12px;
}

.community-jobs-page[b-yw6riuv7is]  .summary-card{
    display: flex;
    align-items: center;
    gap: 17px;
    min-height: 118px;
    padding: 21px;
    border: 1px solid var(--community-border);
    border-radius: 22px;
    background: var(--community-surface);
    box-shadow: 0 10px 28px rgba(21, 70, 52, .07);
}

.community-jobs-page[b-yw6riuv7is]  .summary-icon{
    display: grid;
    place-items: center;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border-radius: 18px;
}

.community-jobs-page[b-yw6riuv7is]  .summary-card-green .summary-icon{ color: #0d7a50; background: #e5f7ee; }
.community-jobs-page[b-yw6riuv7is]  .summary-card-red .summary-icon{ color: #c73e45; background: #fff0f1; }
.community-jobs-page[b-yw6riuv7is]  .summary-card-blue .summary-icon{ color: #2e68a5; background: #edf5ff; }
.community-jobs-page[b-yw6riuv7is]  .summary-card-gold .summary-icon{ color: #9a6a0b; background: #fff7df; }

.community-jobs-page[b-yw6riuv7is]  .summary-number{
    color: var(--community-ink);
    font-size: clamp(1.7rem, 2.8vw, 2.25rem);
    font-weight: 800;
    line-height: 1;
}

.community-jobs-page[b-yw6riuv7is]  .summary-label{
    margin-top: 8px;
    color: var(--community-muted);
    font-size: 1rem;
    font-weight: 500;
}

.community-jobs-page[b-yw6riuv7is]  .filter-panel,
.community-jobs-page[b-yw6riuv7is]  .editor-panel,
.community-jobs-page[b-yw6riuv7is]  .detail-panel{
    margin-top: 24px;
    padding: clamp(20px, 3vw, 32px);
    border: 1px solid var(--community-border);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(21, 70, 52, .075);
}

.community-jobs-page[b-yw6riuv7is]  .editor-panel{
    border-top: 5px solid var(--community-green-700);
}

.community-jobs-page[b-yw6riuv7is]  .section-heading{
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 23px;
}

.community-jobs-page[b-yw6riuv7is]  .section-heading-icon{
    display: grid;
    place-items: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(140deg, var(--community-green-700), var(--community-green-900));
    box-shadow: 0 9px 20px rgba(23,107,77,.23);
}

.community-jobs-page[b-yw6riuv7is]  .section-heading-content{
    flex: 1;
    min-width: 0;
}

.community-jobs-page[b-yw6riuv7is]  .section-title{
    color: var(--community-ink);
    font-size: clamp(1.3rem, 2vw, 1.65rem);
    font-weight: 750;
}

.community-jobs-page[b-yw6riuv7is]  .section-subtitle{
    margin-top: 3px;
    color: var(--community-muted);
    font-size: 1rem;
    line-height: 1.55;
}

.community-jobs-page[b-yw6riuv7is]  .editor-divider{
    margin: -3px 0 25px;
}

.community-jobs-page[b-yw6riuv7is]  .close-editor-button{
    flex: 0 0 auto;
}

.community-jobs-page[b-yw6riuv7is]  .large-input .mud-input-label,
.community-jobs-page[b-yw6riuv7is]  .large-input .mud-input-control-input-container,
.community-jobs-page[b-yw6riuv7is]  .large-input input,
.community-jobs-page[b-yw6riuv7is]  .large-input textarea,
.community-jobs-page[b-yw6riuv7is]  .large-input .mud-select-input{
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.community-jobs-page[b-yw6riuv7is]  .large-input .mud-input-label{
    font-weight: 500;
}

.community-jobs-page[b-yw6riuv7is]  .urgent-switch-box{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    min-height: 56px;
    padding: 9px 15px;
    border: 1px solid #c9d8d1;
    border-radius: 8px;
}

.community-jobs-page[b-yw6riuv7is]  .urgent-switch-title{
    color: var(--community-ink);
    font-size: 1.04rem;
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .urgent-switch-subtitle{
    color: var(--community-muted);
    font-size: .9rem;
}

.community-jobs-page[b-yw6riuv7is]  .image-upload-panel{
    padding: 22px;
    border: 1px dashed #a9c9ba;
    border-radius: 20px;
    background: #f8fcfa;
}

.community-jobs-page[b-yw6riuv7is]  .upload-info{
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

.community-jobs-page[b-yw6riuv7is]  .upload-icon{
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    color: var(--community-green-700);
    background: var(--community-green-100);
}

.community-jobs-page[b-yw6riuv7is]  .upload-title{
    color: var(--community-ink);
    font-size: 1.2rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .upload-description{
    color: var(--community-muted);
    font-size: .98rem;
    line-height: 1.5;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 142px;
    padding: 18px;
    overflow: hidden;
    cursor: pointer;
    border: 1px dashed #77ae94;
    border-radius: 17px;
    color: var(--community-green-800);
    background: #edf8f2;
    transition: .2s ease;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker:hover{
    transform: translateY(-2px);
    border-color: var(--community-green-700);
    background: #e4f4eb;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker > .mud-icon-root{
    font-size: 2rem;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker span{
    margin-top: 8px;
    font-size: 1.08rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker small{
    margin-top: 4px;
    color: #6b8278;
    font-size: .87rem;
}

.community-jobs-page[b-yw6riuv7is]  .file-picker input[type="file"]{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.community-jobs-page[b-yw6riuv7is]  .selected-file-row{
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 7px 10px;
    border-radius: 10px;
    color: #31624d;
    background: #eef8f3;
    font-size: .98rem;
    font-weight: 550;
}

.community-jobs-page[b-yw6riuv7is]  .selected-file-row span{
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.community-jobs-page[b-yw6riuv7is]  .image-preview-box{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 18px;
    padding: 13px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(21,70,52,.07);
}

.community-jobs-page[b-yw6riuv7is]  .image-preview-box img{
    width: 128px;
    height: 88px;
    border-radius: 12px;
    object-fit: cover;
}

.community-jobs-page[b-yw6riuv7is]  .preview-title{
    color: var(--community-ink);
    font-size: 1.02rem;
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .preview-path{
    margin-top: 4px;
    color: var(--community-muted);
    word-break: break-all;
}

.community-jobs-page[b-yw6riuv7is]  .editor-actions{
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid #e5ece8;
}

.community-jobs-page[b-yw6riuv7is]  .editor-actions .mud-button-root{
    min-height: 48px;
    padding-inline: 22px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .save-button{
    box-shadow: 0 10px 24px rgba(31,138,98,.2);
}

.community-jobs-page[b-yw6riuv7is]  .filter-heading{
    margin-bottom: 18px;
}

.community-jobs-page[b-yw6riuv7is]  .filter-result-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 45px;
    margin-top: 10px;
}

.community-jobs-page[b-yw6riuv7is]  .result-count{
    color: var(--community-muted);
    font-size: 1.02rem;
}

.community-jobs-page[b-yw6riuv7is]  .result-count strong{
    color: var(--community-green-700);
    font-size: 1.15rem;
}

.community-jobs-page[b-yw6riuv7is]  .detail-panel{
    scroll-margin-top: 20px;
    border-top: 5px solid #c79a35;
}

.community-jobs-page[b-yw6riuv7is]  .detail-header{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 22px;
}

.community-jobs-page[b-yw6riuv7is]  .detail-code{
    margin-bottom: 6px;
    color: var(--community-green-700);
    font-size: .95rem;
    font-weight: 650;
    letter-spacing: .04em;
}

.community-jobs-page[b-yw6riuv7is]  .detail-title{
    color: var(--community-ink);
    font-size: clamp(1.55rem, 3vw, 2.25rem);
    font-weight: 800;
    line-height: 1.25;
}

.community-jobs-page[b-yw6riuv7is]  .detail-image-frame{
    height: 100%;
    min-height: 330px;
    overflow: hidden;
    border-radius: 22px;
    background: #edf5f1;
}

.community-jobs-page[b-yw6riuv7is]  .detail-image-frame img{
    width: 100%;
    height: 100%;
    min-height: 330px;
    object-fit: cover;
}

.community-jobs-page[b-yw6riuv7is]  .detail-placeholder{
    min-height: 330px !important;
}

.community-jobs-page[b-yw6riuv7is]  .detail-status-row{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.community-jobs-page[b-yw6riuv7is]  .detail-description{
    color: #445b51;
    font-size: 1.08rem;
    line-height: 1.8;
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 22px;
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-item{
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 76px;
    padding: 13px;
    border: 1px solid #e1ebe6;
    border-radius: 15px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-item > .mud-icon-root{
    color: var(--community-green-700);
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-item div{
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-item span{
    color: var(--community-muted);
    font-size: .9rem;
}

.community-jobs-page[b-yw6riuv7is]  .detail-info-item strong{
    margin-top: 2px;
    overflow: hidden;
    color: var(--community-ink);
    font-size: 1rem;
    font-weight: 650;
    text-overflow: ellipsis;
}

.community-jobs-page[b-yw6riuv7is]  .skill-heading{
    margin-top: 22px;
    color: var(--community-ink);
    font-size: 1.1rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .detail-skills{
    margin-top: 10px;
}

.community-jobs-page[b-yw6riuv7is]  .detail-actions{
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.community-jobs-page[b-yw6riuv7is]  .detail-actions .mud-button-root{
    min-height: 46px;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .jobs-grid{
    margin-top: 11px;
}

.community-jobs-page[b-yw6riuv7is]  .job-card{
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--community-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(21,70,52,.075);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.community-jobs-page[b-yw6riuv7is]  .job-card:hover{
    transform: translateY(-5px);
    border-color: #a9cbbd;
    box-shadow: 0 20px 45px rgba(21,70,52,.13);
}

.community-jobs-page[b-yw6riuv7is]  .job-image-wrap{
    position: relative;
    height: 228px;
    overflow: hidden;
    background: #eaf3ef;
}

.community-jobs-page[b-yw6riuv7is]  .job-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.community-jobs-page[b-yw6riuv7is]  .job-card:hover .job-image{
    transform: scale(1.035);
}

.community-jobs-page[b-yw6riuv7is]  .job-image-placeholder{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: 228px;
    color: #34765b;
    background:
        radial-gradient(circle at 20% 10%, rgba(255,255,255,.9), transparent 32%),
        linear-gradient(140deg, #e7f4ed, #cfe7db);
}

.community-jobs-page[b-yw6riuv7is]  .job-image-placeholder > .mud-icon-root{
    font-size: 3.6rem;
}

.community-jobs-page[b-yw6riuv7is]  .job-image-placeholder span{
    font-size: 1.08rem;
    font-weight: 700;
}

.community-jobs-page[b-yw6riuv7is]  .image-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(5,25,18,.08), transparent 42%, rgba(5,25,18,.42));
    pointer-events: none;
}

.community-jobs-page[b-yw6riuv7is]  .job-top-badges{
    position: absolute;
    top: 14px;
    left: 14px;
    right: 14px;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.community-jobs-page[b-yw6riuv7is]  .status-chip,
.community-jobs-page[b-yw6riuv7is]  .urgent-chip{
    font-family: "Kanit", sans-serif;
    font-weight: 600;
    box-shadow: 0 5px 14px rgba(0,0,0,.13);
}

.community-jobs-page[b-yw6riuv7is]  .job-category-label{
    position: absolute;
    left: 15px;
    bottom: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 999px;
    color: #fff;
    background: rgba(9,46,34,.77);
    backdrop-filter: blur(8px);
    font-size: .94rem;
    font-weight: 600;
}

.community-jobs-page[b-yw6riuv7is]  .job-card-content{
    display: flex;
    flex-direction: column;
    min-height: 458px;
    padding: 21px;
}

.community-jobs-page[b-yw6riuv7is]  .job-code-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
    color: #7a8c84;
    font-size: .88rem;
    font-weight: 500;
}

.community-jobs-page[b-yw6riuv7is]  .job-code-row span:first-child{
    color: var(--community-green-700);
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .job-title{
    display: -webkit-box;
    min-height: 64px;
    overflow: hidden;
    color: var(--community-ink);
    font-size: 1.31rem;
    font-weight: 750;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.community-jobs-page[b-yw6riuv7is]  .job-description{
    display: -webkit-box;
    min-height: 56px;
    margin-top: 7px;
    overflow: hidden;
    color: #60746a;
    font-size: 1rem;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-list{
    display: grid;
    gap: 10px;
    margin-top: 17px;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-item{
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.community-jobs-page[b-yw6riuv7is]  .meta-icon{
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    color: var(--community-green-700);
    background: var(--community-green-100);
}

.community-jobs-page[b-yw6riuv7is]  .meta-icon > .mud-icon-root{
    font-size: 1.22rem;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-item > div:last-child{
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-item span{
    color: #819088;
    font-size: .83rem;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-item strong{
    overflow: hidden;
    color: #30483e;
    font-size: .96rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.community-jobs-page[b-yw6riuv7is]  .job-meta-item .budget-text{
    color: #0d7a50;
    font-size: 1.03rem;
    font-weight: 750;
}

.community-jobs-page[b-yw6riuv7is]  .skill-list{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 16px;
}

.community-jobs-page[b-yw6riuv7is]  .skill-list span{
    padding: 5px 10px;
    border: 1px solid #d7e9e0;
    border-radius: 999px;
    color: #3e6d58;
    background: #f2f9f5;
    font-size: .84rem;
    font-weight: 550;
}

.community-jobs-page[b-yw6riuv7is]  .applicant-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
    padding: 17px 0 14px;
    color: #687a72;
    font-size: .92rem;
}

.community-jobs-page[b-yw6riuv7is]  .applicant-info{
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.community-jobs-page[b-yw6riuv7is]  .applicant-info > .mud-icon-root{
    color: var(--community-green-700);
}

.community-jobs-page[b-yw6riuv7is]  .applicant-row strong{
    color: var(--community-ink);
    font-weight: 750;
}

.community-jobs-page[b-yw6riuv7is]  .applicant-count{
    padding: 6px 9px;
    border-radius: 9px;
    background: #f1f6f3;
}

.community-jobs-page[b-yw6riuv7is]  .job-actions{
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 54px;
    padding-top: 8px;
}

.community-jobs-page[b-yw6riuv7is]  .job-actions .mud-button-root{
    font-family: "Kanit", sans-serif;
    font-size: .98rem;
    font-weight: 650;
}

.community-jobs-page[b-yw6riuv7is]  .job-action-icons{
    display: flex;
    align-items: center;
    gap: 1px;
}

.community-jobs-page[b-yw6riuv7is]  .state-panel{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 300px;
    margin-top: 24px;
    padding: 35px;
    border: 1px solid var(--community-border);
    border-radius: 24px;
    color: var(--community-muted);
    background: #fff;
}

.community-jobs-page[b-yw6riuv7is]  .empty-state{
    text-align: center;
}

.community-jobs-page[b-yw6riuv7is]  .empty-icon{
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 24px;
    color: var(--community-green-700);
    background: var(--community-green-100);
}

.community-jobs-page[b-yw6riuv7is]  .empty-icon > .mud-icon-root{
    font-size: 2.5rem;
}

.community-jobs-page[b-yw6riuv7is]  .load-alert{
    margin-top: 24px;
    border-radius: 18px;
}

@media (max-width: 959px) {
    .community-jobs-page[b-yw6riuv7is]{
        padding: 18px 12px 40px;
    }

    .community-jobs-page[b-yw6riuv7is]  .hero-action-box{
        margin-top: 4px;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-card-content{
        min-height: 430px;
    }
}

@media (max-width: 599px) {
    .community-jobs-page[b-yw6riuv7is]  .community-hero{
        border-radius: 22px;
    }

    .community-jobs-page[b-yw6riuv7is]  .hero-tags{
        display: grid;
        gap: 9px;
    }

    .community-jobs-page[b-yw6riuv7is]  .summary-card{
        align-items: flex-start;
        flex-direction: column;
        min-height: 150px;
        padding: 17px;
    }

    .community-jobs-page[b-yw6riuv7is]  .summary-icon{
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .community-jobs-page[b-yw6riuv7is]  .filter-panel,
.community-jobs-page[b-yw6riuv7is]  .editor-panel,
.community-jobs-page[b-yw6riuv7is]  .detail-panel{
        padding: 18px 15px;
        border-radius: 20px;
    }

    .community-jobs-page[b-yw6riuv7is]  .section-heading{
        align-items: flex-start;
    }

    .community-jobs-page[b-yw6riuv7is]  .section-heading-icon{
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .community-jobs-page[b-yw6riuv7is]  .image-preview-box{
        align-items: flex-start;
        flex-direction: column;
    }

    .community-jobs-page[b-yw6riuv7is]  .image-preview-box img{
        width: 100%;
        height: 180px;
    }

    .community-jobs-page[b-yw6riuv7is]  .editor-actions{
        flex-direction: column-reverse;
    }

    .community-jobs-page[b-yw6riuv7is]  .editor-actions .mud-button-root{
        width: 100%;
    }

    .community-jobs-page[b-yw6riuv7is]  .detail-info-grid{
        grid-template-columns: 1fr;
    }

    .community-jobs-page[b-yw6riuv7is]  .detail-actions{
        flex-direction: column;
    }

    .community-jobs-page[b-yw6riuv7is]  .detail-actions .mud-button-root{
        width: 100%;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-image-wrap{
        height: 205px;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-card-content{
        min-height: auto;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-title{
        min-height: auto;
    }

    .community-jobs-page[b-yw6riuv7is]  .applicant-row{
        align-items: flex-start;
        flex-direction: column;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-actions{
        gap: 5px;
    }
}

@media (min-width: 1800px) {
    .community-jobs-page[b-yw6riuv7is]{
        max-width: 1840px;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-card-content{
        min-height: 480px;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-title{
        font-size: 1.48rem;
    }

    .community-jobs-page[b-yw6riuv7is]  .job-description,
.community-jobs-page[b-yw6riuv7is]  .detail-description,
.community-jobs-page[b-yw6riuv7is]  .large-input input,
.community-jobs-page[b-yw6riuv7is]  .large-input textarea,
.community-jobs-page[b-yw6riuv7is]  .large-input .mud-select-input{
        font-size: 1.12rem;
    }
}
/* /Components/Pages/04News/Announcements.razor.rz.scp.css */
/*
   Scoped CSS fix for MudBlazor components.
   MudBlazor renders component roots outside the page's CSS-isolation scope attribute,
   so all descendant selectors are routed through .announcements-page ::deep.
*/

.announcements-page[b-z1ssaaar48] {
    --green-950: #07382c;
    --green-900: #0a4b3a;
    --green-800: #0d6049;
    --green-700: #0f7558;
    --green-100: #dcf5e9;
    --green-50: #effbf6;
    --gold-500: #c79226;
    --gold-100: #fff1ce;
    --blue-100: #e4f1ff;
    --red-100: #ffe8e8;
    --purple-100: #efe9ff;
    --ink-900: #17312a;
    --ink-700: #415c54;
    --ink-500: #6a817a;
    --line: #dce8e3;
    --surface: #ffffff;
    min-height: 100%;
    padding: 22px;
    background:
        radial-gradient(circle at 4% 8%, rgba(15, 117, 88, .09), transparent 28%),
        radial-gradient(circle at 96% 18%, rgba(199, 146, 38, .08), transparent 24%),
        var(--theme-bg);
    color: var(--ink-900);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
}

.announcements-page[b-z1ssaaar48]  .announcement-hero {
    position: relative;
    overflow: hidden;
    padding: 40px;
    border-radius: 28px;
    color: #fff;
    background: linear-gradient(135deg, #07382c 0%, #0a5843 50%, #0f7558 100%);
    box-shadow: 0 22px 55px rgba(7, 56, 44, .23);
}

.announcements-page[b-z1ssaaar48]  .hero-pattern {
    position: absolute;
    inset: 0;
    opacity: .16;
    background-image:
        linear-gradient(30deg, rgba(255,255,255,.14) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.14) 87.5%),
        linear-gradient(150deg, rgba(255,255,255,.14) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.14) 87.5%);
    background-size: 44px 76px;
}

.announcements-page[b-z1ssaaar48]  .hero-glow {
    position: absolute;
    border-radius: 999px;
    filter: blur(2px);
    pointer-events: none;
}

.announcements-page[b-z1ssaaar48]  .hero-glow-one {
    width: 330px;
    height: 330px;
    top: -190px;
    right: 18%;
    background: rgba(255, 223, 141, .18);
}

.announcements-page[b-z1ssaaar48]  .hero-glow-two {
    width: 280px;
    height: 280px;
    right: -90px;
    bottom: -170px;
    background: rgba(104, 230, 185, .22);
}

.announcements-page[b-z1ssaaar48]  .announcement-hero .mud-grid,
.announcements-page[b-z1ssaaar48]  .announcement-hero .mud-grid-item {
    position: relative;
    z-index: 2;
}

.announcements-page[b-z1ssaaar48]  .hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    margin-bottom: 18px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: .01em;
    backdrop-filter: blur(8px);
}

.announcements-page[b-z1ssaaar48]  .hero-title {
    margin-bottom: 10px !important;
    color: #fff !important;
    font-family: "Kanit", sans-serif !important;
    font-size: clamp(2.35rem, 4vw, 4.2rem) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
}

.announcements-page[b-z1ssaaar48]  .hero-description {
    max-width: 850px;
    color: rgba(255,255,255,.88) !important;
    font-size: 1.18rem !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
}

.announcements-page[b-z1ssaaar48]  .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 24px;
}

.announcements-page[b-z1ssaaar48]  .hero-benefits span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 1.04rem;
    font-weight: 500;
}

.announcements-page[b-z1ssaaar48]  .hero-action-card {
    padding: 26px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 23px;
    background: rgba(255,255,255,.95);
    color: var(--ink-900);
    box-shadow: 0 22px 46px rgba(2, 37, 28, .24);
    backdrop-filter: blur(12px);
}

.announcements-page[b-z1ssaaar48]  .hero-action-icon {
    display: grid;
    width: 66px;
    height: 66px;
    margin-bottom: 16px;
    place-items: center;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, var(--gold-500), #e0b54f);
    box-shadow: 0 12px 24px rgba(199, 146, 38, .28);
}

.announcements-page[b-z1ssaaar48]  .hero-action-icon .mud-icon-root {
    font-size: 2.1rem;
}

.announcements-page[b-z1ssaaar48]  .hero-action-title {
    color: var(--ink-900) !important;
    font-weight: 750 !important;
}

.announcements-page[b-z1ssaaar48]  .hero-action-text {
    margin: 7px 0 18px !important;
    color: var(--ink-700) !important;
    font-size: 1.04rem !important;
    line-height: 1.65 !important;
}

.announcements-page[b-z1ssaaar48]  .hero-create-button {
    width: 100%;
    min-height: 50px;
    border-radius: 14px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
    font-size: 1.06rem !important;
    font-weight: 650 !important;
    box-shadow: 0 10px 24px rgba(10, 75, 58, .22) !important;
}

.announcements-page[b-z1ssaaar48]  .summary-grid {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

.announcements-page[b-z1ssaaar48]  .summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 118px;
    padding: 20px;
    border: 1px solid rgba(13, 96, 73, .10);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(19, 57, 47, .07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.announcements-page[b-z1ssaaar48]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(19, 57, 47, .11);
}

.announcements-page[b-z1ssaaar48]  .summary-icon {
    display: grid;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    place-items: center;
    border-radius: 17px;
}

.announcements-page[b-z1ssaaar48]  .summary-icon .mud-icon-root {
    font-size: 1.85rem;
}

.announcements-page[b-z1ssaaar48]  .summary-green .summary-icon { color: #087252; background: var(--green-100); }

.announcements-page[b-z1ssaaar48]  .summary-blue .summary-icon { color: #2366a5; background: var(--blue-100); }

.announcements-page[b-z1ssaaar48]  .summary-red .summary-icon { color: #c43e44; background: var(--red-100); }

.announcements-page[b-z1ssaaar48]  .summary-gold .summary-icon { color: #9b6a0f; background: var(--gold-100); }

.announcements-page[b-z1ssaaar48]  .summary-value {
    color: var(--ink-900) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
}

.announcements-page[b-z1ssaaar48]  .summary-label {
    margin-top: 4px !important;
    color: var(--ink-700) !important;
    font-size: 1.05rem !important;
    font-weight: 550 !important;
}

.announcements-page[b-z1ssaaar48]  .editor-panel,
.announcements-page[b-z1ssaaar48]  .detail-panel,
.announcements-page[b-z1ssaaar48]  .content-panel {
    margin-top: 22px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: 0 16px 40px rgba(21, 62, 52, .08);
}

.announcements-page[b-z1ssaaar48]  .editor-panel {
    padding: 28px;
}

.announcements-page[b-z1ssaaar48]  .section-heading {
    display: flex;
    align-items: center;
    gap: 15px;
}

.announcements-page[b-z1ssaaar48]  .section-icon {
    display: grid;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(145deg, var(--green-900), var(--green-700));
    box-shadow: 0 10px 22px rgba(10, 75, 58, .18);
}

.announcements-page[b-z1ssaaar48]  .section-icon .mud-icon-root {
    font-size: 1.8rem;
}

.announcements-page[b-z1ssaaar48]  .section-title-wrap {
    flex: 1;
    min-width: 0;
}

.announcements-page[b-z1ssaaar48]  .section-title,
.announcements-page[b-z1ssaaar48]  .content-title {
    color: var(--ink-900) !important;
    font-family: "Kanit", sans-serif !important;
    font-weight: 750 !important;
}

.announcements-page[b-z1ssaaar48]  .section-subtitle,
.announcements-page[b-z1ssaaar48]  .content-subtitle {
    margin-top: 3px !important;
    color: var(--ink-500) !important;
    font-size: 1.04rem !important;
    line-height: 1.6 !important;
}

.announcements-page[b-z1ssaaar48]  .close-button {
    color: var(--ink-500) !important;
    background: #f0f5f3 !important;
}

.announcements-page[b-z1ssaaar48]  .section-divider {
    margin: 22px 0 26px !important;
    border-color: var(--line) !important;
}

.announcements-page[b-z1ssaaar48]  .large-input .mud-input-control-input-container {
    min-height: 58px;
}

.announcements-page[b-z1ssaaar48]  .large-input .mud-input-label {
    color: #506b62;
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 520;
}

.announcements-page[b-z1ssaaar48]  .large-input input,
.announcements-page[b-z1ssaaar48]  .large-input textarea,
.announcements-page[b-z1ssaaar48]  .large-input .mud-select-input {
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
    font-size: 1.08rem;
    line-height: 1.65;
}

.announcements-page[b-z1ssaaar48]  .large-input .mud-input-outlined-border {
    border-color: #c9d9d3;
    border-radius: 13px;
}

.announcements-page[b-z1ssaaar48]  .large-input:hover .mud-input-outlined-border {
    border-color: #76a995;
}

.announcements-page[b-z1ssaaar48]  .large-input.mud-input-control > .mud-input-control-input-container > .mud-input.mud-input-outlined:focus-within .mud-input-outlined-border {
    border-color: var(--green-700);
    border-width: 2px;
}

.announcements-page[b-z1ssaaar48]  .title-input input {
    font-size: 1.18rem;
    font-weight: 600;
}

.announcements-page[b-z1ssaaar48]  .summary-input textarea,
.announcements-page[b-z1ssaaar48]  .content-input textarea {
    line-height: 1.85;
}

.announcements-page[b-z1ssaaar48]  .switch-box {
    display: flex;
    min-height: 58px;
    padding: 0 15px;
    align-items: center;
    border: 1px solid #c9d9d3;
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.announcements-page[b-z1ssaaar48]  .switch-box .mud-switch-label {
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 550;
}

.announcements-page[b-z1ssaaar48]  .image-upload-card {
    height: 100%;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.announcements-page[b-z1ssaaar48]  .upload-preview {
    position: relative;
    display: flex;
    height: 250px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    overflow: hidden;
    border: 2px dashed #b9d0c7;
    border-radius: 15px;
    background-color: #edf5f2;
    background-position: center;
    background-size: cover;
}

.announcements-page[b-z1ssaaar48]  .upload-preview.has-preview {
    border-style: solid;
    border-color: #aac8bc;
}

.announcements-page[b-z1ssaaar48]  .upload-preview.has-preview::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(6, 47, 36, .22), transparent 55%);
}

.announcements-page[b-z1ssaaar48]  .upload-preview.has-preview .upload-placeholder-icon,
.announcements-page[b-z1ssaaar48]  .upload-preview.has-preview .upload-placeholder-text {
    display: none;
}

.announcements-page[b-z1ssaaar48]  .upload-placeholder-icon {
    color: #79a394 !important;
    font-size: 3rem !important;
}

.announcements-page[b-z1ssaaar48]  .upload-placeholder-text {
    color: #65877b;
    font-size: 1.05rem;
    font-weight: 550;
}

.announcements-page[b-z1ssaaar48]  .file-picker-button,
.announcements-page[b-z1ssaaar48]  .document-picker-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 600;
}

.announcements-page[b-z1ssaaar48]  .file-picker-button {
    width: 100%;
    min-height: 48px;
    margin-top: 13px;
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.announcements-page[b-z1ssaaar48]  .file-picker-button input,
.announcements-page[b-z1ssaaar48]  .document-picker-button input {
    display: none;
}

.announcements-page[b-z1ssaaar48]  .upload-note {
    margin-top: 9px;
    color: var(--ink-500);
    font-size: .93rem;
    text-align: center;
}

.announcements-page[b-z1ssaaar48]  .document-upload-box {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 15px;
    border: 1px dashed #abc5bb;
    border-radius: 16px;
    background: var(--green-50);
}

.announcements-page[b-z1ssaaar48]  .document-upload-icon {
    display: grid;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 14px;
    color: #b06e10;
    background: var(--gold-100);
}

.announcements-page[b-z1ssaaar48]  .document-upload-icon .mud-icon-root {
    font-size: 1.75rem;
}

.announcements-page[b-z1ssaaar48]  .document-upload-info {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
}

.announcements-page[b-z1ssaaar48]  .document-upload-info strong {
    color: var(--ink-900);
    font-size: 1.08rem;
}

.announcements-page[b-z1ssaaar48]  .document-upload-info span {
    overflow: hidden;
    color: var(--ink-500);
    font-size: .96rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.announcements-page[b-z1ssaaar48]  .document-picker-button {
    flex: 0 0 auto;
    min-height: 43px;
    padding: 0 15px;
    border: 1px solid #8db4a5;
    border-radius: 12px;
    color: var(--green-900);
    background: #fff;
}

.announcements-page[b-z1ssaaar48]  .editor-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
}

.announcements-page[b-z1ssaaar48]  .cancel-button,
.announcements-page[b-z1ssaaar48]  .save-button {
    min-width: 150px;
    min-height: 49px;
    border-radius: 13px !important;
    font-size: 1.04rem !important;
    font-weight: 650 !important;
}

.announcements-page[b-z1ssaaar48]  .cancel-button {
    border-color: #afc3bb !important;
    color: var(--ink-700) !important;
}

.announcements-page[b-z1ssaaar48]  .save-button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
    box-shadow: 0 10px 24px rgba(10, 75, 58, .18) !important;
}

.announcements-page[b-z1ssaaar48]  .detail-panel {
    overflow: hidden;
}

.announcements-page[b-z1ssaaar48]  .detail-cover {
    position: relative;
    min-height: 310px;
    padding: 34px;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
}

.announcements-page[b-z1ssaaar48]  .detail-cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, rgba(5, 39, 30, .95), rgba(5, 39, 30, .64) 62%, rgba(5, 39, 30, .24));
}

.announcements-page[b-z1ssaaar48]  .detail-cover-content {
    position: relative;
    z-index: 2;
    max-width: 950px;
}

.announcements-page[b-z1ssaaar48]  .detail-type {
    display: inline-flex;
    margin-left: 8px;
    padding: 6px 12px;
    border: 1px solid rgba(255,255,255,.32);
    border-radius: 999px;
    color: #fff;
    background: rgba(255,255,255,.14);
    font-size: .95rem;
    font-weight: 550;
}

.announcements-page[b-z1ssaaar48]  .detail-title {
    margin-top: 20px !important;
    color: #fff !important;
    font-family: "Kanit", sans-serif !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
}

.announcements-page[b-z1ssaaar48]  .detail-document-number {
    margin-top: 11px !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 1.08rem !important;
}

.announcements-page[b-z1ssaaar48]  .detail-close-button {
    position: absolute !important;
    z-index: 3;
    top: 20px;
    right: 20px;
    color: #fff !important;
    background: rgba(0,0,0,.24) !important;
    backdrop-filter: blur(7px);
}

.announcements-page[b-z1ssaaar48]  .detail-body {
    padding: 30px;
}

.announcements-page[b-z1ssaaar48]  .detail-section-title {
    color: var(--green-900) !important;
    font-weight: 700 !important;
}

.announcements-page[b-z1ssaaar48]  .detail-content-heading {
    margin-top: 28px !important;
}

.announcements-page[b-z1ssaaar48]  .detail-summary {
    margin-top: 9px !important;
    color: var(--ink-700) !important;
    font-size: 1.13rem !important;
    line-height: 1.85 !important;
}

.announcements-page[b-z1ssaaar48]  .detail-content-text {
    margin-top: 10px;
    color: #314a43;
    font-size: 1.08rem;
    line-height: 1.95;
    white-space: pre-line;
}

.announcements-page[b-z1ssaaar48]  .detail-info-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.announcements-page[b-z1ssaaar48]  .detail-info-row {
    display: flex;
    gap: 13px;
    padding: 16px;
    border-bottom: 1px solid #e4ece9;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row:last-child {
    border-bottom: 0;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row > .mud-icon-root {
    flex: 0 0 auto;
    color: var(--green-700);
    font-size: 1.4rem;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row span {
    color: var(--ink-500);
    font-size: .92rem;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row strong {
    color: var(--ink-900);
    font-size: 1.05rem;
    font-weight: 650;
}

.announcements-page[b-z1ssaaar48]  .detail-info-row small {
    color: var(--ink-500);
    font-size: .91rem;
}

.announcements-page[b-z1ssaaar48]  .download-document-button {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: 15px;
    padding: 16px;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(10, 75, 58, .17);
}

.announcements-page[b-z1ssaaar48]  .download-document-button > .mud-icon-root {
    font-size: 1.8rem;
}

.announcements-page[b-z1ssaaar48]  .download-document-button span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.announcements-page[b-z1ssaaar48]  .download-document-button strong {
    font-size: 1.04rem;
}

.announcements-page[b-z1ssaaar48]  .download-document-button small {
    overflow: hidden;
    color: rgba(255,255,255,.75);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.announcements-page[b-z1ssaaar48]  .detail-tags {
    margin-top: 25px;
}

.announcements-page[b-z1ssaaar48]  .content-panel {
    padding: 28px;
}

.announcements-page[b-z1ssaaar48]  .content-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.announcements-page[b-z1ssaaar48]  .content-count {
    flex: 0 0 auto;
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--green-900);
    background: var(--green-100);
    font-size: 1rem;
    font-weight: 650;
}

.announcements-page[b-z1ssaaar48]  .filter-grid {
    padding: 18px 16px 8px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.announcements-page[b-z1ssaaar48]  .loading-state,
.announcements-page[b-z1ssaaar48]  .empty-state {
    display: flex;
    min-height: 330px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-align: center;
    color: var(--ink-500);
}

.announcements-page[b-z1ssaaar48]  .empty-icon {
    display: grid;
    width: 78px;
    height: 78px;
    place-items: center;
    border-radius: 22px;
    color: #6b9787;
    background: var(--green-100);
}

.announcements-page[b-z1ssaaar48]  .empty-icon .mud-icon-root {
    font-size: 2.4rem;
}

.announcements-page[b-z1ssaaar48]  .cards-grid {
    margin-top: 8px !important;
}

.announcements-page[b-z1ssaaar48]  .announcement-card {
    display: grid;
    height: 100%;
    grid-template-columns: 205px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(21, 62, 52, .065);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.announcements-page[b-z1ssaaar48]  .announcement-card:hover {
    transform: translateY(-3px);
    border-color: #b8d2c8;
    box-shadow: 0 18px 36px rgba(21, 62, 52, .11);
}

.announcements-page[b-z1ssaaar48]  .card-cover {
    position: relative;
    min-height: 100%;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
}

.announcements-page[b-z1ssaaar48]  .card-cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(6,45,34,.25), rgba(6,45,34,.78));
}

.announcements-page[b-z1ssaaar48]  .card-top-badges {
    position: absolute;
    z-index: 2;
    top: 13px;
    left: 13px;
    right: 13px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.announcements-page[b-z1ssaaar48]  .type-badge,
.announcements-page[b-z1ssaaar48]  .pinned-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 650;
}

.announcements-page[b-z1ssaaar48]  .type-badge {
    color: var(--green-950);
    background: rgba(255,255,255,.92);
}

.announcements-page[b-z1ssaaar48]  .pinned-badge {
    color: #6d4800;
    background: rgba(255, 232, 164, .95);
}

.announcements-page[b-z1ssaaar48]  .card-cover-icon {
    position: absolute;
    z-index: 2;
    left: 50%;
    bottom: 24px;
    display: grid;
    width: 70px;
    height: 70px;
    place-items: center;
    transform: translateX(-50%);
    border: 1px solid rgba(255,255,255,.30);
    border-radius: 20px;
    color: #fff;
    background: rgba(255,255,255,.15);
    backdrop-filter: blur(8px);
}

.announcements-page[b-z1ssaaar48]  .card-cover-icon .mud-icon-root {
    font-size: 2.2rem;
}

.announcements-page[b-z1ssaaar48]  .card-content {
    display: flex;
    min-width: 0;
    padding: 20px;
    flex-direction: column;
}

.announcements-page[b-z1ssaaar48]  .card-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.announcements-page[b-z1ssaaar48]  .status-badge,
.announcements-page[b-z1ssaaar48]  .priority-badge {
    display: inline-flex;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 650;
}

.announcements-page[b-z1ssaaar48]  .status-published { color: #087252; background: #dcf5e9; }

.announcements-page[b-z1ssaaar48]  .status-draft { color: #675276; background: #f0eafd; }

.announcements-page[b-z1ssaaar48]  .status-scheduled { color: #24608d; background: #e4f1ff; }

.announcements-page[b-z1ssaaar48]  .status-archived { color: #68756f; background: #edf1ef; }

.announcements-page[b-z1ssaaar48]  .priority-normal { color: #53665f; background: #edf2f0; }

.announcements-page[b-z1ssaaar48]  .priority-important { color: #976309; background: #fff0ca; }

.announcements-page[b-z1ssaaar48]  .priority-urgent { color: #bd343b; background: #ffe5e6; }

.announcements-page[b-z1ssaaar48]  .document-date {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    color: var(--ink-500);
    font-size: .91rem;
}

.announcements-page[b-z1ssaaar48]  .document-number {
    margin-top: 14px;
    color: var(--green-700);
    font-size: .96rem;
    font-weight: 650;
}

.announcements-page[b-z1ssaaar48]  .card-title {
    display: -webkit-box;
    overflow: hidden;
    margin: 7px 0 8px;
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
    font-size: 1.27rem;
    font-weight: 700;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.announcements-page[b-z1ssaaar48]  .card-summary {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: var(--ink-700);
    font-size: 1rem;
    line-height: 1.72;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.announcements-page[b-z1ssaaar48]  .card-owner {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 15px;
    padding: 10px 12px;
    border-radius: 13px;
    background: var(--theme-bg);
}

.announcements-page[b-z1ssaaar48]  .owner-icon {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    color: var(--green-700);
    background: var(--green-100);
}

.announcements-page[b-z1ssaaar48]  .card-owner div:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.announcements-page[b-z1ssaaar48]  .card-owner span {
    color: var(--ink-500);
    font-size: .84rem;
}

.announcements-page[b-z1ssaaar48]  .card-owner strong {
    overflow: hidden;
    color: var(--ink-900);
    font-size: .98rem;
    font-weight: 620;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.announcements-page[b-z1ssaaar48]  .tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 13px;
}

.announcements-page[b-z1ssaaar48]  .tag-item {
    padding: 4px 9px;
    border: 1px solid #d9e7e2;
    border-radius: 999px;
    color: #4d6d62;
    background: #fafcfb;
    font-size: .84rem;
}

.announcements-page[b-z1ssaaar48]  .card-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 15px;
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid #e6eeeb;
    color: var(--ink-500);
    font-size: .88rem;
}

.announcements-page[b-z1ssaaar48]  .card-stats span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.announcements-page[b-z1ssaaar48]  .card-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: auto;
    padding-top: 17px;
}

.announcements-page[b-z1ssaaar48]  .view-button,
.announcements-page[b-z1ssaaar48]  .document-button {
    min-height: 42px;
    border-radius: 11px !important;
    font-size: .96rem !important;
    font-weight: 600 !important;
}

.announcements-page[b-z1ssaaar48]  .view-button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
}

.announcements-page[b-z1ssaaar48]  .document-button {
    border-color: #9dbbad !important;
    color: var(--green-900) !important;
}

.announcements-page[b-z1ssaaar48]  .action-icon-button {
    width: 40px !important;
    height: 40px !important;
    border-radius: 11px !important;
}

.announcements-page[b-z1ssaaar48]  .edit-action { color: #336a8b !important; background: #e7f3fb !important; }

.announcements-page[b-z1ssaaar48]  .publish-action { color: #087252 !important; background: #dcf5e9 !important; }

.announcements-page[b-z1ssaaar48]  .archive-action { color: #6a5d44 !important; background: #f2ede3 !important; }

.announcements-page[b-z1ssaaar48]  .delete-action { color: #bc3a40 !important; background: #ffe8e8 !important; }

@media (max-width: 1199px) {
.announcements-page[b-z1ssaaar48]  .announcement-card {
        grid-template-columns: 180px minmax(0, 1fr);
    }
}

@media (max-width: 959px) {
.announcements-page[b-z1ssaaar48] {
        padding: 14px;
    }

.announcements-page[b-z1ssaaar48]  .announcement-hero {
        padding: 28px;
        border-radius: 22px;
    }

.announcements-page[b-z1ssaaar48]  .editor-panel,
.announcements-page[b-z1ssaaar48]  .content-panel,
.announcements-page[b-z1ssaaar48]  .detail-body {
        padding: 21px;
    }

.announcements-page[b-z1ssaaar48]  .announcement-card {
        grid-template-columns: 190px minmax(0, 1fr);
    }
}

@media (max-width: 700px) {
.announcements-page[b-z1ssaaar48] {
        padding: 9px;
    }

.announcements-page[b-z1ssaaar48]  .announcement-hero {
        padding: 24px 19px;
        border-radius: 19px;
    }

.announcements-page[b-z1ssaaar48]  .hero-title {
        font-size: 2.3rem !important;
    }

.announcements-page[b-z1ssaaar48]  .hero-description {
        font-size: 1.04rem !important;
    }

.announcements-page[b-z1ssaaar48]  .summary-card {
        min-height: 104px;
        padding: 14px;
        gap: 11px;
    }

.announcements-page[b-z1ssaaar48]  .summary-icon {
        flex-basis: 50px;
        width: 50px;
        height: 50px;
        border-radius: 14px;
    }

.announcements-page[b-z1ssaaar48]  .summary-value {
        font-size: 1.75rem !important;
    }

.announcements-page[b-z1ssaaar48]  .summary-label {
        font-size: .94rem !important;
    }

.announcements-page[b-z1ssaaar48]  .editor-panel,
.announcements-page[b-z1ssaaar48]  .content-panel,
.announcements-page[b-z1ssaaar48]  .detail-body {
        padding: 16px;
        border-radius: 18px;
    }

.announcements-page[b-z1ssaaar48]  .section-heading {
        align-items: flex-start;
    }

.announcements-page[b-z1ssaaar48]  .section-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

.announcements-page[b-z1ssaaar48]  .section-title {
        font-size: 1.55rem !important;
    }

.announcements-page[b-z1ssaaar48]  .document-upload-box {
        align-items: flex-start;
        flex-wrap: wrap;
    }

.announcements-page[b-z1ssaaar48]  .document-picker-button {
        width: 100%;
    }

.announcements-page[b-z1ssaaar48]  .editor-actions {
        flex-direction: column-reverse;
    }

.announcements-page[b-z1ssaaar48]  .cancel-button,
.announcements-page[b-z1ssaaar48]  .save-button {
        width: 100%;
    }

.announcements-page[b-z1ssaaar48]  .content-header {
        flex-direction: column;
    }

.announcements-page[b-z1ssaaar48]  .announcement-card {
        display: block;
    }

.announcements-page[b-z1ssaaar48]  .card-cover {
        min-height: 210px;
    }

.announcements-page[b-z1ssaaar48]  .card-cover-icon {
        bottom: 20px;
    }

.announcements-page[b-z1ssaaar48]  .document-date {
        width: 100%;
        margin-left: 0;
    }

.announcements-page[b-z1ssaaar48]  .card-actions {
        flex-wrap: wrap;
    }

.announcements-page[b-z1ssaaar48]  .view-button,
.announcements-page[b-z1ssaaar48]  .document-button {
        flex: 1 1 130px;
    }

.announcements-page[b-z1ssaaar48]  .detail-cover {
        min-height: 350px;
        padding: 25px 18px;
    }

.announcements-page[b-z1ssaaar48]  .detail-title {
        font-size: 1.75rem !important;
    }
}

@media (min-width: 1800px) {
.announcements-page[b-z1ssaaar48] {
        padding: 28px 34px;
    }

.announcements-page[b-z1ssaaar48]  .announcement-hero,
.announcements-page[b-z1ssaaar48]  .editor-panel,
.announcements-page[b-z1ssaaar48]  .content-panel,
.announcements-page[b-z1ssaaar48]  .detail-panel {
        max-width: 1900px;
        margin-left: auto;
        margin-right: auto;
    }

.announcements-page[b-z1ssaaar48]  .summary-grid {
        max-width: 1900px;
        margin-left: auto !important;
        margin-right: auto !important;
    }

.announcements-page[b-z1ssaaar48]  .large-input input,
.announcements-page[b-z1ssaaar48]  .large-input textarea,
.announcements-page[b-z1ssaaar48]  .large-input .mud-select-input {
        font-size: 1.16rem;
    }

.announcements-page[b-z1ssaaar48]  .card-title {
        font-size: 1.37rem;
    }

.announcements-page[b-z1ssaaar48]  .card-summary,
.announcements-page[b-z1ssaaar48]  .detail-content-text {
        font-size: 1.12rem;
    }
}
/* /Components/Pages/04News/Banners.razor.rz.scp.css */
.banners-page[b-f1w2gae9nr] {
    --green-950: #06382e;
    --green-900: #074b3b;
    --green-800: #096149;
    --green-700: #0d7858;
    --green-600: #11906a;
    --green-100: #dcf4ea;
    --green-50: #f2fbf7;
    --gold-600: #bd8618;
    --gold-500: #d7a22d;
    --gold-100: #fff0c5;
    --blue-100: #e2efff;
    --purple-100: #eee7ff;
    --red-100: #ffe5e7;
    --gray-100: #eef2f0;
    --ink-950: #13251f;
    --ink-900: #23352f;
    --ink-700: #52655e;
    --ink-500: var(--theme-muted);
    --line: #dce8e3;
    --surface: #ffffff;
    width: 100%;
    padding: 8px 2px 44px;
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
}

.banners-page[b-f1w2gae9nr]  .mud-typography-root,
.banners-page[b-f1w2gae9nr]  .mud-input,
.banners-page[b-f1w2gae9nr]  .mud-input-label,
.banners-page[b-f1w2gae9nr]  .mud-button-label,
.banners-page[b-f1w2gae9nr]  .mud-chip-content,
.banners-page[b-f1w2gae9nr]  .mud-picker,
.banners-page[b-f1w2gae9nr]  .mud-switch-label {
    font-family: "Kanit", sans-serif !important;
}

.banners-page[b-f1w2gae9nr]  .banner-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(29px, 4.2vw, 56px);
    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 29px;
    color: #fff;
    background:
        radial-gradient(circle at 83% 4%, rgba(255, 226, 145, .24), transparent 25%),
        linear-gradient(124deg, rgba(4, 51, 40, .99), rgba(8, 95, 70, .97) 57%, rgba(12, 126, 91, .93));
    box-shadow: 0 24px 58px rgba(4, 53, 40, .22);
}

.banners-page[b-f1w2gae9nr]  .hero-grid-pattern {
    position: absolute;
    inset: 0;
    opacity: .15;
    background-image:
        linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to left, #000, transparent 73%);
    pointer-events: none;
}

.banners-page[b-f1w2gae9nr]  .hero-glow {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.banners-page[b-f1w2gae9nr]  .hero-glow-one {
    top: -125px;
    right: 19%;
    width: 290px;
    height: 290px;
    background: rgba(255, 226, 143, .18);
}

.banners-page[b-f1w2gae9nr]  .hero-glow-two {
    right: -105px;
    bottom: -155px;
    width: 355px;
    height: 355px;
    background: rgba(255, 255, 255, .09);
}

.banners-page[b-f1w2gae9nr]  .banner-hero .mud-grid,
.banners-page[b-f1w2gae9nr]  .banner-hero .mud-grid-item {
    position: relative;
    z-index: 2;
}

.banners-page[b-f1w2gae9nr]  .hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    margin-bottom: 17px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 1.08rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}

.banners-page[b-f1w2gae9nr]  .hero-title {
    margin-bottom: 11px !important;
    color: #fff !important;
    font-size: clamp(2.35rem, 4vw, 4.15rem) !important;
    font-weight: 800 !important;
    line-height: 1.13 !important;
    letter-spacing: -.02em;
}

.banners-page[b-f1w2gae9nr]  .hero-description {
    max-width: 940px;
    color: rgba(255, 255, 255, .90) !important;
    font-size: 1.2rem !important;
    font-weight: 400 !important;
    line-height: 1.78 !important;
}

.banners-page[b-f1w2gae9nr]  .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 21px;
    margin-top: 24px;
}

.banners-page[b-f1w2gae9nr]  .hero-benefits span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 500;
}

.banners-page[b-f1w2gae9nr]  .hero-action-card {
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 25px;
    background: rgba(255, 255, 255, .97);
    color: var(--ink-900);
    box-shadow: 0 22px 50px rgba(2, 39, 29, .29);
    backdrop-filter: blur(14px);
}

.banners-page[b-f1w2gae9nr]  .hero-action-icon {
    display: grid;
    width: 70px;
    height: 70px;
    margin-bottom: 18px;
    place-items: center;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(145deg, var(--gold-500), #e3b94b);
    box-shadow: 0 13px 28px rgba(201, 146, 27, .32);
}

.banners-page[b-f1w2gae9nr]  .hero-action-icon .mud-icon-root {
    font-size: 2.22rem;
}

.banners-page[b-f1w2gae9nr]  .hero-action-title {
    color: var(--ink-950) !important;
    font-size: 1.44rem !important;
    font-weight: 750 !important;
}

.banners-page[b-f1w2gae9nr]  .hero-action-text {
    margin: 7px 0 19px !important;
    color: var(--ink-700) !important;
    font-size: 1.06rem !important;
    line-height: 1.66 !important;
}

.banners-page[b-f1w2gae9nr]  .hero-create-button,
.banners-page[b-f1w2gae9nr]  .primary-button {
    min-height: 52px;
    border-radius: 14px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
    font-size: 1.08rem !important;
    font-weight: 650 !important;
    box-shadow: 0 10px 25px rgba(9, 77, 58, .23) !important;
}

.banners-page[b-f1w2gae9nr]  .hero-create-button {
    width: 100%;
}

.banners-page[b-f1w2gae9nr]  .summary-grid {
    margin-top: 6px !important;
    margin-bottom: 5px !important;
}

.banners-page[b-f1w2gae9nr]  .summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 122px;
    padding: 21px;
    border: 1px solid rgba(13, 96, 73, .10);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 12px 31px rgba(19, 57, 47, .075);
    transition: transform .18s ease, box-shadow .18s ease;
}

.banners-page[b-f1w2gae9nr]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 39px rgba(19, 57, 47, .12);
}

.banners-page[b-f1w2gae9nr]  .summary-icon {
    display: grid;
    flex: 0 0 61px;
    width: 61px;
    height: 61px;
    place-items: center;
    border-radius: 18px;
}

.banners-page[b-f1w2gae9nr]  .summary-icon .mud-icon-root {
    font-size: 1.88rem;
}

.banners-page[b-f1w2gae9nr]  .summary-green .summary-icon { color: var(--theme-primary); background: var(--green-100); }
.banners-page[b-f1w2gae9nr]  .summary-blue .summary-icon { color: #2467a7; background: var(--blue-100); }
.banners-page[b-f1w2gae9nr]  .summary-purple .summary-icon { color: #7144aa; background: var(--purple-100); }
.banners-page[b-f1w2gae9nr]  .summary-gold .summary-icon { color: #99670e; background: var(--gold-100); }

.banners-page[b-f1w2gae9nr]  .summary-value {
    color: var(--ink-950) !important;
    font-weight: 800 !important;
    line-height: 1.03 !important;
}

.banners-page[b-f1w2gae9nr]  .summary-label {
    margin-top: 5px !important;
    color: var(--ink-700) !important;
    font-size: 1.06rem !important;
    font-weight: 550 !important;
}

.banners-page[b-f1w2gae9nr]  .editor-panel,
.banners-page[b-f1w2gae9nr]  .detail-panel,
.banners-page[b-f1w2gae9nr]  .showcase-panel,
.banners-page[b-f1w2gae9nr]  .insight-panel,
.banners-page[b-f1w2gae9nr]  .content-panel {
    border: 1px solid var(--line);
    border-radius: 25px;
    background: var(--surface);
    box-shadow: 0 16px 43px rgba(21, 62, 52, .085);
}

.banners-page[b-f1w2gae9nr]  .editor-panel,
.banners-page[b-f1w2gae9nr]  .detail-panel {
    margin-top: 23px;
}

.banners-page[b-f1w2gae9nr]  .editor-panel {
    padding: 30px;
}

.banners-page[b-f1w2gae9nr]  .section-heading {
    display: flex;
    align-items: center;
    gap: 16px;
}

.banners-page[b-f1w2gae9nr]  .section-icon {
    display: grid;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    place-items: center;
    border-radius: 18px;
}

.banners-page[b-f1w2gae9nr]  .section-icon-green {
    color: #fff;
    background: linear-gradient(145deg, var(--green-900), var(--green-700));
    box-shadow: 0 11px 25px rgba(9, 81, 63, .23);
}

.banners-page[b-f1w2gae9nr]  .section-icon .mud-icon-root {
    font-size: 1.9rem;
}

.banners-page[b-f1w2gae9nr]  .section-title-wrap {
    flex: 1;
    min-width: 0;
}

.banners-page[b-f1w2gae9nr]  .section-title,
.banners-page[b-f1w2gae9nr]  .panel-title {
    color: var(--ink-950) !important;
    font-size: clamp(1.58rem, 2vw, 2.05rem) !important;
    font-weight: 780 !important;
}

.banners-page[b-f1w2gae9nr]  .section-subtitle,
.banners-page[b-f1w2gae9nr]  .panel-subtitle {
    margin-top: 3px !important;
    color: var(--ink-700) !important;
    font-size: 1.07rem !important;
    line-height: 1.64 !important;
}

.banners-page[b-f1w2gae9nr]  .close-button {
    color: var(--ink-700) !important;
    background: var(--theme-bg) !important;
}

.banners-page[b-f1w2gae9nr]  .section-divider {
    margin: 23px 0 26px;
    border-color: var(--line) !important;
}

.banners-page[b-f1w2gae9nr]  .large-input .mud-input-control-input-container {
    min-height: 58px;
}

.banners-page[b-f1w2gae9nr]  .large-input .mud-input-slot,
.banners-page[b-f1w2gae9nr]  .large-input input,
.banners-page[b-f1w2gae9nr]  .large-input textarea,
.banners-page[b-f1w2gae9nr]  .large-input .mud-select-input {
    font-size: 1.09rem !important;
    line-height: 1.58 !important;
}

.banners-page[b-f1w2gae9nr]  .large-input .mud-input-label {
    font-size: 1.01rem !important;
    font-weight: 550 !important;
}

.banners-page[b-f1w2gae9nr]  .large-input .mud-input-outlined-border {
    border-color: #cddbd5 !important;
    border-radius: 14px !important;
}

.banners-page[b-f1w2gae9nr]  .large-input:hover .mud-input-outlined-border {
    border-color: var(--green-700) !important;
}

.banners-page[b-f1w2gae9nr]  .title-input input {
    font-weight: 650 !important;
}

.banners-page[b-f1w2gae9nr]  .switch-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 28px;
    padding: 17px 19px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--green-50);
}

.banners-page[b-f1w2gae9nr]  .switch-panel .mud-switch-label {
    font-size: 1.06rem !important;
    font-weight: 550 !important;
}

.banners-page[b-f1w2gae9nr]  .upload-card,
.banners-page[b-f1w2gae9nr]  .attachment-card {
    height: 100%;
    padding: 21px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: linear-gradient(145deg, #fff, #f8fcfa);
}

.banners-page[b-f1w2gae9nr]  .upload-heading {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 16px;
}

.banners-page[b-f1w2gae9nr]  .upload-heading > div:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.banners-page[b-f1w2gae9nr]  .upload-heading strong {
    color: var(--ink-950);
    font-size: 1.13rem;
    font-weight: 700;
}

.banners-page[b-f1w2gae9nr]  .upload-heading span {
    margin-top: 2px;
    color: var(--ink-700);
    font-size: .96rem;
    line-height: 1.5;
}

.banners-page[b-f1w2gae9nr]  .upload-icon {
    display: grid;
    flex: 0 0 49px;
    width: 49px;
    height: 49px;
    place-items: center;
    border-radius: 15px;
    color: #087154;
    background: var(--green-100);
}

.banners-page[b-f1w2gae9nr]  .upload-icon-blue { color: #2769a7; background: var(--blue-100); }
.banners-page[b-f1w2gae9nr]  .upload-icon-gold { color: #93630e; background: var(--gold-100); }

.banners-page[b-f1w2gae9nr]  .upload-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px 17px;
    border: 1px solid rgba(8, 113, 84, .24);
    border-radius: 13px;
    color: #08684e;
    background: var(--green-100);
    font-size: 1.04rem;
    font-weight: 650;
    cursor: pointer;
    transition: transform .16s ease, background .16s ease;
}

.banners-page[b-f1w2gae9nr]  .upload-button:hover {
    transform: translateY(-1px);
    background: #caecdf;
}

.banners-page[b-f1w2gae9nr]  .upload-button-blue {
    color: #255f98;
    border-color: rgba(37, 95, 152, .22);
    background: var(--blue-100);
}

.banners-page[b-f1w2gae9nr]  .upload-button-gold {
    color: #8a5e0d;
    border-color: rgba(138, 94, 13, .22);
    background: var(--gold-100);
}

.banners-page[b-f1w2gae9nr]  .upload-button input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}

.banners-page[b-f1w2gae9nr]  .file-name-text {
    margin: 11px 0 14px !important;
    color: var(--ink-700) !important;
    font-size: 1rem !important;
}

.banners-page[b-f1w2gae9nr]  .path-input {
    margin-top: 5px;
}

.banners-page[b-f1w2gae9nr]  .preview-shell {
    position: relative;
    overflow: hidden;
    min-height: 300px;
    border: 1px solid rgba(7, 75, 59, .12);
    border-radius: 22px;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
    box-shadow: 0 15px 35px rgba(15, 54, 44, .15);
}

.banners-page[b-f1w2gae9nr]  .preview-mobile {
    min-height: 410px;
    max-width: 290px;
    margin: 0 auto;
    border-radius: 28px;
}

.banners-page[b-f1w2gae9nr]  .preview-overlay,
.banners-page[b-f1w2gae9nr]  .detail-preview-overlay,
.banners-page[b-f1w2gae9nr]  .live-preview-overlay,
.banners-page[b-f1w2gae9nr]  .media-cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(2, 35, 27, .88), rgba(2, 35, 27, .47) 58%, rgba(2, 35, 27, .13));
}

.banners-page[b-f1w2gae9nr]  .preview-content {
    position: absolute;
    z-index: 2;
    left: clamp(22px, 4vw, 46px);
    right: 24px;
    bottom: clamp(23px, 4vw, 43px);
    display: flex;
    max-width: 610px;
    flex-direction: column;
    align-items: flex-start;
    color: #fff;
}

.banners-page[b-f1w2gae9nr]  .preview-content-mobile {
    left: 20px;
    right: 20px;
    bottom: 25px;
}

.banners-page[b-f1w2gae9nr]  .preview-label,
.banners-page[b-f1w2gae9nr]  .live-preview-position {
    display: inline-flex;
    margin-bottom: 9px;
    padding: 6px 11px;
    border: 1px solid rgba(255,255,255,.26);
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    font-size: .91rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}

.banners-page[b-f1w2gae9nr]  .preview-content strong {
    font-size: clamp(1.55rem, 3vw, 2.45rem);
    line-height: 1.22;
}

.banners-page[b-f1w2gae9nr]  .preview-content small {
    margin-top: 8px;
    color: rgba(255,255,255,.88);
    font-size: 1.03rem;
    line-height: 1.55;
}

.banners-page[b-f1w2gae9nr]  .preview-button,
.banners-page[b-f1w2gae9nr]  .live-preview-button,
.banners-page[b-f1w2gae9nr]  .detail-action-preview {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    margin-top: 16px;
    padding: 9px 16px;
    border-radius: 12px;
    color: var(--green-950);
    background: #fff;
    font-size: 1rem;
    font-weight: 650;
    box-shadow: 0 8px 20px rgba(1, 33, 25, .18);
}

.banners-page[b-f1w2gae9nr]  .form-actions,
.banners-page[b-f1w2gae9nr]  .detail-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 27px;
}

.banners-page[b-f1w2gae9nr]  .secondary-button {
    min-height: 50px;
    border-color: #b9cbc4 !important;
    border-radius: 14px !important;
    color: var(--ink-900) !important;
    font-size: 1.06rem !important;
    font-weight: 600 !important;
}

.banners-page[b-f1w2gae9nr]  .detail-panel {
    overflow: hidden;
}

.banners-page[b-f1w2gae9nr]  .detail-preview {
    position: relative;
    min-height: 370px;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
}

.banners-page[b-f1w2gae9nr]  .detail-preview-content {
    position: absolute;
    z-index: 2;
    left: clamp(25px, 5vw, 64px);
    right: 60px;
    bottom: clamp(28px, 5vw, 55px);
    max-width: 920px;
    color: #fff;
}

.banners-page[b-f1w2gae9nr]  .detail-chip-row,
.banners-page[b-f1w2gae9nr]  .card-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.banners-page[b-f1w2gae9nr]  .detail-title {
    margin-top: 13px !important;
    color: #fff !important;
    font-size: clamp(2rem, 4vw, 3.55rem) !important;
    font-weight: 790 !important;
    line-height: 1.18 !important;
}

.banners-page[b-f1w2gae9nr]  .detail-subtitle {
    max-width: 820px;
    margin-top: 8px !important;
    color: rgba(255,255,255,.89) !important;
    font-size: 1.17rem !important;
    line-height: 1.65 !important;
}

.banners-page[b-f1w2gae9nr]  .detail-close-button {
    position: absolute;
    z-index: 4;
    top: 18px;
    right: 18px;
    color: #fff !important;
    background: rgba(5, 45, 35, .62) !important;
    backdrop-filter: blur(8px);
}

.banners-page[b-f1w2gae9nr]  .detail-type-chip,
.banners-page[b-f1w2gae9nr]  .media-type-chip {
    color: #fff !important;
    background: rgba(255,255,255,.18) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    backdrop-filter: blur(8px);
}

.banners-page[b-f1w2gae9nr]  .detail-body {
    padding: 29px;
}

.banners-page[b-f1w2gae9nr]  .detail-section-title {
    color: var(--ink-950) !important;
    font-size: 1.36rem !important;
    font-weight: 720 !important;
}

.banners-page[b-f1w2gae9nr]  .detail-description {
    margin-top: 10px !important;
    color: var(--ink-700) !important;
    font-size: 1.07rem !important;
    line-height: 1.78 !important;
}

.banners-page[b-f1w2gae9nr]  .detail-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    margin-top: 21px;
}

.banners-page[b-f1w2gae9nr]  .detail-info-grid > div {
    padding: 14px 15px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.banners-page[b-f1w2gae9nr]  .detail-info-grid span,
.banners-page[b-f1w2gae9nr]  .file-path-label {
    display: block;
    color: var(--ink-500) !important;
    font-size: .94rem !important;
}

.banners-page[b-f1w2gae9nr]  .detail-info-grid strong {
    display: block;
    margin-top: 4px;
    color: var(--ink-900);
    font-size: 1.04rem;
    line-height: 1.5;
}

.banners-page[b-f1w2gae9nr]  .performance-card {
    height: 100%;
    padding: 21px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: linear-gradient(145deg, var(--green-50), #fff);
}

.banners-page[b-f1w2gae9nr]  .performance-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding: 13px 14px;
    border-radius: 13px;
    background: #fff;
}

.banners-page[b-f1w2gae9nr]  .performance-row > div {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--ink-700);
    font-size: 1.01rem;
}

.banners-page[b-f1w2gae9nr]  .performance-row strong {
    color: var(--ink-950);
    font-size: 1.14rem;
}

.banners-page[b-f1w2gae9nr]  .performance-highlight {
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.banners-page[b-f1w2gae9nr]  .performance-highlight > div,
.banners-page[b-f1w2gae9nr]  .performance-highlight strong {
    color: #fff;
}

.banners-page[b-f1w2gae9nr]  .performance-divider {
    margin: 18px 0;
}

.banners-page[b-f1w2gae9nr]  .file-path-value {
    margin: 3px 0 12px !important;
    padding: 9px 11px;
    border-radius: 10px;
    color: var(--ink-700) !important;
    background: #fff;
    font-size: .94rem !important;
    word-break: break-all;
}

.banners-page[b-f1w2gae9nr]  .showcase-grid {
    margin-top: 6px !important;
}

.banners-page[b-f1w2gae9nr]  .showcase-panel,
.banners-page[b-f1w2gae9nr]  .insight-panel {
    height: 100%;
    padding: 25px;
}

.banners-page[b-f1w2gae9nr]  .panel-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 21px;
}

.banners-page[b-f1w2gae9nr]  .device-toggle {
    display: inline-flex;
    gap: 5px;
    padding: 5px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--theme-bg);
}

.banners-page[b-f1w2gae9nr]  .device-toggle-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 42px;
    padding: 8px 13px;
    border: 0;
    border-radius: 10px;
    color: var(--ink-700);
    background: transparent;
    font-family: "Kanit", sans-serif;
    font-size: .98rem;
    font-weight: 600;
    cursor: pointer;
}

.banners-page[b-f1w2gae9nr]  .device-toggle-button.active {
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow: 0 7px 17px rgba(8, 78, 59, .20);
}

.banners-page[b-f1w2gae9nr]  .live-preview-wrap {
    display: flex;
    justify-content: center;
    padding: 13px;
    border: 1px dashed #c7d8d1;
    border-radius: 22px;
    background: #f5f9f7;
}

.banners-page[b-f1w2gae9nr]  .live-preview {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 340px;
    border-radius: 19px;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
    box-shadow: 0 15px 32px rgba(17, 55, 45, .15);
    transition: width .22s ease, min-height .22s ease;
}

.banners-page[b-f1w2gae9nr]  .live-preview-wrap-mobile .live-preview {
    width: min(100%, 325px);
    min-height: 510px;
    border-radius: 27px;
}

.banners-page[b-f1w2gae9nr]  .live-preview-content {
    position: absolute;
    z-index: 2;
    left: clamp(22px, 4vw, 46px);
    right: 24px;
    bottom: clamp(23px, 4vw, 42px);
    display: flex;
    max-width: 650px;
    flex-direction: column;
    align-items: flex-start;
    color: #fff;
}

.banners-page[b-f1w2gae9nr]  .live-preview-content strong {
    font-size: clamp(1.7rem, 3.5vw, 2.85rem);
    line-height: 1.22;
}

.banners-page[b-f1w2gae9nr]  .live-preview-content small {
    margin-top: 8px;
    color: rgba(255,255,255,.89);
    font-size: 1.08rem;
    line-height: 1.58;
}

.banners-page[b-f1w2gae9nr]  .insight-heading {
    display: flex;
    align-items: center;
    gap: 13px;
}

.banners-page[b-f1w2gae9nr]  .insight-icon {
    display: grid;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(145deg, var(--gold-500), #e1b64a);
}

.banners-page[b-f1w2gae9nr]  .insight-title {
    color: var(--ink-950) !important;
    font-size: 1.3rem !important;
    font-weight: 720 !important;
}

.banners-page[b-f1w2gae9nr]  .insight-subtitle {
    color: var(--ink-500) !important;
    font-size: .96rem !important;
}

.banners-page[b-f1w2gae9nr]  .ctr-display {
    display: flex;
    margin: 23px 0;
    padding: 23px;
    flex-direction: column;
    align-items: center;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow: 0 14px 29px rgba(7, 74, 56, .21);
}

.banners-page[b-f1w2gae9nr]  .ctr-display strong {
    font-size: 2.75rem;
    line-height: 1;
}

.banners-page[b-f1w2gae9nr]  .ctr-display span {
    margin-top: 7px;
    color: rgba(255,255,255,.86);
    font-size: 1.02rem;
}

.banners-page[b-f1w2gae9nr]  .insight-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.banners-page[b-f1w2gae9nr]  .insight-metrics > div {
    display: flex;
    min-height: 84px;
    padding: 12px 8px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
    text-align: center;
}

.banners-page[b-f1w2gae9nr]  .insight-metrics span {
    color: var(--ink-500);
    font-size: .88rem;
}

.banners-page[b-f1w2gae9nr]  .insight-metrics strong {
    margin-top: 4px;
    color: var(--ink-950);
    font-size: 1.35rem;
}

.banners-page[b-f1w2gae9nr]  .insight-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 17px;
    padding: 14px;
    border-radius: 14px;
    color: #795614;
    background: var(--gold-100);
    font-size: .96rem;
    line-height: 1.55;
}

.banners-page[b-f1w2gae9nr]  .content-panel {
    margin-top: 23px;
    padding: 27px;
}

.banners-page[b-f1w2gae9nr]  .content-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.banners-page[b-f1w2gae9nr]  .result-chip {
    color: var(--green-900) !important;
    background: var(--green-100) !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
}

.banners-page[b-f1w2gae9nr]  .filter-grid {
    margin-top: 17px !important;
}

.banners-page[b-f1w2gae9nr]  .filter-actions {
    display: flex;
    justify-content: flex-end;
    margin: 4px 0 10px;
}

.banners-page[b-f1w2gae9nr]  .clear-filter-button {
    color: var(--green-800) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.banners-page[b-f1w2gae9nr]  .loading-state,
.banners-page[b-f1w2gae9nr]  .empty-state,
.banners-page[b-f1w2gae9nr]  .empty-preview {
    display: flex;
    min-height: 280px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: var(--ink-700);
    text-align: center;
}

.banners-page[b-f1w2gae9nr]  .loading-state span,
.banners-page[b-f1w2gae9nr]  .empty-preview span {
    font-size: 1.08rem;
}

.banners-page[b-f1w2gae9nr]  .empty-icon {
    display: grid;
    width: 75px;
    height: 75px;
    place-items: center;
    border-radius: 23px;
    color: var(--green-800);
    background: var(--green-100);
}

.banners-page[b-f1w2gae9nr]  .empty-icon .mud-icon-root,
.banners-page[b-f1w2gae9nr]  .empty-preview .mud-icon-root {
    font-size: 2.35rem;
}

.banners-page[b-f1w2gae9nr]  .banner-list-grid {
    margin-top: 5px !important;
}

.banners-page[b-f1w2gae9nr]  .media-card {
    overflow: hidden;
    height: 100%;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(19, 57, 47, .075);
    transition: transform .18s ease, box-shadow .18s ease;
}

.banners-page[b-f1w2gae9nr]  .media-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 43px rgba(19, 57, 47, .13);
}

.banners-page[b-f1w2gae9nr]  .media-cover {
    position: relative;
    min-height: 235px;
    background-color: var(--green-900);
    background-position: center;
    background-size: cover;
}

.banners-page[b-f1w2gae9nr]  .media-top-row {
    position: absolute;
    z-index: 2;
    top: 15px;
    left: 15px;
    right: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.banners-page[b-f1w2gae9nr]  .pinned-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    border-radius: 999px;
    color: #5f430d;
    background: rgba(255, 238, 190, .94);
    font-size: .89rem;
    font-weight: 650;
}

.banners-page[b-f1w2gae9nr]  .pinned-badge .mud-icon-root {
    font-size: 1rem;
}

.banners-page[b-f1w2gae9nr]  .media-cover-title {
    position: absolute;
    z-index: 2;
    left: 19px;
    right: 19px;
    bottom: 18px;
    display: flex;
    flex-direction: column;
    color: #fff;
}

.banners-page[b-f1w2gae9nr]  .media-cover-title strong {
    font-size: 1.37rem;
    line-height: 1.35;
}

.banners-page[b-f1w2gae9nr]  .media-cover-title span {
    display: -webkit-box;
    margin-top: 5px;
    overflow: hidden;
    color: rgba(255,255,255,.86);
    font-size: .99rem;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.banners-page[b-f1w2gae9nr]  .media-card-body {
    padding: 20px;
}

.banners-page[b-f1w2gae9nr]  .status-chip,
.banners-page[b-f1w2gae9nr]  .placement-chip {
    border: 0 !important;
    font-weight: 650 !important;
}

.banners-page[b-f1w2gae9nr]  .status-active { color: #087253 !important; background: var(--green-100) !important; }
.banners-page[b-f1w2gae9nr]  .status-scheduled { color: #26649f !important; background: var(--blue-100) !important; }
.banners-page[b-f1w2gae9nr]  .status-draft { color: #805f18 !important; background: var(--gold-100) !important; }
.banners-page[b-f1w2gae9nr]  .status-expired { color: #b03844 !important; background: var(--red-100) !important; }
.banners-page[b-f1w2gae9nr]  .status-archived { color: #61706b !important; background: var(--gray-100) !important; }
.banners-page[b-f1w2gae9nr]  .placement-chip { color: #68429c !important; background: var(--purple-100) !important; }

.banners-page[b-f1w2gae9nr]  .card-meta-list {
    display: grid;
    gap: 9px;
    margin-top: 15px;
}

.banners-page[b-f1w2gae9nr]  .card-meta-list > div {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: var(--ink-700);
    font-size: 1rem;
    line-height: 1.5;
}

.banners-page[b-f1w2gae9nr]  .card-meta-list .mud-icon-root {
    margin-top: 2px;
    color: var(--green-700);
    font-size: 1.19rem;
}

.banners-page[b-f1w2gae9nr]  .card-stat-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 17px;
}

.banners-page[b-f1w2gae9nr]  .card-stat-row > div {
    display: flex;
    min-height: 70px;
    padding: 9px 7px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-bg) 82%, white);
    text-align: center;
}

.banners-page[b-f1w2gae9nr]  .card-stat-row span {
    color: var(--ink-500);
    font-size: .84rem;
}

.banners-page[b-f1w2gae9nr]  .card-stat-row strong {
    margin-top: 3px;
    color: var(--ink-950);
    font-size: 1.08rem;
}

.banners-page[b-f1w2gae9nr]  .card-actions {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 15px;
    padding-top: 13px;
    border-top: 1px solid var(--line);
}

.banners-page[b-f1w2gae9nr]  .card-detail-button {
    flex: 1;
    justify-content: flex-start !important;
    color: var(--green-800) !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
}

.banners-page[b-f1w2gae9nr]  .card-icon-button {
    color: var(--ink-700) !important;
    background: #f1f6f3 !important;
}

.banners-page[b-f1w2gae9nr]  .publish-icon-button {
    color: var(--theme-primary) !important;
    background: var(--green-100) !important;
}

.banners-page[b-f1w2gae9nr]  .danger-icon-button {
    color: #ba3e49 !important;
    background: var(--red-100) !important;
}

@media (max-width: 1199.98px) {
    .banners-page[b-f1w2gae9nr]  .showcase-panel,
    .banners-page[b-f1w2gae9nr]  .insight-panel {
        height: auto;
    }

    .banners-page[b-f1w2gae9nr]  .preview-mobile {
        min-height: 360px;
    }
}

@media (max-width: 959.98px) {
    .banners-page[b-f1w2gae9nr]  .banner-hero,
    .banners-page[b-f1w2gae9nr]  .editor-panel,
    .banners-page[b-f1w2gae9nr]  .detail-body,
    .banners-page[b-f1w2gae9nr]  .showcase-panel,
    .banners-page[b-f1w2gae9nr]  .insight-panel,
    .banners-page[b-f1w2gae9nr]  .content-panel {
        padding: 22px;
    }

    .banners-page[b-f1w2gae9nr]  .panel-heading-row,
    .banners-page[b-f1w2gae9nr]  .content-panel-header {
        flex-direction: column;
    }

    .banners-page[b-f1w2gae9nr]  .device-toggle {
        width: 100%;
    }

    .banners-page[b-f1w2gae9nr]  .device-toggle-button {
        flex: 1;
        justify-content: center;
    }

    .banners-page[b-f1w2gae9nr]  .detail-info-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 599.98px) {
    .banners-page[b-f1w2gae9nr] {
        padding-top: 2px;
    }

    .banners-page[b-f1w2gae9nr]  .banner-hero,
    .banners-page[b-f1w2gae9nr]  .editor-panel,
    .banners-page[b-f1w2gae9nr]  .detail-panel,
    .banners-page[b-f1w2gae9nr]  .showcase-panel,
    .banners-page[b-f1w2gae9nr]  .insight-panel,
    .banners-page[b-f1w2gae9nr]  .content-panel {
        border-radius: 20px;
    }

    .banners-page[b-f1w2gae9nr]  .banner-hero {
        padding: 23px 19px;
    }

    .banners-page[b-f1w2gae9nr]  .hero-title {
        font-size: 2.1rem !important;
    }

    .banners-page[b-f1w2gae9nr]  .hero-description {
        font-size: 1.07rem !important;
    }

    .banners-page[b-f1w2gae9nr]  .hero-benefits {
        gap: 9px;
    }

    .banners-page[b-f1w2gae9nr]  .hero-benefits span {
        width: 100%;
        font-size: .98rem;
    }

    .banners-page[b-f1w2gae9nr]  .hero-action-card {
        padding: 21px;
    }

    .banners-page[b-f1w2gae9nr]  .summary-card {
        min-height: 112px;
        padding: 15px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .banners-page[b-f1w2gae9nr]  .summary-icon {
        width: 50px;
        height: 50px;
        flex-basis: 50px;
    }

    .banners-page[b-f1w2gae9nr]  .summary-label {
        font-size: .96rem !important;
    }

    .banners-page[b-f1w2gae9nr]  .editor-panel,
    .banners-page[b-f1w2gae9nr]  .detail-body,
    .banners-page[b-f1w2gae9nr]  .showcase-panel,
    .banners-page[b-f1w2gae9nr]  .insight-panel,
    .banners-page[b-f1w2gae9nr]  .content-panel {
        padding: 18px;
    }

    .banners-page[b-f1w2gae9nr]  .section-heading {
        align-items: flex-start;
    }

    .banners-page[b-f1w2gae9nr]  .section-icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
    }

    .banners-page[b-f1w2gae9nr]  .section-title {
        font-size: 1.42rem !important;
    }

    .banners-page[b-f1w2gae9nr]  .preview-shell,
    .banners-page[b-f1w2gae9nr]  .live-preview,
    .banners-page[b-f1w2gae9nr]  .detail-preview {
        min-height: 330px;
    }

    .banners-page[b-f1w2gae9nr]  .preview-content strong,
    .banners-page[b-f1w2gae9nr]  .live-preview-content strong {
        font-size: 1.55rem;
    }

    .banners-page[b-f1w2gae9nr]  .form-actions,
    .banners-page[b-f1w2gae9nr]  .detail-actions {
        flex-direction: column-reverse;
    }

    .banners-page[b-f1w2gae9nr]  .form-actions .mud-button-root,
    .banners-page[b-f1w2gae9nr]  .detail-actions .mud-button-root {
        width: 100%;
    }

    .banners-page[b-f1w2gae9nr]  .detail-preview-content {
        left: 20px;
        right: 20px;
        bottom: 25px;
    }

    .banners-page[b-f1w2gae9nr]  .detail-title {
        font-size: 1.85rem !important;
    }

    .banners-page[b-f1w2gae9nr]  .insight-metrics {
        grid-template-columns: 1fr;
    }

    .banners-page[b-f1w2gae9nr]  .insight-metrics > div {
        min-height: 66px;
    }

    .banners-page[b-f1w2gae9nr]  .media-cover {
        min-height: 220px;
    }

    .banners-page[b-f1w2gae9nr]  .card-actions {
        flex-wrap: wrap;
    }

    .banners-page[b-f1w2gae9nr]  .card-detail-button {
        min-width: 100%;
    }
}
/* /Components/Pages/04News/Events.razor.rz.scp.css */
.events-page[b-52igg3tg5g] {
    --green-950: #073d31;
    --green-900: #09513f;
    --green-800: #0b6850;
    --green-700: #0e7d5e;
    --green-100: #ddf4eb;
    --green-50: #f3fbf8;
    --gold-500: #d6a52d;
    --gold-100: #fff1c9;
    --blue-100: #e2efff;
    --purple-100: #eee7ff;
    --red-100: #ffe6e7;
    --ink-950: #17231f;
    --ink-900: #24342f;
    --ink-700: #53645e;
    --ink-500: #7d8b86;
    --line: #dce8e3;
    --surface: #ffffff;
    width: 100%;
    padding: 8px 2px 42px;
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
}

.events-page[b-52igg3tg5g]  .mud-typography-root,
.events-page[b-52igg3tg5g]  .mud-input,
.events-page[b-52igg3tg5g]  .mud-input-label,
.events-page[b-52igg3tg5g]  .mud-button-label,
.events-page[b-52igg3tg5g]  .mud-chip-content,
.events-page[b-52igg3tg5g]  .mud-picker {
    font-family: "Kanit", sans-serif !important;
}

.events-page[b-52igg3tg5g]  .event-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(28px, 4vw, 54px);
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 28px;
    color: #fff;
    background:
        linear-gradient(125deg, rgba(4, 54, 42, .98), rgba(9, 103, 77, .95) 58%, rgba(15, 124, 91, .91)),
        radial-gradient(circle at 78% 10%, rgba(255, 222, 128, .23), transparent 32%);
    box-shadow: 0 22px 52px rgba(5, 58, 43, .20);
}

.events-page[b-52igg3tg5g]  .hero-pattern {
    position: absolute;
    inset: 0;
    opacity: .16;
    background-image:
        linear-gradient(rgba(255, 255, 255, .13) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .13) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(to left, #000, transparent 70%);
}

.events-page[b-52igg3tg5g]  .hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(1px);
    pointer-events: none;
}

.events-page[b-52igg3tg5g]  .hero-orb-one {
    top: -110px;
    right: 21%;
    width: 270px;
    height: 270px;
    background: rgba(255, 224, 140, .19);
}

.events-page[b-52igg3tg5g]  .hero-orb-two {
    right: -90px;
    bottom: -130px;
    width: 330px;
    height: 330px;
    background: rgba(255, 255, 255, .10);
}

.events-page[b-52igg3tg5g]  .event-hero .mud-grid,
.events-page[b-52igg3tg5g]  .event-hero .mud-grid-item {
    position: relative;
    z-index: 2;
}

.events-page[b-52igg3tg5g]  .hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    margin-bottom: 17px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 1.06rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}

.events-page[b-52igg3tg5g]  .hero-title {
    margin-bottom: 10px !important;
    color: #fff !important;
    font-size: clamp(2.45rem, 4vw, 4.25rem) !important;
    font-weight: 800 !important;
    line-height: 1.13 !important;
}

.events-page[b-52igg3tg5g]  .hero-description {
    max-width: 900px;
    color: rgba(255, 255, 255, .89) !important;
    font-size: 1.19rem !important;
    font-weight: 400 !important;
    line-height: 1.78 !important;
}

.events-page[b-52igg3tg5g]  .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 23px;
}

.events-page[b-52igg3tg5g]  .hero-benefits span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 1.04rem;
    font-weight: 500;
}

.events-page[b-52igg3tg5g]  .hero-action-card {
    padding: 27px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 24px;
    background: rgba(255, 255, 255, .96);
    color: var(--ink-900);
    box-shadow: 0 22px 48px rgba(2, 39, 29, .28);
    backdrop-filter: blur(14px);
}

.events-page[b-52igg3tg5g]  .hero-action-icon {
    display: grid;
    width: 68px;
    height: 68px;
    margin-bottom: 17px;
    place-items: center;
    border-radius: 19px;
    color: #fff;
    background: linear-gradient(145deg, var(--gold-500), #e1b84e);
    box-shadow: 0 13px 26px rgba(207, 157, 42, .31);
}

.events-page[b-52igg3tg5g]  .hero-action-icon .mud-icon-root {
    font-size: 2.15rem;
}

.events-page[b-52igg3tg5g]  .hero-action-title {
    color: var(--ink-950) !important;
    font-size: 1.42rem !important;
    font-weight: 750 !important;
}

.events-page[b-52igg3tg5g]  .hero-action-text {
    margin: 7px 0 18px !important;
    color: var(--ink-700) !important;
    font-size: 1.04rem !important;
    line-height: 1.65 !important;
}

.events-page[b-52igg3tg5g]  .hero-create-button,
.events-page[b-52igg3tg5g]  .primary-button {
    min-height: 51px;
    border-radius: 14px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
    font-size: 1.06rem !important;
    font-weight: 650 !important;
    box-shadow: 0 10px 24px rgba(10, 75, 58, .22) !important;
}

.events-page[b-52igg3tg5g]  .hero-create-button {
    width: 100%;
}

.events-page[b-52igg3tg5g]  .summary-grid {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

.events-page[b-52igg3tg5g]  .summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 120px;
    padding: 20px;
    border: 1px solid rgba(13, 96, 73, .10);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(19, 57, 47, .07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.events-page[b-52igg3tg5g]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(19, 57, 47, .11);
}

.events-page[b-52igg3tg5g]  .summary-icon {
    display: grid;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    place-items: center;
    border-radius: 18px;
}

.events-page[b-52igg3tg5g]  .summary-icon .mud-icon-root {
    font-size: 1.85rem;
}

.events-page[b-52igg3tg5g]  .summary-green .summary-icon { color: #087252; background: var(--green-100); }
.events-page[b-52igg3tg5g]  .summary-blue .summary-icon { color: #2366a5; background: var(--blue-100); }
.events-page[b-52igg3tg5g]  .summary-purple .summary-icon { color: #7443ad; background: var(--purple-100); }
.events-page[b-52igg3tg5g]  .summary-gold .summary-icon { color: #97660e; background: var(--gold-100); }

.events-page[b-52igg3tg5g]  .summary-value {
    color: var(--ink-950) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
}

.events-page[b-52igg3tg5g]  .summary-label {
    margin-top: 4px !important;
    color: var(--ink-700) !important;
    font-size: 1.05rem !important;
    font-weight: 550 !important;
}

.events-page[b-52igg3tg5g]  .editor-panel,
.events-page[b-52igg3tg5g]  .detail-panel,
.events-page[b-52igg3tg5g]  .content-panel {
    margin-top: 23px;
    border: 1px solid var(--line);
    border-radius: 25px;
    background: var(--surface);
    box-shadow: 0 16px 42px rgba(21, 62, 52, .08);
}

.events-page[b-52igg3tg5g]  .editor-panel {
    padding: 29px;
}

.events-page[b-52igg3tg5g]  .section-heading {
    display: flex;
    align-items: center;
    gap: 15px;
}

.events-page[b-52igg3tg5g]  .section-icon {
    display: grid;
    flex: 0 0 59px;
    width: 59px;
    height: 59px;
    place-items: center;
    border-radius: 18px;
}

.events-page[b-52igg3tg5g]  .section-icon-green {
    color: #fff;
    background: linear-gradient(145deg, var(--green-900), var(--green-700));
    box-shadow: 0 11px 24px rgba(9, 81, 63, .22);
}

.events-page[b-52igg3tg5g]  .section-icon .mud-icon-root {
    font-size: 1.85rem;
}

.events-page[b-52igg3tg5g]  .section-title-wrap {
    flex: 1;
    min-width: 0;
}

.events-page[b-52igg3tg5g]  .section-title,
.events-page[b-52igg3tg5g]  .panel-title {
    color: var(--ink-950) !important;
    font-size: clamp(1.55rem, 2vw, 2rem) !important;
    font-weight: 780 !important;
}

.events-page[b-52igg3tg5g]  .section-subtitle,
.events-page[b-52igg3tg5g]  .panel-subtitle {
    margin-top: 3px !important;
    color: var(--ink-700) !important;
    font-size: 1.05rem !important;
    line-height: 1.62 !important;
}

.events-page[b-52igg3tg5g]  .close-button {
    color: var(--ink-700) !important;
    background: var(--theme-bg) !important;
}

.events-page[b-52igg3tg5g]  .section-divider {
    margin: 22px 0 25px;
    border-color: var(--line) !important;
}

.events-page[b-52igg3tg5g]  .large-input .mud-input-control-input-container {
    min-height: 56px;
}

.events-page[b-52igg3tg5g]  .large-input .mud-input-slot,
.events-page[b-52igg3tg5g]  .large-input input,
.events-page[b-52igg3tg5g]  .large-input textarea,
.events-page[b-52igg3tg5g]  .large-input .mud-select-input {
    font-size: 1.07rem !important;
    line-height: 1.55 !important;
}

.events-page[b-52igg3tg5g]  .large-input .mud-input-label {
    color: #4e605a !important;
    font-size: 1.02rem !important;
    font-weight: 550 !important;
}

.events-page[b-52igg3tg5g]  .large-input .mud-input-outlined-border {
    border-color: #cddbd5 !important;
    border-radius: 14px !important;
}

.events-page[b-52igg3tg5g]  .large-input:hover .mud-input-outlined-border,
.events-page[b-52igg3tg5g]  .large-input.mud-input-control-input-container:focus-within .mud-input-outlined-border {
    border-color: var(--green-700) !important;
}

.events-page[b-52igg3tg5g]  .title-input input {
    font-size: 1.18rem !important;
    font-weight: 600 !important;
}

.events-page[b-52igg3tg5g]  .switch-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 28px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--green-50);
}

.events-page[b-52igg3tg5g]  .switch-panel .mud-switch-label {
    font-size: 1.06rem !important;
    font-weight: 550 !important;
}

.events-page[b-52igg3tg5g]  .image-upload-card {
    min-height: 178px;
    padding: 20px;
    border: 1px dashed #a9c5ba;
    border-radius: 18px;
    background: linear-gradient(145deg, #f8fcfa, #f0f8f5);
}

.events-page[b-52igg3tg5g]  .image-upload-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.events-page[b-52igg3tg5g]  .image-upload-heading > .mud-icon-root {
    color: var(--green-700);
    font-size: 2rem;
}

.events-page[b-52igg3tg5g]  .image-upload-heading div {
    display: flex;
    flex-direction: column;
}

.events-page[b-52igg3tg5g]  .image-upload-heading strong {
    color: var(--ink-950);
    font-size: 1.1rem;
}

.events-page[b-52igg3tg5g]  .image-upload-heading span {
    color: var(--ink-700);
    font-size: .94rem;
}

.events-page[b-52igg3tg5g]  .upload-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 17px;
    border-radius: 13px;
    color: #fff;
    background: var(--green-800);
    font-size: 1.02rem;
    font-weight: 600;
    cursor: pointer;
}

.events-page[b-52igg3tg5g]  .upload-button input {
    display: none;
}

.events-page[b-52igg3tg5g]  .file-name-text {
    margin-top: 12px !important;
    color: var(--ink-700) !important;
    font-size: .96rem !important;
    overflow-wrap: anywhere;
}

.events-page[b-52igg3tg5g]  .image-preview-shell {
    overflow: hidden;
    min-height: 178px;
    height: 100%;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #f2f7f5;
}

.events-page[b-52igg3tg5g]  .image-preview {
    width: 100%;
    height: 100%;
    min-height: 178px;
    max-height: 280px;
    object-fit: cover;
}

.events-page[b-52igg3tg5g]  .image-placeholder {
    display: flex;
    min-height: 178px;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 11px;
    padding: 20px;
    color: var(--ink-500);
    text-align: center;
    font-size: 1rem;
}

.events-page[b-52igg3tg5g]  .image-placeholder .mud-icon-root {
    font-size: 2.6rem;
    color: #9cb0a8;
}

.events-page[b-52igg3tg5g]  .form-actions,
.events-page[b-52igg3tg5g]  .detail-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 27px;
}

.events-page[b-52igg3tg5g]  .secondary-button,
.events-page[b-52igg3tg5g]  .danger-button {
    min-height: 49px;
    border-radius: 14px !important;
    font-size: 1.04rem !important;
    font-weight: 600 !important;
}

.events-page[b-52igg3tg5g]  .secondary-button {
    border-color: #afc2ba !important;
    color: var(--ink-900) !important;
}

.events-page[b-52igg3tg5g]  .detail-panel {
    overflow: hidden;
}

.events-page[b-52igg3tg5g]  .detail-cover {
    position: relative;
    min-height: 340px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.events-page[b-52igg3tg5g]  .detail-cover > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.events-page[b-52igg3tg5g]  .detail-cover-placeholder {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, .72);
    background: radial-gradient(circle at center, rgba(255, 255, 255, .14), transparent 50%);
}

.events-page[b-52igg3tg5g]  .detail-cover-placeholder .mud-icon-root {
    font-size: 6rem;
}

.events-page[b-52igg3tg5g]  .detail-cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(3, 28, 21, .93), rgba(3, 28, 21, .12) 72%);
}

.events-page[b-52igg3tg5g]  .detail-cover-content {
    position: absolute;
    z-index: 2;
    right: 32px;
    bottom: 29px;
    left: 32px;
}

.events-page[b-52igg3tg5g]  .detail-category-chip {
    margin-bottom: 12px;
    color: #073d31 !important;
    background: rgba(255, 255, 255, .93) !important;
    font-weight: 650 !important;
}

.events-page[b-52igg3tg5g]  .detail-title {
    color: #fff !important;
    font-size: clamp(1.9rem, 3vw, 3rem) !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
}

.events-page[b-52igg3tg5g]  .detail-summary {
    max-width: 920px;
    margin-top: 8px !important;
    color: rgba(255, 255, 255, .89) !important;
    font-size: 1.12rem !important;
    line-height: 1.7 !important;
}

.events-page[b-52igg3tg5g]  .detail-close-button {
    position: absolute;
    z-index: 3;
    top: 18px;
    right: 18px;
    color: #fff !important;
    background: rgba(1, 28, 21, .55) !important;
    backdrop-filter: blur(7px);
}

.events-page[b-52igg3tg5g]  .detail-body {
    padding: 29px;
}

.events-page[b-52igg3tg5g]  .detail-section-title {
    margin-bottom: 12px !important;
    color: var(--ink-950) !important;
    font-size: 1.42rem !important;
    font-weight: 750 !important;
}

.events-page[b-52igg3tg5g]  .detail-description {
    color: var(--ink-700) !important;
    font-size: 1.08rem !important;
    line-height: 1.9 !important;
    white-space: pre-line;
}

.events-page[b-52igg3tg5g]  .tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.events-page[b-52igg3tg5g]  .tag-chip {
    color: var(--green-800) !important;
    background: var(--green-50) !important;
    font-weight: 550 !important;
}

.events-page[b-52igg3tg5g]  .detail-info-card {
    padding: 21px;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.events-page[b-52igg3tg5g]  .detail-info-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--theme-border);
}

.events-page[b-52igg3tg5g]  .detail-info-row:last-of-type {
    border-bottom: 0;
}

.events-page[b-52igg3tg5g]  .detail-info-row > .mud-icon-root {
    margin-top: 2px;
    color: var(--green-700);
}

.events-page[b-52igg3tg5g]  .detail-info-row div {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
}

.events-page[b-52igg3tg5g]  .detail-info-row span {
    color: var(--ink-500);
    font-size: .9rem;
}

.events-page[b-52igg3tg5g]  .detail-info-row strong {
    color: var(--ink-900);
    font-size: 1.02rem;
    font-weight: 650;
    line-height: 1.55;
}

.events-page[b-52igg3tg5g]  .detail-info-row small {
    color: var(--ink-700);
    font-size: .91rem;
}

.events-page[b-52igg3tg5g]  .registration-progress {
    margin-top: 17px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.events-page[b-52igg3tg5g]  .registration-progress-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 9px;
    color: var(--ink-700);
    font-size: .98rem;
}

.events-page[b-52igg3tg5g]  .content-panel {
    padding: 28px;
}

.events-page[b-52igg3tg5g]  .panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 21px;
}

.events-page[b-52igg3tg5g]  .result-chip {
    color: var(--green-900) !important;
    background: var(--green-100) !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
}

.events-page[b-52igg3tg5g]  .filter-grid {
    align-items: center;
    margin-bottom: 20px !important;
}

.events-page[b-52igg3tg5g]  .view-switcher {
    display: flex;
    justify-content: center;
    gap: 7px;
    min-height: 56px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #f5f9f7;
}

.events-page[b-52igg3tg5g]  .view-button {
    flex: 1;
    border-radius: 11px !important;
    color: var(--ink-700) !important;
}

.events-page[b-52igg3tg5g]  .view-button.active {
    color: #fff !important;
    background: var(--green-800) !important;
    box-shadow: 0 6px 15px rgba(9, 81, 63, .20);
}

.events-page[b-52igg3tg5g]  .loading-state,
.events-page[b-52igg3tg5g]  .empty-state {
    display: flex;
    min-height: 330px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: var(--ink-700);
    text-align: center;
}

.events-page[b-52igg3tg5g]  .loading-state .mud-typography-root,
.events-page[b-52igg3tg5g]  .empty-state .mud-typography-root {
    font-size: 1.08rem !important;
}

.events-page[b-52igg3tg5g]  .empty-icon {
    display: grid;
    width: 82px;
    height: 82px;
    place-items: center;
    border-radius: 24px;
    color: var(--green-700);
    background: var(--green-100);
}

.events-page[b-52igg3tg5g]  .empty-icon .mud-icon-root {
    font-size: 2.65rem;
}

.events-page[b-52igg3tg5g]  .calendar-toolbar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    margin-top: 8px;
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 19px 19px 0 0;
    background: linear-gradient(135deg, #f8fcfa, #eff8f4);
}

.events-page[b-52igg3tg5g]  .calendar-navigation {
    display: flex;
    align-items: center;
    gap: 7px;
}

.events-page[b-52igg3tg5g]  .calendar-nav-button {
    color: var(--green-900) !important;
    background: #fff !important;
    border: 1px solid var(--line) !important;
}

.events-page[b-52igg3tg5g]  .today-button {
    min-height: 43px;
    border-radius: 12px !important;
    color: var(--green-900) !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
}

.events-page[b-52igg3tg5g]  .calendar-month-title {
    color: var(--ink-950) !important;
    font-size: 1.62rem !important;
    font-weight: 780 !important;
    text-align: center;
}

.events-page[b-52igg3tg5g]  .calendar-month-count {
    justify-self: end;
    color: var(--ink-700) !important;
    font-size: 1rem !important;
    font-weight: 550 !important;
}

.events-page[b-52igg3tg5g]  .calendar-shell {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 0 0 19px 19px;
    background: #fff;
}

.events-page[b-52igg3tg5g]  .calendar-weekdays,
.events-page[b-52igg3tg5g]  .calendar-grid {
    min-width: 920px;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.events-page[b-52igg3tg5g]  .calendar-weekdays {
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.events-page[b-52igg3tg5g]  .calendar-weekdays > div {
    padding: 12px 8px;
    color: var(--ink-700);
    font-size: 1rem;
    font-weight: 650;
    text-align: center;
}

.events-page[b-52igg3tg5g]  .calendar-weekdays > div:first-child {
    color: #c94d55;
}

.events-page[b-52igg3tg5g]  .calendar-day {
    position: relative;
    min-height: 138px;
    padding: 10px;
    border: 0;
    border-right: 1px solid var(--theme-border);
    border-bottom: 1px solid var(--theme-border);
    color: var(--ink-900);
    background: #fff;
    font-family: "Kanit", sans-serif;
    text-align: left;
    cursor: pointer;
    transition: background .16s ease, box-shadow .16s ease;
}

.events-page[b-52igg3tg5g]  .calendar-day:nth-child(7n) {
    border-right: 0;
}

.events-page[b-52igg3tg5g]  .calendar-day:hover {
    z-index: 1;
    background: #f5fbf8;
    box-shadow: inset 0 0 0 2px rgba(14, 125, 94, .16);
}

.events-page[b-52igg3tg5g]  .calendar-day.outside-month {
    color: #a5b1ad;
    background: #fafcfc;
}

.events-page[b-52igg3tg5g]  .calendar-day.today {
    background: #f0faf6;
}

.events-page[b-52igg3tg5g]  .calendar-day.selected {
    z-index: 1;
    background: #e9f8f2;
    box-shadow: inset 0 0 0 2px var(--green-700);
}

.events-page[b-52igg3tg5g]  .calendar-day-number {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 10px;
    font-size: 1.02rem;
    font-weight: 650;
}

.events-page[b-52igg3tg5g]  .calendar-day.today .calendar-day-number {
    color: #fff;
    background: var(--green-800);
}

.events-page[b-52igg3tg5g]  .calendar-events {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 8px;
}

.events-page[b-52igg3tg5g]  .calendar-event {
    display: block;
    overflow: hidden;
    padding: 5px 7px;
    border-radius: 8px;
    color: #1d3b31;
    background: var(--green-100);
    font-size: .82rem;
    font-weight: 550;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.events-page[b-52igg3tg5g]  .calendar-event i {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 5px;
    border-radius: 50%;
    background: currentColor;
    vertical-align: middle;
}

.events-page[b-52igg3tg5g]  .calendar-event-health { color: #a43946; background: #ffe8eb; }
.events-page[b-52igg3tg5g]  .calendar-event-culture { color: #7d4da8; background: #f0e8fa; }
.events-page[b-52igg3tg5g]  .calendar-event-sports { color: #2265a2; background: #e4f0ff; }
.events-page[b-52igg3tg5g]  .calendar-event-training { color: #9a6a0f; background: #fff1cb; }
.events-page[b-52igg3tg5g]  .calendar-event-meeting { color: #5652a2; background: #eae9ff; }
.events-page[b-52igg3tg5g]  .calendar-event-volunteer { color: #0a7654; background: #dcf5ea; }
.events-page[b-52igg3tg5g]  .calendar-event-other { color: #596964; background: #edf2f0; }

.events-page[b-52igg3tg5g]  .calendar-more {
    padding-left: 6px;
    color: var(--green-800);
    font-size: .79rem;
    font-weight: 650;
}

.events-page[b-52igg3tg5g]  .selected-day-panel {
    margin-top: 17px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.events-page[b-52igg3tg5g]  .selected-day-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.events-page[b-52igg3tg5g]  .selected-day-title {
    color: var(--ink-950) !important;
    font-size: 1.28rem !important;
    font-weight: 720 !important;
}

.events-page[b-52igg3tg5g]  .selected-day-subtitle {
    color: var(--ink-700) !important;
    font-size: .98rem !important;
}

.events-page[b-52igg3tg5g]  .selected-day-list {
    display: grid;
    gap: 9px;
}

.events-page[b-52igg3tg5g]  .selected-day-item {
    display: grid;
    grid-template-columns: 95px 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #e0ebe6;
    border-radius: 14px;
    color: var(--ink-900);
    background: #fff;
    font-family: "Kanit", sans-serif;
    text-align: left;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease;
}

.events-page[b-52igg3tg5g]  .selected-day-item:hover {
    transform: translateX(3px);
    border-color: #9cc7b6;
}

.events-page[b-52igg3tg5g]  .selected-time {
    color: var(--green-800);
    font-size: .98rem;
    font-weight: 650;
}

.events-page[b-52igg3tg5g]  .selected-category-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    color: var(--green-800);
    background: var(--green-100);
}

.events-page[b-52igg3tg5g]  .selected-event-content {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.events-page[b-52igg3tg5g]  .selected-event-content strong {
    overflow: hidden;
    font-size: 1.04rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.events-page[b-52igg3tg5g]  .selected-event-content small {
    color: var(--ink-700);
    font-size: .91rem;
}

.events-page[b-52igg3tg5g]  .compact-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 90px;
    color: var(--ink-500);
    font-size: 1rem;
}

.events-page[b-52igg3tg5g]  .event-list-grid {
    margin-top: 4px !important;
}

.events-page[b-52igg3tg5g]  .event-card {
    overflow: hidden;
    height: 100%;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 11px 28px rgba(21, 62, 52, .07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.events-page[b-52igg3tg5g]  .event-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(21, 62, 52, .13);
}

.events-page[b-52igg3tg5g]  .event-card-cover {
    position: relative;
    height: 225px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.events-page[b-52igg3tg5g]  .event-card-cover > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}

.events-page[b-52igg3tg5g]  .event-card:hover .event-card-cover > img {
    transform: scale(1.04);
}

.events-page[b-52igg3tg5g]  .event-card-placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: rgba(255, 255, 255, .78);
    background: radial-gradient(circle, rgba(255, 255, 255, .15), transparent 55%);
}

.events-page[b-52igg3tg5g]  .event-card-placeholder .mud-icon-root {
    font-size: 5rem;
}

.events-page[b-52igg3tg5g]  .event-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(5, 36, 28, .60), transparent 58%);
}

.events-page[b-52igg3tg5g]  .event-date-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    display: flex;
    width: 62px;
    height: 68px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 16px;
    color: var(--green-950);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 8px 20px rgba(0, 0, 0, .13);
}

.events-page[b-52igg3tg5g]  .event-date-badge strong {
    font-size: 1.45rem;
    line-height: 1;
}

.events-page[b-52igg3tg5g]  .event-date-badge span {
    margin-top: 4px;
    font-size: .81rem;
    font-weight: 600;
}

.events-page[b-52igg3tg5g]  .featured-badge {
    position: absolute;
    top: 17px;
    right: 16px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #634304;
    background: rgba(255, 239, 189, .95);
    font-size: .86rem;
    font-weight: 650;
}

.events-page[b-52igg3tg5g]  .featured-badge .mud-icon-root {
    font-size: 1.05rem;
}

.events-page[b-52igg3tg5g]  .event-card-body {
    display: flex;
    min-height: 385px;
    flex-direction: column;
    padding: 20px;
}

.events-page[b-52igg3tg5g]  .card-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 13px;
}

.events-page[b-52igg3tg5g]  .category-chip,
.events-page[b-52igg3tg5g]  .status-chip {
    font-size: .88rem !important;
    font-weight: 600 !important;
}

.events-page[b-52igg3tg5g]  .category-chip { color: var(--green-800) !important; background: var(--green-100) !important; }
.events-page[b-52igg3tg5g]  .category-health { color: #9e3644 !important; background: #ffe8eb !important; }
.events-page[b-52igg3tg5g]  .category-culture { color: #75449f !important; background: #f0e8fa !important; }
.events-page[b-52igg3tg5g]  .category-sports { color: #2365a1 !important; background: #e5f0ff !important; }
.events-page[b-52igg3tg5g]  .category-training { color: #94640d !important; background: #fff1cb !important; }
.events-page[b-52igg3tg5g]  .category-meeting { color: #5550a2 !important; background: #ebeaff !important; }
.events-page[b-52igg3tg5g]  .category-volunteer { color: #087352 !important; background: #dcf5ea !important; }
.events-page[b-52igg3tg5g]  .category-other { color: #596964 !important; background: #edf2f0 !important; }

.events-page[b-52igg3tg5g]  .status-published { color: #087352 !important; background: #e0f5ec !important; }
.events-page[b-52igg3tg5g]  .status-draft { color: #8b610e !important; background: #fff0c7 !important; }
.events-page[b-52igg3tg5g]  .status-cancelled { color: #b73b45 !important; background: #ffe5e7 !important; }
.events-page[b-52igg3tg5g]  .status-completed { color: #52645e !important; background: #eaf0ed !important; }

.events-page[b-52igg3tg5g]  .event-card-title {
    display: -webkit-box;
    overflow: hidden;
    min-height: 62px;
    color: var(--ink-950) !important;
    font-size: 1.29rem !important;
    font-weight: 740 !important;
    line-height: 1.47 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.events-page[b-52igg3tg5g]  .event-card-summary {
    display: -webkit-box;
    overflow: hidden;
    min-height: 74px;
    margin-top: 7px !important;
    color: var(--ink-700) !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.events-page[b-52igg3tg5g]  .event-meta-list {
    display: grid;
    gap: 9px;
    margin-top: 15px;
}

.events-page[b-52igg3tg5g]  .event-meta-list > div {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    color: var(--ink-700);
    font-size: .95rem;
    line-height: 1.45;
}

.events-page[b-52igg3tg5g]  .event-meta-list .mud-icon-root {
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--green-700);
    font-size: 1.18rem;
}

.events-page[b-52igg3tg5g]  .card-registration-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 12px;
    margin-top: 14px;
    border-radius: 12px;
    color: var(--ink-700);
    background: #f5f9f7;
    font-size: .94rem;
}

.events-page[b-52igg3tg5g]  .card-registration-row span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.events-page[b-52igg3tg5g]  .card-registration-row strong {
    color: var(--green-800);
}

.events-page[b-52igg3tg5g]  .card-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid #edf2f0;
}

.events-page[b-52igg3tg5g]  .card-detail-button {
    flex: 1;
    justify-content: flex-start;
    color: var(--green-800) !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
}

.events-page[b-52igg3tg5g]  .card-icon-button {
    color: var(--ink-700) !important;
    background: #f4f7f6 !important;
}

.events-page[b-52igg3tg5g]  .danger-icon-button {
    color: #b93e47 !important;
}

@media (max-width: 960px) {
    .events-page[b-52igg3tg5g]  .event-hero {
        padding: 30px;
    }

    .events-page[b-52igg3tg5g]  .calendar-toolbar {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .events-page[b-52igg3tg5g]  .calendar-navigation {
        justify-content: center;
        order: 2;
    }

    .events-page[b-52igg3tg5g]  .calendar-month-count {
        justify-self: center;
        order: 3;
    }

    .events-page[b-52igg3tg5g]  .detail-cover {
        min-height: 310px;
    }

    .events-page[b-52igg3tg5g]  .content-panel,
    .events-page[b-52igg3tg5g]  .editor-panel,
    .events-page[b-52igg3tg5g]  .detail-body {
        padding: 22px;
    }
}

@media (max-width: 600px) {
    .events-page[b-52igg3tg5g] {
        padding-top: 2px;
    }

    .events-page[b-52igg3tg5g]  .event-hero {
        padding: 24px 20px;
        border-radius: 21px;
    }

    .events-page[b-52igg3tg5g]  .hero-title {
        font-size: 2.18rem !important;
    }

    .events-page[b-52igg3tg5g]  .hero-description {
        font-size: 1.05rem !important;
    }

    .events-page[b-52igg3tg5g]  .hero-benefits {
        display: grid;
        gap: 9px;
    }

    .events-page[b-52igg3tg5g]  .summary-card {
        min-height: 142px;
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .events-page[b-52igg3tg5g]  .summary-icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
    }

    .events-page[b-52igg3tg5g]  .summary-label {
        font-size: .96rem !important;
    }

    .events-page[b-52igg3tg5g]  .editor-panel,
    .events-page[b-52igg3tg5g]  .content-panel,
    .events-page[b-52igg3tg5g]  .detail-body {
        padding: 18px;
        border-radius: 20px;
    }

    .events-page[b-52igg3tg5g]  .section-heading,
    .events-page[b-52igg3tg5g]  .panel-header {
        align-items: flex-start;
    }

    .events-page[b-52igg3tg5g]  .section-icon {
        width: 50px;
        height: 50px;
        flex-basis: 50px;
    }

    .events-page[b-52igg3tg5g]  .result-chip {
        display: none;
    }

    .events-page[b-52igg3tg5g]  .switch-panel {
        display: grid;
        gap: 4px;
    }

    .events-page[b-52igg3tg5g]  .form-actions,
    .events-page[b-52igg3tg5g]  .detail-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .events-page[b-52igg3tg5g]  .form-actions .mud-button-root,
    .events-page[b-52igg3tg5g]  .detail-actions .mud-button-root {
        width: 100%;
    }

    .events-page[b-52igg3tg5g]  .detail-cover {
        min-height: 390px;
    }

    .events-page[b-52igg3tg5g]  .detail-cover-content {
        right: 20px;
        bottom: 22px;
        left: 20px;
    }

    .events-page[b-52igg3tg5g]  .detail-title {
        font-size: 1.75rem !important;
    }

    .events-page[b-52igg3tg5g]  .calendar-weekdays,
    .events-page[b-52igg3tg5g]  .calendar-grid {
        min-width: 820px;
    }

    .events-page[b-52igg3tg5g]  .calendar-day {
        min-height: 126px;
    }

    .events-page[b-52igg3tg5g]  .selected-day-item {
        grid-template-columns: 76px 40px minmax(0, 1fr);
    }

    .events-page[b-52igg3tg5g]  .selected-day-item > .mud-icon-root:last-child {
        display: none;
    }

    .events-page[b-52igg3tg5g]  .event-card-cover {
        height: 210px;
    }
}
/* /Components/Pages/04News/News.razor.rz.scp.css */
.news-page[b-1qyu5qafng] {
    --news-green-950: #063b2b;
    --news-green-900: #07533b;
    --news-green-800: var(--theme-primary);
    --news-green-700: #0b8a63;
    --news-green-100: #ddf4e9;
    --news-gold: #d8a93c;
    --news-ink: #162820;
    --news-muted: #63736c;
    --news-border: #dce8e2;
    --news-page-bg: var(--theme-bg);
    min-height: 100%;
    padding: 24px;
    color: var(--news-ink);
    background:
        radial-gradient(circle at 4% 3%, rgba(20, 133, 93, .08), transparent 25%),
        radial-gradient(circle at 95% 8%, rgba(216, 169, 60, .08), transparent 24%),
        var(--news-page-bg);
    font-family: "Kanit", "Segoe UI", sans-serif;
}

.news-page[b-1qyu5qafng]  * { box-sizing: border-box; }
.news-page[b-1qyu5qafng]  .mud-typography,
.news-page[b-1qyu5qafng]  .mud-button-root,
.news-page[b-1qyu5qafng]  .mud-input,
.news-page[b-1qyu5qafng]  .mud-input-label,
.news-page[b-1qyu5qafng]  .mud-select,
.news-page[b-1qyu5qafng]  .mud-chip,
.news-page[b-1qyu5qafng]  .mud-menu-item { font-family: "Kanit", "Segoe UI", sans-serif; }

.news-page[b-1qyu5qafng]  .news-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4.5vw, 58px);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 32px;
    color: #fff;
    background: linear-gradient(128deg, #063d2d 0%, #076044 56%, #09805a 100%);
    box-shadow: 0 24px 60px rgba(5, 70, 49, .22);
}

.news-page[b-1qyu5qafng]  .hero-pattern {
    position: absolute;
    inset: 0;
    opacity: .08;
    background-image:
        linear-gradient(30deg, rgba(255,255,255,.7) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.7) 87.5%, rgba(255,255,255,.7)),
        linear-gradient(150deg, rgba(255,255,255,.7) 12%, transparent 12.5%, transparent 87%, rgba(255,255,255,.7) 87.5%, rgba(255,255,255,.7));
    background-size: 52px 90px;
}

.news-page[b-1qyu5qafng]  .hero-glow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.news-page[b-1qyu5qafng]  .hero-glow-one { width: 360px; height: 360px; right: -110px; top: -155px; background: rgba(242, 199, 91, .20); }
.news-page[b-1qyu5qafng]  .hero-glow-two { width: 300px; height: 300px; left: 37%; bottom: -250px; background: rgba(255, 255, 255, .10); }
.news-page[b-1qyu5qafng]  .news-hero .mud-grid { position: relative; z-index: 2; }

.news-page[b-1qyu5qafng]  .hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,.23);
    border-radius: 999px;
    color: #fff5d8;
    background: rgba(255,255,255,.10);
    font-size: 1.04rem;
    font-weight: 650;
}

.news-page[b-1qyu5qafng]  .hero-title {
    max-width: 830px;
    margin-top: 18px;
    color: #fff;
    font-size: clamp(2.15rem, 4vw, 3.65rem);
    font-weight: 850;
    line-height: 1.18;
    letter-spacing: -.035em;
}

.news-page[b-1qyu5qafng]  .hero-description {
    max-width: 850px;
    margin-top: 16px;
    color: rgba(255,255,255,.86);
    font-size: clamp(1.12rem, 1.7vw, 1.32rem);
    font-weight: 400;
    line-height: 1.75;
}

.news-page[b-1qyu5qafng]  .hero-benefits { display: flex; flex-wrap: wrap; gap: 11px 22px; margin-top: 25px; }
.news-page[b-1qyu5qafng]  .hero-benefits span { display: inline-flex; align-items: center; gap: 7px; color: rgba(255,255,255,.92); font-size: 1.02rem; }
.news-page[b-1qyu5qafng]  .hero-benefits .mud-icon-root { color: #f5cf6e; }

.news-page[b-1qyu5qafng]  .hero-action-card {
    position: relative;
    padding: 27px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 26px;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(13px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 18px 40px rgba(0,0,0,.10);
}

.news-page[b-1qyu5qafng]  .hero-action-icon {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 20px;
    color: var(--news-green-900);
    background: linear-gradient(145deg, #fff, #f3f1df);
    box-shadow: 0 12px 24px rgba(0,0,0,.13);
}

.news-page[b-1qyu5qafng]  .hero-action-title { margin-top: 19px; color: #fff; font-size: 1.45rem; font-weight: 750; }
.news-page[b-1qyu5qafng]  .hero-action-text { margin-top: 7px; color: rgba(255,255,255,.79); font-size: 1.02rem; line-height: 1.65; }
.news-page[b-1qyu5qafng]  .hero-create-button {
    width: 100%;
    min-height: 54px;
    margin-top: 21px;
    border-radius: 15px;
    color: var(--news-green-950) !important;
    background: linear-gradient(135deg, #fff, #fff8df) !important;
    font-size: 1.08rem;
    font-weight: 750;
    box-shadow: 0 12px 25px rgba(0,0,0,.13);
}

.news-page[b-1qyu5qafng]  .summary-grid { margin-top: 5px; }
.news-page[b-1qyu5qafng]  .summary-card {
    display: flex;
    align-items: center;
    gap: 17px;
    min-height: 122px;
    padding: 21px;
    border: 1px solid var(--news-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 30px rgba(18, 70, 53, .075);
    transition: transform .2s ease, box-shadow .2s ease;
}
.news-page[b-1qyu5qafng]  .summary-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px rgba(18,70,53,.11); }
.news-page[b-1qyu5qafng]  .summary-icon { display: grid; place-items: center; flex: 0 0 61px; width: 61px; height: 61px; border-radius: 19px; }
.news-page[b-1qyu5qafng]  .summary-icon .mud-icon-root { font-size: 1.85rem; }
.news-page[b-1qyu5qafng]  .summary-green .summary-icon { color: #087353; background: #dff4e9; }
.news-page[b-1qyu5qafng]  .summary-gold .summary-icon { color: #9b6c07; background: #fff0c9; }
.news-page[b-1qyu5qafng]  .summary-blue .summary-icon { color: #2868a8; background: #e2effd; }
.news-page[b-1qyu5qafng]  .summary-purple .summary-icon { color: #7753a8; background: #eee5fb; }
.news-page[b-1qyu5qafng]  .summary-value { color: var(--news-ink); font-size: 2rem; font-weight: 800; line-height: 1.1; }
.news-page[b-1qyu5qafng]  .summary-label { margin-top: 5px; color: var(--news-muted); font-size: 1.04rem; }

.news-page[b-1qyu5qafng]  .editor-panel,
.news-page[b-1qyu5qafng]  .detail-panel,
.news-page[b-1qyu5qafng]  .filter-panel {
    margin-top: 26px;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid var(--news-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(17, 73, 54, .09);
}
.news-page[b-1qyu5qafng]  .editor-panel { border-top: 5px solid var(--news-green-700); }
.news-page[b-1qyu5qafng]  .section-heading { display: flex; align-items: center; gap: 17px; }
.news-page[b-1qyu5qafng]  .section-icon { display: grid; place-items: center; flex: 0 0 62px; width: 62px; height: 62px; border-radius: 19px; color: #fff; background: linear-gradient(135deg, var(--news-green-900), var(--news-green-700)); box-shadow: 0 12px 25px rgba(7,83,59,.20); }
.news-page[b-1qyu5qafng]  .section-icon .mud-icon-root { font-size: 1.8rem; }
.news-page[b-1qyu5qafng]  .section-title-wrap { flex: 1; min-width: 0; }
.news-page[b-1qyu5qafng]  .section-title { color: var(--news-ink); font-size: clamp(1.55rem, 2.5vw, 2rem); font-weight: 800; }
.news-page[b-1qyu5qafng]  .section-subtitle { margin-top: 4px; color: var(--news-muted); font-size: 1.04rem; line-height: 1.55; }
.news-page[b-1qyu5qafng]  .close-button { color: #61746b; background: #f0f5f2; }
.news-page[b-1qyu5qafng]  .section-divider { margin: 23px 0 27px; }

.news-page[b-1qyu5qafng]  .large-input .mud-input-label { font-size: 1.04rem; font-weight: 500; }
.news-page[b-1qyu5qafng]  .large-input input,
.news-page[b-1qyu5qafng]  .large-input textarea,
.news-page[b-1qyu5qafng]  .large-input .mud-select-input,
.news-page[b-1qyu5qafng]  .large-input .mud-input-slot { font-size: 1.06rem; }
.news-page[b-1qyu5qafng]  .large-input .mud-input-control-input-container { min-height: 58px; }
.news-page[b-1qyu5qafng]  .large-input .mud-input-helper-text { font-size: .92rem; }
.news-page[b-1qyu5qafng]  .summary-input .mud-input-control-input-container { min-height: 118px; }
.news-page[b-1qyu5qafng]  .content-input .mud-input-control-input-container { min-height: 245px; }
.news-page[b-1qyu5qafng]  .mud-input-outlined-border { border-color: #bccac3; }
.news-page[b-1qyu5qafng]  .mud-input-control.mud-input-control-margin-dense { margin-top: 0; }

.news-page[b-1qyu5qafng]  .image-upload-card { height: 100%; padding: 17px; border: 1px solid var(--news-border); border-radius: 22px; background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.news-page[b-1qyu5qafng]  .upload-preview { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 245px; overflow: hidden; border: 2px dashed #b9d4c7; border-radius: 17px; color: #628075; background: linear-gradient(145deg,#eef8f3,#e1f1e9); background-size: cover; background-position: center; }
.news-page[b-1qyu5qafng]  .upload-preview.has-preview .upload-placeholder-icon,
.news-page[b-1qyu5qafng]  .upload-preview.has-preview .upload-placeholder-text { opacity: 0; }
.news-page[b-1qyu5qafng]  .upload-placeholder-icon { font-size: 3.5rem; opacity: .65; }
.news-page[b-1qyu5qafng]  .upload-placeholder-text { margin-top: 8px; font-size: 1rem; font-weight: 600; }
.news-page[b-1qyu5qafng]  .file-picker-button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 51px; margin-top: 14px; border-radius: 14px; color: #fff; background: linear-gradient(135deg,var(--news-green-900),var(--news-green-700)); font-size: 1.05rem; font-weight: 700; cursor: pointer; }
.news-page[b-1qyu5qafng]  .file-picker-button input { display: none; }
.news-page[b-1qyu5qafng]  .upload-note { margin-top: 11px; color: var(--news-muted); font-size: .91rem; line-height: 1.5; text-align: center; }
.news-page[b-1qyu5qafng]  .option-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.news-page[b-1qyu5qafng]  .option-item { display: flex; align-items: flex-start; gap: 6px; min-height: 88px; padding: 14px; border: 1px solid var(--news-border); border-radius: 17px; background: color-mix(in srgb, var(--theme-bg) 58%, white); }
.news-page[b-1qyu5qafng]  .option-item > div:last-child { display: grid; gap: 3px; padding-top: 4px; }
.news-page[b-1qyu5qafng]  .option-item strong { color: var(--news-ink); font-size: 1rem; }
.news-page[b-1qyu5qafng]  .option-item span { color: var(--news-muted); font-size: .89rem; line-height: 1.4; }
.news-page[b-1qyu5qafng]  .editor-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 28px; }
.news-page[b-1qyu5qafng]  .primary-button,
.news-page[b-1qyu5qafng]  .secondary-button { min-height: 52px; padding: 0 24px; border-radius: 14px; font-size: 1.06rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .primary-button { color: #fff !important; background: linear-gradient(135deg,var(--news-green-900),var(--news-green-700)) !important; }
.news-page[b-1qyu5qafng]  .secondary-button { border-color: #b4c7bd !important; color: #3e5d50 !important; }

.news-page[b-1qyu5qafng]  .detail-panel { overflow: hidden; padding: 0; }
.news-page[b-1qyu5qafng]  .detail-cover { position: relative; display: flex; min-height: 380px; padding: 30px; color: #fff; background: linear-gradient(135deg,#0a7252,#06442f); background-size: cover; background-position: center; }
.news-page[b-1qyu5qafng]  .detail-cover-icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 7rem; opacity: .20; }
.news-page[b-1qyu5qafng]  .detail-cover.has-image .detail-cover-icon { opacity: 0; }
.news-page[b-1qyu5qafng]  .detail-cover-overlay { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(3,27,19,.15),rgba(3,27,19,.82)); }
.news-page[b-1qyu5qafng]  .detail-cover-top { position: relative; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; width: 100%; }
.news-page[b-1qyu5qafng]  .detail-code { padding: 8px 13px; border-radius: 999px; background: rgba(255,255,255,.16); backdrop-filter: blur(8px); font-size: .94rem; }
.news-page[b-1qyu5qafng]  .detail-close-button { color: #fff; background: rgba(0,0,0,.25); }
.news-page[b-1qyu5qafng]  .detail-cover-bottom { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 30px; }
.news-page[b-1qyu5qafng]  .detail-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.news-page[b-1qyu5qafng]  .detail-badges span { padding: 7px 11px; border-radius: 999px; font-size: .93rem; font-weight: 650; }
.news-page[b-1qyu5qafng]  .category-badge { color: #08523c; background: #fff; }
.news-page[b-1qyu5qafng]  .detail-title { max-width: 1050px; margin-top: 14px; color: #fff; font-size: clamp(1.8rem,3.4vw,3rem); font-weight: 800; line-height: 1.35; }
.news-page[b-1qyu5qafng]  .detail-body { padding: clamp(23px,4vw,42px); }
.news-page[b-1qyu5qafng]  .detail-meta-row { display: flex; flex-wrap: wrap; gap: 12px 25px; }
.news-page[b-1qyu5qafng]  .detail-meta-row span { display: inline-flex; align-items: center; gap: 7px; color: var(--news-muted); font-size: 1.01rem; }
.news-page[b-1qyu5qafng]  .detail-meta-row .mud-icon-root { color: var(--news-green-700); font-size: 1.25rem; }
.news-page[b-1qyu5qafng]  .detail-summary { margin-top: 24px; color: #244438; font-size: 1.25rem; font-weight: 600; line-height: 1.75; }
.news-page[b-1qyu5qafng]  .detail-divider { margin: 24px 0; }
.news-page[b-1qyu5qafng]  .detail-content { white-space: pre-line; color: #354a42; font-size: 1.1rem; line-height: 1.95; }
.news-page[b-1qyu5qafng]  .detail-tags { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 27px; }
.news-page[b-1qyu5qafng]  .detail-tags span { padding: 7px 12px; border-radius: 999px; color: #0a7151; background: #e6f5ed; font-size: .95rem; }
.news-page[b-1qyu5qafng]  .detail-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 30px; }

.news-page[b-1qyu5qafng]  .featured-section,
.news-page[b-1qyu5qafng]  .news-list-section { margin-top: 34px; }
.news-page[b-1qyu5qafng]  .section-header-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 17px; }
.news-page[b-1qyu5qafng]  .section-kicker { display: flex; align-items: center; gap: 8px; color: #9a6a08; font-size: 1.01rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .section-kicker .mud-icon-root { color: #d7a833; }
.news-page[b-1qyu5qafng]  .content-section-title { margin-top: 3px; color: var(--news-ink); font-size: clamp(1.65rem,2.7vw,2.2rem); font-weight: 820; }
.news-page[b-1qyu5qafng]  .content-section-subtitle { margin-top: 5px; color: var(--news-muted); font-size: 1.03rem; }
.news-page[b-1qyu5qafng]  .updated-chip { color: #426057 !important; border: 1px solid var(--news-border); background: #fff !important; font-size: .95rem; }
.news-page[b-1qyu5qafng]  .featured-card { overflow: hidden; border: 1px solid var(--news-border); border-radius: 28px; background: #fff; box-shadow: 0 19px 45px rgba(17,73,54,.10); }
.news-page[b-1qyu5qafng]  .featured-image { position: relative; display: grid; place-items: center; min-height: 430px; color: #0b7856; background: linear-gradient(145deg,#e1f4eb,#c9e7da); background-size: cover; background-position: center; }
.news-page[b-1qyu5qafng]  .featured-fallback-icon { font-size: 7rem; opacity: .22; }
.news-page[b-1qyu5qafng]  .featured-image.has-image .featured-fallback-icon { opacity: 0; }
.news-page[b-1qyu5qafng]  .featured-image-overlay { position: absolute; inset: 0; background: linear-gradient(180deg,transparent 50%,rgba(1,31,21,.53)); }
.news-page[b-1qyu5qafng]  .featured-floating-badges { position: absolute; z-index: 2; top: 20px; left: 20px; display: flex; gap: 9px; }
.news-page[b-1qyu5qafng]  .featured-floating-badges span { display: inline-flex; align-items: center; gap: 5px; padding: 8px 12px; border-radius: 999px; color: #12392b; background: rgba(255,255,255,.94); font-size: .94rem; font-weight: 700; box-shadow: 0 6px 17px rgba(0,0,0,.10); }
.news-page[b-1qyu5qafng]  .featured-content { display: flex; flex-direction: column; justify-content: center; height: 100%; min-height: 430px; padding: clamp(26px,4vw,46px); }
.news-page[b-1qyu5qafng]  .featured-category { width: max-content; padding: 7px 12px; border-radius: 999px; color: #087252; background: #e2f4eb; font-size: .95rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .featured-title { margin-top: 16px; color: var(--news-ink); font-size: clamp(1.65rem,2.5vw,2.25rem); font-weight: 800; line-height: 1.42; }
.news-page[b-1qyu5qafng]  .featured-summary { margin-top: 13px; color: var(--news-muted); font-size: 1.08rem; line-height: 1.75; }
.news-page[b-1qyu5qafng]  .featured-meta { display: flex; flex-wrap: wrap; gap: 10px 19px; margin-top: 22px; }
.news-page[b-1qyu5qafng]  .featured-meta span { display: inline-flex; align-items: center; gap: 6px; color: #52685f; font-size: .98rem; }
.news-page[b-1qyu5qafng]  .featured-meta .mud-icon-root { color: var(--news-green-700); }
.news-page[b-1qyu5qafng]  .read-featured-button { align-self: flex-start; min-height: 51px; margin-top: 25px; padding: 0 23px; border-radius: 14px; color: #fff !important; background: linear-gradient(135deg,var(--news-green-900),var(--news-green-700)) !important; font-size: 1.04rem; font-weight: 700; }

.news-page[b-1qyu5qafng]  .filter-panel { box-shadow: 0 12px 32px rgba(17,73,54,.07); }
.news-page[b-1qyu5qafng]  .filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.news-page[b-1qyu5qafng]  .filter-title { color: var(--news-ink); font-size: 1.45rem; font-weight: 760; }
.news-page[b-1qyu5qafng]  .filter-subtitle { margin-top: 4px; color: var(--news-muted); font-size: 1rem; }
.news-page[b-1qyu5qafng]  .reset-button { color: #567168; font-size: 1rem; }
.news-page[b-1qyu5qafng]  .filter-grid { margin-top: 17px; }
.news-page[b-1qyu5qafng]  .category-shortcuts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.news-page[b-1qyu5qafng]  .category-shortcut { display: inline-flex; align-items: center; gap: 7px; min-height: 43px; padding: 0 15px; border: 1px solid #cbdad3; border-radius: 13px; color: #50665d; background: #f9fcfa; font-family: "Kanit",sans-serif; font-size: .98rem; cursor: pointer; transition: .2s ease; }
.news-page[b-1qyu5qafng]  .category-shortcut:hover { border-color: #87bba4; color: #087151; transform: translateY(-1px); }
.news-page[b-1qyu5qafng]  .category-shortcut.active { border-color: transparent; color: #fff; background: linear-gradient(135deg,var(--news-green-900),var(--news-green-700)); box-shadow: 0 8px 18px rgba(7,83,59,.18); }
.news-page[b-1qyu5qafng]  .category-shortcut .mud-icon-root { font-size: 1.2rem; }
.news-page[b-1qyu5qafng]  .sort-select { width: 220px; }

.news-page[b-1qyu5qafng]  .news-card { height: 100%; overflow: hidden; border: 1px solid var(--news-border); border-radius: 25px; background: #fff; box-shadow: 0 12px 30px rgba(17,73,54,.075); transition: transform .22s ease, box-shadow .22s ease; }
.news-page[b-1qyu5qafng]  .news-card:hover { transform: translateY(-5px); box-shadow: 0 22px 43px rgba(17,73,54,.13); }
.news-page[b-1qyu5qafng]  .news-card-image { position: relative; display: grid; place-items: center; height: 230px; color: #0a7452; background: linear-gradient(145deg,#e5f5ed,#cbe8dc); background-size: cover; background-position: center; }
.news-page[b-1qyu5qafng]  .news-fallback-icon { font-size: 5.4rem; opacity: .22; }
.news-page[b-1qyu5qafng]  .news-card-image.has-image .news-fallback-icon { opacity: 0; }
.news-page[b-1qyu5qafng]  .news-image-overlay { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(3,34,23,.03),rgba(3,34,23,.40)); }
.news-page[b-1qyu5qafng]  .news-card-badges { position: absolute; z-index: 2; top: 15px; left: 15px; right: 15px; display: flex; justify-content: space-between; gap: 8px; }
.news-page[b-1qyu5qafng]  .news-card-badges span { display: inline-flex; align-items: center; gap: 5px; padding: 7px 10px; border-radius: 999px; font-size: .88rem; font-weight: 700; box-shadow: 0 5px 14px rgba(0,0,0,.08); }
.news-page[b-1qyu5qafng]  .pin-badge { color: #74530d; background: rgba(255,244,207,.96); }
.news-page[b-1qyu5qafng]  .status-published { color: #08704e !important; background: #e4f6ed !important; }
.news-page[b-1qyu5qafng]  .status-scheduled { color: #2b67a1 !important; background: #e4f0fd !important; }
.news-page[b-1qyu5qafng]  .status-draft { color: #7655a1 !important; background: #eee7f8 !important; }
.news-page[b-1qyu5qafng]  .status-archived { color: #5e6b66 !important; background: #ebefed !important; }
.news-page[b-1qyu5qafng]  .news-card-date { position: absolute; z-index: 2; right: 15px; bottom: 15px; display: grid; place-items: center; min-width: 64px; padding: 8px 10px; border-radius: 16px; color: #154536; background: rgba(255,255,255,.94); box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.news-page[b-1qyu5qafng]  .news-card-date strong { font-size: 1.43rem; line-height: 1; }
.news-page[b-1qyu5qafng]  .news-card-date span { margin-top: 3px; font-size: .87rem; }
.news-page[b-1qyu5qafng]  .news-card-body { display: flex; flex-direction: column; min-height: 390px; padding: 22px; }
.news-page[b-1qyu5qafng]  .news-card-topline { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.news-page[b-1qyu5qafng]  .news-category { display: inline-flex; align-items: center; gap: 6px; color: #087252; font-size: .94rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .priority-text { font-size: .88rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .priority-urgent { color: #b3262d !important; background: #fde7e8 !important; }
.news-page[b-1qyu5qafng]  .priority-important { color: #8a610a !important; background: #fff1cb !important; }
.news-page[b-1qyu5qafng]  .priority-normal { color: #5f6f68 !important; background: #edf2ef !important; }
.news-page[b-1qyu5qafng]  .news-card-topline .priority-text { padding: 5px 9px; border-radius: 999px; }
.news-page[b-1qyu5qafng]  .news-card-title { margin-top: 13px; color: var(--news-ink); font-size: 1.32rem; font-weight: 760; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-page[b-1qyu5qafng]  .news-card-summary { margin-top: 10px; color: var(--news-muted); font-size: 1rem; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.news-page[b-1qyu5qafng]  .news-card-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 17px; }
.news-page[b-1qyu5qafng]  .news-card-meta span { display: inline-flex; align-items: center; gap: 5px; color: var(--theme-muted); font-size: .91rem; }
.news-page[b-1qyu5qafng]  .news-card-meta .mud-icon-root { color: #0a7655; font-size: 1.1rem; }
.news-page[b-1qyu5qafng]  .news-card-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.news-page[b-1qyu5qafng]  .news-card-tags span { padding: 5px 9px; border-radius: 999px; color: #587167; background: #f0f5f2; font-size: .84rem; }
.news-page[b-1qyu5qafng]  .news-card-actions { display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 20px; }
.news-page[b-1qyu5qafng]  .card-read-button { flex: 1; min-height: 47px; border-radius: 13px; color: #fff !important; background: linear-gradient(135deg,var(--news-green-900),var(--news-green-700)) !important; font-size: .99rem; font-weight: 700; }
.news-page[b-1qyu5qafng]  .more-menu .mud-icon-button { color: #526a60; background: #f0f5f2; }

.news-page[b-1qyu5qafng]  .loading-state,
.news-page[b-1qyu5qafng]  .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 330px; margin-top: 15px; padding: 30px; text-align: center; }
.news-page[b-1qyu5qafng]  .loading-state { gap: 16px; color: var(--news-muted); font-size: 1.08rem; }
.news-page[b-1qyu5qafng]  .empty-state { gap: 10px; border: 1px dashed #bfd0c7; border-radius: 25px; background: color-mix(in srgb, var(--theme-bg) 42%, white); }
.news-page[b-1qyu5qafng]  .empty-icon { display: grid; place-items: center; width: 74px; height: 74px; margin-bottom: 6px; border-radius: 22px; color: #72847c; background: #edf3f0; }
.news-page[b-1qyu5qafng]  .empty-icon .mud-icon-root { font-size: 2.3rem; }
.news-page[b-1qyu5qafng]  .empty-state h5 { color: var(--news-ink); font-size: 1.4rem; font-weight: 750; }
.news-page[b-1qyu5qafng]  .empty-state p { color: var(--news-muted); font-size: 1rem; }
.news-page[b-1qyu5qafng]  .empty-state .primary-button { margin-top: 10px; }

@media (max-width: 1199px) {
    .news-page[b-1qyu5qafng]  .option-grid { grid-template-columns: 1fr; }
    .news-page[b-1qyu5qafng]  .featured-image,
    .news-page[b-1qyu5qafng]  .featured-content { min-height: 360px; }
}

@media (max-width: 959px) {
    .news-page[b-1qyu5qafng] { padding: 17px; }
    .news-page[b-1qyu5qafng]  .news-hero { border-radius: 25px; }
    .news-page[b-1qyu5qafng]  .section-header-row,
    .news-page[b-1qyu5qafng]  .news-list-heading { align-items: flex-start; flex-direction: column; }
    .news-page[b-1qyu5qafng]  .sort-select { width: 100%; }
    .news-page[b-1qyu5qafng]  .featured-image { min-height: 330px; }
    .news-page[b-1qyu5qafng]  .featured-content { min-height: auto; }
    .news-page[b-1qyu5qafng]  .detail-cover { min-height: 330px; }
}

@media (max-width: 599px) {
    .news-page[b-1qyu5qafng] { padding: 11px; }
    .news-page[b-1qyu5qafng]  .news-hero { padding: 25px 20px; border-radius: 21px; }
    .news-page[b-1qyu5qafng]  .hero-title { font-size: 2rem; }
    .news-page[b-1qyu5qafng]  .hero-description { font-size: 1.05rem; }
    .news-page[b-1qyu5qafng]  .hero-benefits { display: grid; gap: 9px; }
    .news-page[b-1qyu5qafng]  .hero-action-card { padding: 21px; }
    .news-page[b-1qyu5qafng]  .summary-card { min-height: 108px; padding: 16px; gap: 12px; }
    .news-page[b-1qyu5qafng]  .summary-icon { flex-basis: 50px; width: 50px; height: 50px; border-radius: 15px; }
    .news-page[b-1qyu5qafng]  .summary-value { font-size: 1.6rem; }
    .news-page[b-1qyu5qafng]  .summary-label { font-size: .93rem; }
    .news-page[b-1qyu5qafng]  .editor-panel,
    .news-page[b-1qyu5qafng]  .filter-panel { padding: 18px; border-radius: 21px; }
    .news-page[b-1qyu5qafng]  .section-heading { align-items: flex-start; }
    .news-page[b-1qyu5qafng]  .section-icon { flex-basis: 51px; width: 51px; height: 51px; }
    .news-page[b-1qyu5qafng]  .editor-actions,
    .news-page[b-1qyu5qafng]  .detail-actions { flex-direction: column-reverse; }
    .news-page[b-1qyu5qafng]  .editor-actions .mud-button-root,
    .news-page[b-1qyu5qafng]  .detail-actions .mud-button-root { width: 100%; }
    .news-page[b-1qyu5qafng]  .featured-image { min-height: 250px; }
    .news-page[b-1qyu5qafng]  .featured-content { padding: 22px; }
    .news-page[b-1qyu5qafng]  .detail-cover { min-height: 340px; padding: 20px; }
    .news-page[b-1qyu5qafng]  .detail-cover-bottom { left: 20px; right: 20px; bottom: 22px; }
    .news-page[b-1qyu5qafng]  .detail-title { font-size: 1.65rem; }
    .news-page[b-1qyu5qafng]  .detail-meta-row { display: grid; }
    .news-page[b-1qyu5qafng]  .news-card-image { height: 205px; }
    .news-page[b-1qyu5qafng]  .news-card-body { min-height: 370px; padding: 19px; }
    .news-page[b-1qyu5qafng]  .category-shortcuts { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 5px; }
    .news-page[b-1qyu5qafng]  .category-shortcut { white-space: nowrap; }
}

@media (min-width: 1800px) {
    .news-page[b-1qyu5qafng] { padding: 30px; }
    .news-page[b-1qyu5qafng]  .hero-title { font-size: 3.85rem; }
    .news-page[b-1qyu5qafng]  .hero-description { font-size: 1.38rem; }
    .news-page[b-1qyu5qafng]  .news-card-title { font-size: 1.4rem; }
    .news-page[b-1qyu5qafng]  .news-card-summary,
    .news-page[b-1qyu5qafng]  .detail-content { font-size: 1.12rem; }
}
/* /Components/Pages/05Correspondence/01Correspondence/DocumentApproval.razor.rz.scp.css */
.approval-page[b-mjd7c6moxe] {
    --green-950: #062f28;
    --green-900: #073f34;
    --green-800: #0b5949;
    --green-700: #0b745e;
    --gold: #f4c451;
    --ink: #15352f;
    --muted: #667b76;
    --line: #dce9e5;
    --soft: #f4f8f7;
    padding: 18px 8px 42px;
    font-family: "Kanit", sans-serif;
    color: var(--ink);
}

.approval-page[b-mjd7c6moxe]  .mud-typography,
.approval-page[b-mjd7c6moxe]  .mud-input,
.approval-page[b-mjd7c6moxe]  .mud-button-label,
.approval-page[b-mjd7c6moxe]  .mud-chip-content,
.approval-page[b-mjd7c6moxe]  .mud-select-input,
.approval-page[b-mjd7c6moxe]  label {
    font-family: "Kanit", sans-serif !important;
}

.approval-page[b-mjd7c6moxe]  .mud-input > input,
.approval-page[b-mjd7c6moxe]  .mud-input > textarea,
.approval-page[b-mjd7c6moxe]  .mud-select-input,
.approval-page[b-mjd7c6moxe]  .mud-input-label {
    font-size: 1.03rem !important;
}

.approval-page[b-mjd7c6moxe]  .mud-button-root {
    min-height: 46px;
    border-radius: 13px;
    font-size: 1.02rem;
    font-weight: 650;
    text-transform: none;
}

.approval-page[b-mjd7c6moxe]  .approval-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 28px;
    padding: 40px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 85% 18%, rgba(244,196,81,.25), transparent 28%),
        linear-gradient(135deg, var(--green-950), var(--green-800));
    box-shadow: 0 24px 55px rgba(4, 58, 47, .22);
    color: white;
}

.approval-page[b-mjd7c6moxe]  .approval-hero::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    right: -150px;
    bottom: -220px;
    border: 55px solid rgba(255,255,255,.055);
}

.hero-copy[b-mjd7c6moxe], .hero-action-card[b-mjd7c6moxe] { position: relative; z-index: 1; }
.hero-kicker[b-mjd7c6moxe] { display: inline-flex; align-items: center; gap: 9px; color: #e8f8f3; font-size: 1.02rem; font-weight: 600; margin-bottom: 14px; }
.approval-page[b-mjd7c6moxe]  .hero-title { color: white; font-weight: 800; line-height: 1.12; font-size: clamp(2.3rem, 4vw, 4.15rem); }
.approval-page[b-mjd7c6moxe]  .hero-subtitle { color: #d7ece6; max-width: 760px; font-size: 1.18rem; line-height: 1.75; margin-top: 12px; }
.hero-tags[b-mjd7c6moxe] { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 25px; }
.hero-tags span[b-mjd7c6moxe] { display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.17); border-radius: 999px; background: rgba(255,255,255,.08); color: #eefaf7; font-size: .98rem; }
.approval-page[b-mjd7c6moxe]  .hero-action-card { padding: 25px; border-radius: 22px; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.19); color: white; backdrop-filter: blur(12px); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.approval-page[b-mjd7c6moxe]  .hero-action-icon { font-size: 3rem; color: var(--gold); margin-bottom: 10px; }
.approval-page[b-mjd7c6moxe]  .hero-action-title { color: white; font-weight: 750; }
.approval-page[b-mjd7c6moxe]  .hero-action-text { color: #dceee9; margin: 5px 0 20px; font-size: 1.02rem; }

.summary-grid[b-mjd7c6moxe] { margin-top: 8px; }
.approval-page[b-mjd7c6moxe]  .summary-card { min-height: 135px; padding: 23px; border-radius: 21px; display: flex; gap: 17px; align-items: center; border: 1px solid var(--line); box-shadow: 0 13px 32px rgba(19,68,57,.08); background: white; }
.summary-icon[b-mjd7c6moxe] { width: 58px; height: 58px; border-radius: 17px; display: grid; place-items: center; flex: 0 0 58px; }
.summary-icon[b-mjd7c6moxe]  .mud-icon-root { font-size: 2rem; }
.summary-card span[b-mjd7c6moxe] { display: block; color: var(--muted); font-size: 1rem; }
.summary-card strong[b-mjd7c6moxe] { display: block; font-size: 2rem; line-height: 1.15; color: var(--ink); }
.summary-card small[b-mjd7c6moxe] { color: #81928e; font-size: .92rem; }
.summary-pending .summary-icon[b-mjd7c6moxe] { background: #fff2cf; color: #a66b00; }
.summary-urgent .summary-icon[b-mjd7c6moxe] { background: #ffe8e4; color: #c23729; }
.summary-overdue .summary-icon[b-mjd7c6moxe] { background: #fce8ef; color: #b22d63; }
.summary-approved .summary-icon[b-mjd7c6moxe] { background: #e3f6ec; color: #087b4c; }

.approval-page[b-mjd7c6moxe]  .filter-panel,
.approval-page[b-mjd7c6moxe]  .editor-panel { margin-top: 24px; padding: 27px; border-radius: 23px; background: white; border: 1px solid var(--line); box-shadow: 0 15px 38px rgba(14,60,50,.08); }
.filter-heading[b-mjd7c6moxe], .editor-header[b-mjd7c6moxe] { display: flex; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 21px; }
.approval-page[b-mjd7c6moxe]  .section-title, .approval-page[b-mjd7c6moxe]  .editor-title { color: var(--ink); font-weight: 780; }
.approval-page[b-mjd7c6moxe]  .section-subtitle, .approval-page[b-mjd7c6moxe]  .editor-subtitle { color: var(--muted); font-size: 1rem; margin-top: 3px; }
.editor-actions[b-mjd7c6moxe] { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }

.content-layout[b-mjd7c6moxe] { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(330px, .75fr); gap: 24px; align-items: start; margin-top: 24px; }
.approval-list[b-mjd7c6moxe] { display: grid; gap: 17px; }
.approval-page[b-mjd7c6moxe]  .approval-card { display: grid; grid-template-columns: 176px minmax(0, 1fr); overflow: hidden; border-radius: 22px; border: 1px solid var(--line); background: white; box-shadow: 0 12px 30px rgba(12,58,48,.075); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.approval-page[b-mjd7c6moxe]  .approval-card:hover { transform: translateY(-3px); border-color: #98c7b9; box-shadow: 0 19px 42px rgba(12,58,48,.13); }
.approval-page[b-mjd7c6moxe]  .approval-card.selected { border-color: var(--green-700); box-shadow: 0 0 0 3px rgba(11,116,94,.12), 0 18px 40px rgba(12,58,48,.12); }
.approval-page[b-mjd7c6moxe]  .approval-card.overdue { border-left: 5px solid #d84343; }
.approval-page[b-mjd7c6moxe]  .approval-card.pinned { border-top: 4px solid var(--gold); }
.document-visual[b-mjd7c6moxe] { position: relative; min-height: 238px; background: linear-gradient(145deg,#e6f0ed,color-mix(in srgb, var(--theme-bg) 58%, white)); overflow: hidden; }
.document-visual img[b-mjd7c6moxe] { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.document-fallback[b-mjd7c6moxe] { width: 100%; height: 100%; min-height: 238px; align-items: center; justify-content: center; background: linear-gradient(145deg,#dbeae6,#f5f9f8); color: var(--green-700); }
.document-fallback[b-mjd7c6moxe]  .mud-icon-root { font-size: 4.6rem; opacity: .82; }
.priority-badge[b-mjd7c6moxe] { display: inline-flex; padding: 6px 11px; border-radius: 999px; font-size: .88rem; font-weight: 720; white-space: nowrap; }
.document-visual > .priority-badge[b-mjd7c6moxe] { position: absolute; left: 12px; top: 12px; z-index: 2; }
.priority-normal[b-mjd7c6moxe] { background: #e8efed; color: #4b625c; }
.priority-urgent[b-mjd7c6moxe] { background: #fff0cb; color: #9a6500; }
.priority-very[b-mjd7c6moxe] { background: #ffe1d5; color: #ba4721; }
.priority-most[b-mjd7c6moxe] { background: #ffd9df; color: #b51f3c; }
.document-body[b-mjd7c6moxe] { min-width: 0; padding: 22px 23px 18px; }
.document-topline[b-mjd7c6moxe], .document-footer[b-mjd7c6moxe], .workflow-label[b-mjd7c6moxe] { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.document-codes span[b-mjd7c6moxe] { display: block; color: var(--green-700); font-weight: 740; font-size: 1rem; }
.document-codes small[b-mjd7c6moxe] { color: var(--muted); font-size: .92rem; }
.approval-page[b-mjd7c6moxe]  .status-chip { font-weight: 700; border-radius: 999px; }
.approval-page[b-mjd7c6moxe]  .status-draft { background: #e8eeec; color: #4f625e; }
.approval-page[b-mjd7c6moxe]  .status-review { background: #e5efff; color: #285fa8; }
.approval-page[b-mjd7c6moxe]  .status-pending { background: #fff0c8; color: #936000; }
.approval-page[b-mjd7c6moxe]  .status-revision { background: #ffe4d8; color: #b94d20; }
.approval-page[b-mjd7c6moxe]  .status-approved { background: #dff5e9; color: #087349; }
.approval-page[b-mjd7c6moxe]  .status-rejected { background: #fbdfe5; color: #b12645; }
.approval-page[b-mjd7c6moxe]  .status-muted { background: #ecefed; color: #62716d; }
.approval-page[b-mjd7c6moxe]  .document-title { margin-top: 11px; font-weight: 760; color: var(--ink); line-height: 1.42; font-size: 1.28rem; }
.approval-page[b-mjd7c6moxe]  .document-summary { color: var(--muted); line-height: 1.65; margin-top: 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 1rem; }
.meta-grid[b-mjd7c6moxe] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px 16px; margin-top: 16px; }
.meta-grid span[b-mjd7c6moxe], .footer-info span[b-mjd7c6moxe] { display: inline-flex; gap: 7px; align-items: center; color: #536c65; font-size: .94rem; min-width: 0; }
.meta-grid[b-mjd7c6moxe]  .mud-icon-root, .footer-info[b-mjd7c6moxe]  .mud-icon-root { font-size: 1.1rem; color: var(--green-700); }
.meta-grid .meta-overdue[b-mjd7c6moxe] { color: #c32f3f; font-weight: 680; }
.meta-grid .meta-overdue[b-mjd7c6moxe]  .mud-icon-root { color: #c32f3f; }
.workflow-progress[b-mjd7c6moxe] { margin-top: 17px; padding: 13px 15px; background: var(--soft); border-radius: 14px; }
.workflow-label[b-mjd7c6moxe] { align-items: center; margin-bottom: 8px; color: var(--muted); font-size: .92rem; }
.workflow-label strong[b-mjd7c6moxe] { color: var(--ink); font-weight: 680; }
.document-footer[b-mjd7c6moxe] { align-items: center; margin-top: 16px; padding-top: 14px; border-top: 1px solid #edf2f0; }
.footer-info[b-mjd7c6moxe] { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-info .confidential[b-mjd7c6moxe] { color: #b12f42; font-weight: 680; }
.card-actions[b-mjd7c6moxe] { display: flex; align-items: center; }

.detail-column[b-mjd7c6moxe] { position: sticky; top: 18px; }
.approval-page[b-mjd7c6moxe]  .detail-panel,
.approval-page[b-mjd7c6moxe]  .detail-empty { border-radius: 23px; background: white; border: 1px solid var(--line); box-shadow: 0 16px 38px rgba(14,60,50,.09); }
.approval-page[b-mjd7c6moxe]  .detail-empty { min-height: 310px; padding: 35px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--muted); }
.approval-page[b-mjd7c6moxe]  .detail-empty > .mud-icon-root { font-size: 4rem; color: #91afa7; margin-bottom: 13px; }
.approval-page[b-mjd7c6moxe]  .detail-empty h5 { color: var(--ink); font-weight: 720; }
.approval-page[b-mjd7c6moxe]  .detail-panel { padding: 24px; }
.detail-header[b-mjd7c6moxe] { display: flex; justify-content: space-between; align-items: flex-start; gap: 13px; }
.detail-code[b-mjd7c6moxe] { color: var(--green-700); font-weight: 720; }
.approval-page[b-mjd7c6moxe]  .detail-title { font-size: 1.45rem; line-height: 1.38; font-weight: 780; margin-top: 5px; }
.detail-status-row[b-mjd7c6moxe] { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.detail-facts[b-mjd7c6moxe] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 18px; }
.detail-facts div[b-mjd7c6moxe] { padding: 12px; background: var(--soft); border-radius: 13px; }
.detail-facts span[b-mjd7c6moxe] { display: block; color: var(--muted); font-size: .88rem; }
.detail-facts strong[b-mjd7c6moxe] { display: block; color: var(--ink); margin-top: 3px; font-size: 1rem; }
.approval-page[b-mjd7c6moxe]  .detail-section-title { font-size: 1.18rem; font-weight: 750; margin: 24px 0 12px; color: var(--ink); }
.workflow-timeline[b-mjd7c6moxe] { display: grid; gap: 0; }
.workflow-step[b-mjd7c6moxe] { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 12px; position: relative; padding-bottom: 17px; }
.workflow-step:not(:last-child)[b-mjd7c6moxe]::before { content: ""; position: absolute; left: 17px; top: 34px; bottom: 0; width: 2px; background: #d7e4e0; }
.step-marker[b-mjd7c6moxe] { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #e7efed; color: #60756f; font-weight: 750; z-index: 1; }
.workflow-step.completed .step-marker[b-mjd7c6moxe] { background: #dff5e9; color: #087349; }
.workflow-step.current .step-marker[b-mjd7c6moxe] { background: var(--green-700); color: white; box-shadow: 0 0 0 5px rgba(11,116,94,.12); }
.workflow-step.revision .step-marker[b-mjd7c6moxe] { background: #ffedd6; color: #b45c00; }
.workflow-step.rejected .step-marker[b-mjd7c6moxe] { background: #fbdfe5; color: #b12645; }
.step-content strong[b-mjd7c6moxe], .step-content span[b-mjd7c6moxe], .step-content small[b-mjd7c6moxe] { display: block; }
.step-content strong[b-mjd7c6moxe] { color: var(--ink); font-size: 1rem; }
.step-content span[b-mjd7c6moxe] { color: var(--muted); font-size: .91rem; margin-top: 2px; }
.step-content small[b-mjd7c6moxe] { color: #85948f; font-size: .85rem; margin-top: 4px; }
.approval-page[b-mjd7c6moxe]  .decision-comment { margin-top: 20px; }
.decision-actions[b-mjd7c6moxe] { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: 12px; }
.history-list[b-mjd7c6moxe] { display: grid; gap: 12px; }
.history-item[b-mjd7c6moxe] { display: grid; grid-template-columns: 39px minmax(0,1fr); gap: 11px; padding: 12px; border: 1px solid #e7efec; border-radius: 14px; }
.history-icon[b-mjd7c6moxe] { width: 39px; height: 39px; border-radius: 12px; background: #e8f3ef; color: var(--green-700); display: grid; place-items: center; }
.history-item strong[b-mjd7c6moxe], .history-item span[b-mjd7c6moxe], .history-item small[b-mjd7c6moxe] { display: block; }
.history-item strong[b-mjd7c6moxe] { color: var(--ink); }
.history-item span[b-mjd7c6moxe] { color: var(--muted); font-size: .91rem; }
.history-item small[b-mjd7c6moxe] { color: #87958f; font-size: .84rem; margin-top: 3px; }
.detail-bottom-actions[b-mjd7c6moxe] { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.approval-page[b-mjd7c6moxe]  .state-panel { min-height: 260px; border-radius: 22px; border: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; justify-content: center; align-items: center; color: var(--muted); }
.approval-page[b-mjd7c6moxe]  .state-panel > .mud-icon-root { font-size: 4rem; color: #8da9a2; }
.approval-page[b-mjd7c6moxe]  .state-panel strong { color: var(--ink); font-size: 1.25rem; }

@media (max-width: 1200px) {
    .content-layout[b-mjd7c6moxe] { grid-template-columns: 1fr; }
    .detail-column[b-mjd7c6moxe] { position: static; }
}

@media (max-width: 900px) {
    .approval-page[b-mjd7c6moxe]  .approval-hero { grid-template-columns: 1fr; padding: 30px; }
    .approval-page[b-mjd7c6moxe]  .hero-action-card { max-width: 520px; }
    .approval-page[b-mjd7c6moxe]  .approval-card { grid-template-columns: 145px minmax(0,1fr); }
    .meta-grid[b-mjd7c6moxe] { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
    .approval-page[b-mjd7c6moxe] { padding: 8px 0 28px; }
    .approval-page[b-mjd7c6moxe]  .approval-hero { border-radius: 20px; padding: 24px 20px; }
    .hero-tags[b-mjd7c6moxe] { display: none; }
    .approval-page[b-mjd7c6moxe]  .filter-panel,
    .approval-page[b-mjd7c6moxe]  .editor-panel,
    .approval-page[b-mjd7c6moxe]  .detail-panel { padding: 19px; border-radius: 18px; }
    .filter-heading[b-mjd7c6moxe], .editor-header[b-mjd7c6moxe] { align-items: flex-start; }
    .approval-page[b-mjd7c6moxe]  .approval-card { grid-template-columns: 1fr; }
    .document-visual[b-mjd7c6moxe], .document-fallback[b-mjd7c6moxe] { min-height: 180px; }
    .document-body[b-mjd7c6moxe] { padding: 18px; }
    .document-topline[b-mjd7c6moxe], .document-footer[b-mjd7c6moxe] { flex-direction: column; }
    .card-actions[b-mjd7c6moxe] { width: 100%; justify-content: flex-end; }
    .detail-facts[b-mjd7c6moxe] { grid-template-columns: 1fr; }
    .decision-actions[b-mjd7c6moxe] { grid-template-columns: 1fr; }
    .editor-actions[b-mjd7c6moxe] { flex-direction: column-reverse; }
    .editor-actions[b-mjd7c6moxe]  .mud-button-root { width: 100%; }
}
/* /Components/Pages/05Correspondence/01Correspondence/DocumentArchive.razor.rz.scp.css */
.archive-page[b-rejd3uw6e4] {
    --archive-green-950: #082e28;
    --archive-green-900: #0b3d34;
    --archive-green-800: #0f5748;
    --archive-green-700: #126b57;
    --archive-green-100: #e8f4f0;
    --archive-gold-600: #b67d17;
    --archive-gold-500: #d5a13e;
    --archive-gold-100: #fff4d8;
    --archive-red-700: #b3261e;
    --archive-red-100: #ffebe9;
    --archive-blue-700: #1769aa;
    --archive-blue-100: #e9f4ff;
    --archive-slate-950: #17211f;
    --archive-slate-700: #43514e;
    --archive-slate-500: #6d7b78;
    --archive-border: #dce7e3;
    --archive-surface: #ffffff;
    --archive-background: var(--theme-bg);
    width: 100%;
    padding: 24px;
    color: var(--archive-slate-950);
    font-family: "Kanit", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at 8% 4%, rgba(18, 107, 87, .09), transparent 28%),
        radial-gradient(circle at 94% 16%, rgba(213, 161, 62, .10), transparent 25%),
        var(--archive-background);
    min-height: 100vh;
}

.archive-page[b-rejd3uw6e4]  .mud-typography,
.archive-page[b-rejd3uw6e4]  .mud-input,
.archive-page[b-rejd3uw6e4]  .mud-button-root,
.archive-page[b-rejd3uw6e4]  .mud-select,
.archive-page[b-rejd3uw6e4]  .mud-picker {
    font-family: "Kanit", system-ui, sans-serif;
}

.archive-page[b-rejd3uw6e4]  .archive-hero {
    position: relative;
    overflow: hidden;
    padding: 42px 46px;
    border-radius: 30px;
    color: #fff;
    background:
        linear-gradient(125deg, rgba(8, 46, 40, .99) 0%, rgba(12, 77, 64, .98) 52%, rgba(18, 107, 87, .96) 100%);
    box-shadow: 0 22px 55px rgba(8, 46, 40, .23);
    border: 1px solid rgba(255, 255, 255, .12);
    isolation: isolate;
}

.hero-pattern[b-rejd3uw6e4] {
    position: absolute;
    inset: 0;
    opacity: .12;
    z-index: -1;
    background-image:
        linear-gradient(rgba(255, 255, 255, .22) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .22) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(to right, transparent, #000 30%, #000);
}

.hero-glow[b-rejd3uw6e4] {
    position: absolute;
    border-radius: 999px;
    filter: blur(2px);
    pointer-events: none;
    z-index: -1;
}

.hero-glow-one[b-rejd3uw6e4] {
    width: 280px;
    height: 280px;
    right: -90px;
    top: -110px;
    background: rgba(213, 161, 62, .21);
}

.hero-glow-two[b-rejd3uw6e4] {
    width: 190px;
    height: 190px;
    left: 41%;
    bottom: -130px;
    background: rgba(255, 255, 255, .08);
}

.hero-kicker[b-rejd3uw6e4] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .20);
    background: rgba(255, 255, 255, .10);
    backdrop-filter: blur(8px);
    font-size: 1.02rem;
    font-weight: 500;
    margin-bottom: 16px;
}

.archive-page[b-rejd3uw6e4]  .hero-title {
    color: #fff;
    font-size: clamp(2.25rem, 4.4vw, 4.15rem);
    font-weight: 800;
    line-height: 1.07;
    letter-spacing: -.03em;
    margin-bottom: 14px;
}

.archive-page[b-rejd3uw6e4]  .hero-description {
    color: rgba(255, 255, 255, .86);
    font-size: clamp(1.08rem, 1.45vw, 1.30rem);
    line-height: 1.8;
    max-width: 850px;
    font-weight: 400;
}

.hero-features[b-rejd3uw6e4] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.hero-features span[b-rejd3uw6e4] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border-radius: 12px;
    color: #fff;
    background: rgba(255, 255, 255, .09);
    border: 1px solid rgba(255, 255, 255, .13);
    font-size: 1rem;
}

.hero-action-card[b-rejd3uw6e4] {
    padding: 27px;
    border-radius: 24px;
    background: rgba(255, 255, 255, .97);
    color: var(--archive-slate-950);
    box-shadow: 0 18px 38px rgba(5, 30, 26, .22);
    border: 1px solid rgba(255, 255, 255, .65);
}

.hero-action-icon[b-rejd3uw6e4] {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, var(--archive-green-800), var(--archive-green-700));
    box-shadow: 0 10px 22px rgba(15, 87, 72, .22);
    margin-bottom: 17px;
}

.archive-page[b-rejd3uw6e4]  .hero-action-title {
    color: var(--archive-green-950);
    font-weight: 750;
    font-size: 1.45rem;
    margin-bottom: 7px;
}

.archive-page[b-rejd3uw6e4]  .hero-action-description {
    color: var(--archive-slate-700);
    font-size: 1.03rem;
    line-height: 1.65;
    margin-bottom: 20px;
}

.archive-page[b-rejd3uw6e4]  .hero-action-button {
    width: 100%;
    min-height: 50px;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, var(--archive-gold-600), var(--archive-gold-500));
    font-size: 1.05rem;
    font-weight: 650;
    box-shadow: 0 10px 21px rgba(182, 125, 23, .23);
}

.archive-page[b-rejd3uw6e4]  .summary-grid {
    margin-top: 4px;
    margin-bottom: 1px;
}

.archive-page[b-rejd3uw6e4]  .summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 126px;
    padding: 22px;
    border-radius: 22px;
    border: 1px solid var(--archive-border);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 10px 24px rgba(26, 67, 57, .07);
    transition: transform .2s ease, box-shadow .2s ease;
}

.archive-page[b-rejd3uw6e4]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(26, 67, 57, .11);
}

.summary-icon[b-rejd3uw6e4] {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
}

.summary-icon[b-rejd3uw6e4]  .mud-icon-root {
    font-size: 30px;
}

.summary-green .summary-icon[b-rejd3uw6e4] { color: var(--archive-green-800); background: var(--archive-green-100); }
.summary-gold .summary-icon[b-rejd3uw6e4] { color: var(--archive-gold-600); background: var(--archive-gold-100); }
.summary-red .summary-icon[b-rejd3uw6e4] { color: var(--archive-red-700); background: var(--archive-red-100); }
.summary-blue .summary-icon[b-rejd3uw6e4] { color: var(--archive-blue-700); background: var(--archive-blue-100); }

.archive-page[b-rejd3uw6e4]  .summary-value {
    color: var(--archive-slate-950);
    font-weight: 800;
    font-size: clamp(1.7rem, 2.2vw, 2.25rem);
    line-height: 1.1;
}

.archive-page[b-rejd3uw6e4]  .summary-label {
    color: var(--archive-slate-500);
    font-size: 1.04rem;
    margin-top: 4px;
}

.archive-page[b-rejd3uw6e4]  .editor-panel,
.archive-page[b-rejd3uw6e4]  .details-panel,
.archive-page[b-rejd3uw6e4]  .filter-panel,
.archive-page[b-rejd3uw6e4]  .loading-panel,
.archive-page[b-rejd3uw6e4]  .empty-panel {
    margin-top: 22px;
    padding: 28px;
    border-radius: 25px;
    border: 1px solid var(--archive-border);
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 12px 32px rgba(25, 67, 57, .08);
}

.archive-page[b-rejd3uw6e4]  .loading-panel,
.archive-page[b-rejd3uw6e4]  .empty-panel {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
}

.section-header[b-rejd3uw6e4],
.filter-heading[b-rejd3uw6e4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.section-heading-group[b-rejd3uw6e4] {
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.section-icon[b-rejd3uw6e4] {
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
}

.section-icon-green[b-rejd3uw6e4] {
    color: var(--archive-green-800);
    background: var(--archive-green-100);
}

.section-icon-gold[b-rejd3uw6e4] {
    color: var(--archive-gold-600);
    background: var(--archive-gold-100);
}

.archive-page[b-rejd3uw6e4]  .section-title {
    color: var(--archive-green-950);
    font-weight: 760;
    font-size: clamp(1.55rem, 2.1vw, 2rem);
    line-height: 1.25;
}

.archive-page[b-rejd3uw6e4]  .section-subtitle {
    color: var(--archive-slate-500);
    font-size: 1.04rem;
    line-height: 1.65;
    margin-top: 5px;
}

.archive-page[b-rejd3uw6e4]  .close-button {
    color: var(--archive-slate-500);
    background: #f0f5f3;
    border-radius: 12px;
}

.archive-page[b-rejd3uw6e4]  .section-divider {
    margin: 22px 0;
    border-color: var(--archive-border);
}

.archive-page[b-rejd3uw6e4]  .form-group-title {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--archive-green-900);
    font-size: 1.28rem;
    font-weight: 700;
    margin-bottom: 16px;
}

.archive-page[b-rejd3uw6e4]  .form-divider {
    margin: 25px 0 22px;
    border-color: #e5ece9;
}

.archive-page[b-rejd3uw6e4]  .large-input .mud-input-control-input-container,
.archive-page[b-rejd3uw6e4]  .large-input .mud-input-slot {
    font-size: 1.08rem;
}

.archive-page[b-rejd3uw6e4]  .large-input .mud-input-label {
    font-size: 1.05rem;
    font-weight: 500;
}

.archive-page[b-rejd3uw6e4]  .large-input .mud-input-outlined-border {
    border-radius: 14px;
    border-color: #cbd9d4;
}

.archive-page[b-rejd3uw6e4]  .large-input .mud-input-root {
    min-height: 54px;
}

.switch-box[b-rejd3uw6e4] {
    min-height: 56px;
    padding: 8px 12px;
    border: 1px solid #d4e0dc;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 3px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.switch-box span[b-rejd3uw6e4] {
    font-size: 1.03rem;
    color: var(--archive-slate-700);
}

.image-preview[b-rejd3uw6e4] {
    min-height: 190px;
    border-radius: 19px;
    overflow: hidden;
    border: 1px dashed #9eb8ae;
    position: relative;
}

.image-preview-overlay[b-rejd3uw6e4] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 18px;
    color: #fff;
    text-align: center;
    background: rgba(5, 37, 31, .38);
    font-size: 1.02rem;
}

.form-actions[b-rejd3uw6e4],
.details-actions[b-rejd3uw6e4] {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}

.archive-page[b-rejd3uw6e4]  .primary-button,
.archive-page[b-rejd3uw6e4]  .restore-button {
    min-height: 48px;
    padding-inline: 22px;
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(135deg, var(--archive-green-800), var(--archive-green-700));
    font-size: 1.04rem;
    font-weight: 650;
}

.archive-page[b-rejd3uw6e4]  .secondary-button,
.archive-page[b-rejd3uw6e4]  .download-button {
    min-height: 48px;
    padding-inline: 20px;
    border-radius: 13px;
    font-size: 1.04rem;
    font-weight: 600;
}

.archive-page[b-rejd3uw6e4]  .download-button {
    color: var(--archive-blue-700);
    border-color: rgba(23, 105, 170, .38);
}

.details-cover[b-rejd3uw6e4] {
    min-height: 310px;
    border-radius: 22px;
    overflow: hidden;
    position: relative;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
}

.details-cover-content[b-rejd3uw6e4] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 11px;
    padding: 25px;
    color: #fff;
    font-size: 1.13rem;
    font-weight: 600;
}

.document-type-icon[b-rejd3uw6e4] {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
    color: #fff;
    background: rgba(255, 255, 255, .17);
    border: 1px solid rgba(255, 255, 255, .24);
    backdrop-filter: blur(8px);
}

.details-status-row[b-rejd3uw6e4] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 13px;
}

.status-pill[b-rejd3uw6e4],
.access-pill[b-rejd3uw6e4],
.permanent-pill[b-rejd3uw6e4] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 11px;
    border-radius: 999px;
    font-size: .93rem;
    font-weight: 650;
}

.access-pill[b-rejd3uw6e4] {
    color: #4b5860;
    background: #edf2f4;
}

.permanent-pill[b-rejd3uw6e4] {
    color: #88600f;
    background: var(--archive-gold-100);
}

.status-stored[b-rejd3uw6e4] { color: #0f684d; background: #e1f4eb; }
.status-borrowed[b-rejd3uw6e4] { color: #1769aa; background: #e6f2fc; }
.status-review[b-rejd3uw6e4] { color: #9b6600; background: #fff2cf; }
.status-destruction[b-rejd3uw6e4] { color: #b04b16; background: #fff0e6; }
.status-destroyed[b-rejd3uw6e4] { color: #6b7472; background: #ecefef; }
.status-restored[b-rejd3uw6e4] { color: #5f4799; background: #f0eafd; }

.archive-page[b-rejd3uw6e4]  .details-title {
    color: var(--archive-green-950);
    font-size: clamp(1.55rem, 2.3vw, 2.15rem);
    font-weight: 760;
    line-height: 1.35;
    margin-bottom: 10px;
}

.archive-page[b-rejd3uw6e4]  .details-description {
    color: var(--archive-slate-700);
    font-size: 1.08rem;
    line-height: 1.75;
}

.details-info-grid[b-rejd3uw6e4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    margin-top: 20px;
}

.info-box[b-rejd3uw6e4] {
    padding: 13px 15px;
    border-radius: 14px;
    border: 1px solid #e1e9e6;
    background: #f9fbfa;
}

.info-box span[b-rejd3uw6e4] {
    display: block;
    color: var(--archive-slate-500);
    font-size: .91rem;
    margin-bottom: 3px;
}

.info-box strong[b-rejd3uw6e4] {
    color: var(--archive-slate-950);
    font-size: 1.02rem;
    font-weight: 650;
}

.borrow-alert[b-rejd3uw6e4] {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 16px 18px;
    border-radius: 15px;
    margin-top: 20px;
    color: #1769aa;
    background: #eaf5fd;
    border: 1px solid #c6e2f4;
}

.borrow-alert div[b-rejd3uw6e4] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.borrow-alert strong[b-rejd3uw6e4] {
    font-size: 1.05rem;
}

.borrow-alert span[b-rejd3uw6e4] {
    font-size: .96rem;
}

.borrow-overdue[b-rejd3uw6e4] {
    color: #a43b31;
    background: #fff0ee;
    border-color: #f1c8c3;
}

.result-count[b-rejd3uw6e4] {
    min-width: 92px;
    padding: 10px 14px;
    text-align: center;
    border-radius: 16px;
    color: var(--archive-green-800);
    background: var(--archive-green-100);
}

.result-count strong[b-rejd3uw6e4] {
    display: block;
    font-size: 1.65rem;
    line-height: 1;
}

.result-count span[b-rejd3uw6e4] {
    font-size: .93rem;
}

.archive-page[b-rejd3uw6e4]  .filter-grid {
    margin-top: 13px;
}

.quick-filters[b-rejd3uw6e4] {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.quick-filter[b-rejd3uw6e4] {
    appearance: none;
    border: 1px solid #cad9d4;
    background: #fff;
    color: var(--archive-slate-700);
    border-radius: 999px;
    padding: 9px 15px;
    font-family: inherit;
    font-size: .98rem;
    cursor: pointer;
    transition: all .18s ease;
}

.quick-filter:hover[b-rejd3uw6e4],
.quick-filter-active[b-rejd3uw6e4] {
    color: #fff;
    border-color: var(--archive-green-700);
    background: var(--archive-green-700);
    box-shadow: 0 7px 15px rgba(18, 107, 87, .18);
}

.empty-icon[b-rejd3uw6e4] {
    width: 76px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 23px;
    color: var(--archive-green-700);
    background: var(--archive-green-100);
}

.archive-page[b-rejd3uw6e4]  .archive-grid {
    margin-top: 8px;
}

.archive-page[b-rejd3uw6e4]  .archive-card {
    overflow: hidden;
    border-radius: 23px;
    border: 1px solid var(--archive-border);
    background: #fff;
    box-shadow: 0 10px 26px rgba(25, 67, 57, .08);
    height: 100%;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.archive-page[b-rejd3uw6e4]  .archive-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(25, 67, 57, .13);
    border-color: #b9cec6;
}

.archive-page[b-rejd3uw6e4]  .archive-card-pinned {
    border-color: rgba(213, 161, 62, .56);
    box-shadow: 0 10px 28px rgba(184, 133, 32, .11);
}

.archive-page[b-rejd3uw6e4]  .archive-card-overdue {
    border-color: rgba(179, 38, 30, .31);
}

.archive-cover[b-rejd3uw6e4] {
    position: relative;
    min-height: 178px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #fff;
}

.cover-top-row[b-rejd3uw6e4],
.cover-bottom-row[b-rejd3uw6e4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.cover-top-row .status-pill[b-rejd3uw6e4] {
    box-shadow: 0 6px 15px rgba(0, 0, 0, .12);
}

.cover-flags[b-rejd3uw6e4] {
    display: flex;
    gap: 7px;
}

.flag-badge[b-rejd3uw6e4] {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: #fff;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .22);
    backdrop-filter: blur(7px);
}

.cover-bottom-row[b-rejd3uw6e4] {
    justify-content: flex-start;
    font-size: 1.03rem;
    font-weight: 600;
}

.document-icon-box[b-rejd3uw6e4] {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: rgba(255, 255, 255, .17);
    border: 1px solid rgba(255, 255, 255, .20);
    backdrop-filter: blur(8px);
}

.archive-card-body[b-rejd3uw6e4] {
    padding: 20px;
}

.archive-code-row[b-rejd3uw6e4] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.archive-code[b-rejd3uw6e4],
.archive-year[b-rejd3uw6e4] {
    font-size: .93rem;
    font-weight: 650;
}

.archive-code[b-rejd3uw6e4] {
    color: var(--archive-green-700);
}

.archive-year[b-rejd3uw6e4] {
    color: var(--archive-slate-500);
}

.archive-page[b-rejd3uw6e4]  .archive-title {
    color: var(--archive-green-950);
    font-size: 1.28rem;
    font-weight: 720;
    line-height: 1.45;
    min-height: 3.65em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.archive-page[b-rejd3uw6e4]  .archive-description {
    color: var(--archive-slate-500);
    font-size: 1rem;
    line-height: 1.65;
    margin-top: 7px;
    min-height: 3.3em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.location-box[b-rejd3uw6e4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 17px 0 13px;
}

.location-box div[b-rejd3uw6e4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px;
    border-radius: 13px;
    color: var(--archive-slate-700);
    background: var(--theme-bg);
    font-size: .96rem;
}

.location-box[b-rejd3uw6e4]  .mud-icon-root {
    color: var(--archive-green-700);
    font-size: 21px;
}

.archive-meta[b-rejd3uw6e4] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    color: var(--archive-slate-500);
    font-size: .94rem;
}

.archive-meta span[b-rejd3uw6e4] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.review-alert[b-rejd3uw6e4] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: .94rem;
    font-weight: 550;
}

.review-soon[b-rejd3uw6e4] {
    color: #966200;
    background: #fff5d9;
    border: 1px solid #f0da9f;
}

.review-overdue[b-rejd3uw6e4] {
    color: #a43b31;
    background: #fff0ee;
    border: 1px solid #f1c8c3;
}

.archive-card-actions[b-rejd3uw6e4] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding-top: 15px;
    margin-top: 16px;
    border-top: 1px solid #e8eeec;
}

.archive-page[b-rejd3uw6e4]  .card-detail-button {
    margin-right: auto;
    color: var(--archive-green-700);
    border-radius: 11px;
    font-size: .98rem;
    font-weight: 600;
}

.archive-page[b-rejd3uw6e4]  .card-icon-button {
    color: var(--archive-slate-700);
    background: #f2f6f4;
    border-radius: 11px;
}

.archive-page[b-rejd3uw6e4]  .warning-icon-button {
    color: #a75a13;
    background: #fff5e9;
}

.archive-page[b-rejd3uw6e4]  .delete-icon-button {
    color: #b03a32;
    background: #fff0ee;
}

@media (max-width: 1200px) {
    .archive-page[b-rejd3uw6e4] {
        padding: 20px;
    }

    .archive-page[b-rejd3uw6e4]  .archive-hero {
        padding: 35px;
    }
}

@media (max-width: 768px) {
    .archive-page[b-rejd3uw6e4] {
        padding: 14px;
    }

    .archive-page[b-rejd3uw6e4]  .archive-hero {
        padding: 26px 21px;
        border-radius: 23px;
    }

    .hero-features[b-rejd3uw6e4] {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero-action-card[b-rejd3uw6e4] {
        padding: 21px;
    }

    .archive-page[b-rejd3uw6e4]  .summary-card {
        min-height: 108px;
        padding: 16px;
        gap: 11px;
    }

    .summary-icon[b-rejd3uw6e4] {
        width: 48px;
        height: 48px;
        border-radius: 15px;
    }

    .archive-page[b-rejd3uw6e4]  .editor-panel,
    .archive-page[b-rejd3uw6e4]  .details-panel,
    .archive-page[b-rejd3uw6e4]  .filter-panel,
    .archive-page[b-rejd3uw6e4]  .empty-panel {
        padding: 20px;
        border-radius: 20px;
    }

    .section-header[b-rejd3uw6e4],
    .filter-heading[b-rejd3uw6e4] {
        align-items: flex-start;
    }

    .section-icon[b-rejd3uw6e4] {
        width: 46px;
        height: 46px;
    }

    .details-info-grid[b-rejd3uw6e4],
    .location-box[b-rejd3uw6e4] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-rejd3uw6e4],
    .details-actions[b-rejd3uw6e4] {
        flex-direction: column-reverse;
    }

    .archive-page[b-rejd3uw6e4]  .form-actions .mud-button-root,
    .archive-page[b-rejd3uw6e4]  .details-actions .mud-button-root {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .archive-page[b-rejd3uw6e4] {
        padding: 10px;
    }

    .archive-page[b-rejd3uw6e4]  .hero-title {
        font-size: 2.18rem;
    }

    .hero-kicker[b-rejd3uw6e4] {
        font-size: .9rem;
    }

    .archive-page[b-rejd3uw6e4]  .summary-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .section-heading-group[b-rejd3uw6e4] {
        gap: 10px;
    }

    .result-count[b-rejd3uw6e4] {
        display: none;
    }

    .quick-filters[b-rejd3uw6e4] {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 5px;
    }

    .quick-filter[b-rejd3uw6e4] {
        flex: 0 0 auto;
    }
}
/* /Components/Pages/05Correspondence/01Correspondence/Documents.razor.rz.scp.css */
.documents-page[b-bss1pm4one] {
    --green-950: #053b2e;
    --green-900: #075541;
    --green-800: #08705a;
    --green-700: #0b876d;
    --green-100: #dff6ee;
    --green-50: #f1fbf7;
    --gold-700: #a66f08;
    --gold-500: #dca52f;
    --gold-100: #fff2cd;
    --blue-700: #1d5f9b;
    --blue-100: #e5f2ff;
    --red-700: #bb3541;
    --red-100: #ffe7e9;
    --orange-700: #b96716;
    --orange-100: #fff0dc;
    --gray-950: #111916;
    --gray-900: #17211e;
    --gray-700: #4b5b55;
    --gray-500: #72817c;
    --gray-300: #d9e2de;
    --gray-200: #e8eeeb;
    --gray-100: #f4f7f5;
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(circle at 8% 0%, rgba(12, 135, 109, 0.10), transparent 28%),
        radial-gradient(circle at 96% 8%, rgba(220, 165, 47, 0.13), transparent 24%),
        var(--theme-bg);
    color: var(--gray-900);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
}

.documents-page[b-bss1pm4one]  .documents-hero {
    position: relative;
    overflow: hidden;
    padding: 38px 40px;
    border-radius: 28px;
    color: #fff;
    background: linear-gradient(135deg, rgba(5, 59, 46, 0.99), rgba(8, 112, 90, 0.96));
    box-shadow: 0 24px 54px rgba(5, 59, 46, 0.25);
}

.hero-grid-pattern[b-bss1pm4one] {
    position: absolute;
    inset: 0;
    opacity: 0.14;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.18) 1px, transparent 1px);
    background-size: 34px 34px;
    pointer-events: none;
}

.hero-orb[b-bss1pm4one] { position: absolute; border-radius: 50%; pointer-events: none; }
.hero-orb-one[b-bss1pm4one] { width: 310px; height: 310px; top: -190px; right: 18%; background: rgba(255, 215, 120, 0.14); }
.hero-orb-two[b-bss1pm4one] { width: 220px; height: 220px; right: -70px; bottom: -105px; background: rgba(255, 255, 255, 0.10); }

.hero-kicker[b-bss1pm4one] {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    margin-bottom: 16px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    font-size: 1.02rem;
    font-weight: 600;
}

.documents-page[b-bss1pm4one]  .hero-title {
    position: relative;
    z-index: 2;
    margin-bottom: 12px;
    color: #fff;
    font-size: clamp(2.2rem, 4vw, 3.35rem);
    font-weight: 800;
    line-height: 1.15;
}

.documents-page[b-bss1pm4one]  .hero-description {
    position: relative;
    z-index: 2;
    max-width: 920px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1.18rem;
    line-height: 1.75;
}

.hero-benefits[b-bss1pm4one] { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.hero-benefits span[b-bss1pm4one] { display: inline-flex; align-items: center; gap: 8px; padding: 9px 13px; border-radius: 12px; background: rgba(255, 255, 255, 0.11); color: rgba(255, 255, 255, 0.94); font-size: 1rem; font-weight: 500; }

.hero-action-card[b-bss1pm4one] {
    position: relative;
    z-index: 2;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 23px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--gray-900);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}

.hero-action-icon[b-bss1pm4one] { display: grid; place-items: center; width: 68px; height: 68px; margin-bottom: 16px; border-radius: 19px; background: linear-gradient(145deg, var(--gold-500), var(--gold-700)); color: #fff; box-shadow: 0 12px 24px rgba(198, 139, 24, 0.25); }
.documents-page[b-bss1pm4one]  .hero-action-title { color: var(--green-950); font-size: 1.38rem; font-weight: 750; }
.documents-page[b-bss1pm4one]  .hero-action-text { margin-top: 5px; color: var(--gray-700); font-size: 1.04rem; line-height: 1.6; }

.documents-page[b-bss1pm4one]  .hero-create-button,
.documents-page[b-bss1pm4one]  .primary-button,
.documents-page[b-bss1pm4one]  .compact-primary-button {
    min-height: 48px;
    border-radius: 13px;
    background: var(--green-900);
    color: #fff;
    font-family: inherit;
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: none;
}

.documents-page[b-bss1pm4one]  .hero-create-button { width: 100%; margin-top: 18px; }

.documents-page[b-bss1pm4one]  .summary-grid { margin-top: 10px; }
.documents-page[b-bss1pm4one]  .summary-card { display: flex; align-items: center; gap: 16px; min-height: 118px; padding: 21px; border: 1px solid var(--gray-200); border-radius: 20px; background: rgba(255, 255, 255, 0.97); box-shadow: 0 10px 26px rgba(26, 66, 53, 0.07); }
.summary-icon[b-bss1pm4one] { display: grid; flex: 0 0 auto; place-items: center; width: 58px; height: 58px; border-radius: 17px; }
.summary-green .summary-icon[b-bss1pm4one] { background: var(--green-100); color: var(--green-800); }
.summary-gold .summary-icon[b-bss1pm4one] { background: var(--gold-100); color: var(--gold-700); }
.summary-red .summary-icon[b-bss1pm4one] { background: var(--red-100); color: var(--red-700); }
.summary-blue .summary-icon[b-bss1pm4one] { background: var(--blue-100); color: var(--blue-700); }
.documents-page[b-bss1pm4one]  .summary-value { color: var(--gray-900); font-size: 1.78rem; font-weight: 800; line-height: 1.1; }
.documents-page[b-bss1pm4one]  .summary-label { margin-top: 5px; color: var(--gray-700); font-size: 1.02rem; font-weight: 550; }

.documents-page[b-bss1pm4one]  .editor-panel,
.documents-page[b-bss1pm4one]  .detail-panel,
.documents-page[b-bss1pm4one]  .folder-panel,
.documents-page[b-bss1pm4one]  .filter-panel {
    padding: 28px;
    border: 1px solid var(--gray-200);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 14px 36px rgba(26, 66, 53, 0.09);
}

.documents-page[b-bss1pm4one]  .editor-panel,
.documents-page[b-bss1pm4one]  .detail-panel { margin-top: 22px; }
.documents-page[b-bss1pm4one]  .editor-panel { border-top: 5px solid var(--green-800); }
.documents-page[b-bss1pm4one]  .detail-panel { border-top: 5px solid var(--blue-700); }
.documents-page[b-bss1pm4one]  .workspace-grid { margin-top: 6px; }
.documents-page[b-bss1pm4one]  .folder-panel { position: sticky; top: 18px; }

.section-heading[b-bss1pm4one],
.filter-heading[b-bss1pm4one],
.panel-title-row[b-bss1pm4one],
.results-heading[b-bss1pm4one] { display: flex; align-items: center; gap: 16px; }
.section-title-wrap[b-bss1pm4one] { flex: 1; min-width: 0; }
.section-icon[b-bss1pm4one] { display: grid; flex: 0 0 auto; place-items: center; width: 58px; height: 58px; border-radius: 17px; }
.section-icon-green[b-bss1pm4one] { background: var(--green-100); color: var(--green-800); }
.section-icon-blue[b-bss1pm4one] { background: var(--blue-100); color: var(--blue-700); }
.documents-page[b-bss1pm4one]  .section-title { color: var(--gray-900); font-size: 1.52rem; font-weight: 800; }
.documents-page[b-bss1pm4one]  .section-subtitle { margin-top: 3px; color: var(--gray-700); font-size: 1.02rem; line-height: 1.55; }
.documents-page[b-bss1pm4one]  .close-button,
.documents-page[b-bss1pm4one]  .refresh-button { width: 46px; height: 46px; border: 1px solid var(--gray-200); border-radius: 13px; background: var(--gray-100); color: var(--gray-700); }
.documents-page[b-bss1pm4one]  .section-divider { margin: 22px 0; }
.documents-page[b-bss1pm4one]  .form-divider { margin: 28px 0 22px; }
.documents-page[b-bss1pm4one]  .form-group-title { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; color: var(--green-950); font-size: 1.25rem; font-weight: 750; }

.documents-page[b-bss1pm4one]  .large-input .mud-input-label { color: var(--gray-700); font-family: inherit; font-size: 1.03rem; font-weight: 550; }
.documents-page[b-bss1pm4one]  .large-input .mud-input-root,
.documents-page[b-bss1pm4one]  .large-input input,
.documents-page[b-bss1pm4one]  .large-input textarea,
.documents-page[b-bss1pm4one]  .large-input .mud-select-input { min-height: 48px; font-family: inherit; font-size: 1.06rem; }
.documents-page[b-bss1pm4one]  .large-input .mud-input-outlined-border { border-color: #cfdad5; border-radius: 13px; }
.documents-page[b-bss1pm4one]  .mud-picker-input-button { color: var(--green-800); }
.documents-page[b-bss1pm4one]  .mud-switch-label { font-family: inherit; font-size: 1.04rem; }

.switch-row[b-bss1pm4one] { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; min-height: 56px; padding: 5px 12px; border: 1px solid var(--gray-200); border-radius: 13px; background: var(--gray-100); }
.form-actions[b-bss1pm4one] { display: flex; justify-content: flex-end; gap: 12px; margin-top: 28px; }
.documents-page[b-bss1pm4one]  .secondary-button { min-height: 48px; border-radius: 13px; border-color: #b7c8c1; color: var(--green-900); font-family: inherit; font-size: 1.04rem; font-weight: 650; text-transform: none; }

.image-preview[b-bss1pm4one] { min-height: 210px; margin-top: 22px; border: 1px solid var(--gray-200); border-radius: 20px; background-position: center; background-size: cover; background-color: var(--green-50); overflow: hidden; }
.image-preview-overlay[b-bss1pm4one] { display: flex; min-height: 210px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff; background: rgba(5, 59, 46, 0.25); font-size: 1.06rem; font-weight: 650; }

.detail-cover[b-bss1pm4one] { display: flex; min-height: 310px; flex-direction: column; align-items: center; justify-content: center; gap: 14px; border-radius: 22px; background-position: center; background-size: cover; background-color: var(--green-100); color: var(--green-900); box-shadow: inset 0 0 0 1px rgba(5, 59, 46, 0.08); }
.detail-cover span[b-bss1pm4one] { padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.9); font-size: 1rem; font-weight: 750; }
.detail-badges[b-bss1pm4one],
.card-badges[b-bss1pm4one],
.list-badges[b-bss1pm4one],
.tag-row[b-bss1pm4one] { display: flex; flex-wrap: wrap; gap: 8px; }
.documents-page[b-bss1pm4one]  .detail-title { margin-top: 16px; color: var(--gray-900); font-size: 1.7rem; font-weight: 800; line-height: 1.35; }
.documents-page[b-bss1pm4one]  .detail-description { margin-top: 9px; color: var(--gray-700); font-size: 1.07rem; line-height: 1.7; }
.detail-info-grid[b-bss1pm4one] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.detail-info-grid > div[b-bss1pm4one] { padding: 14px 16px; border: 1px solid var(--gray-200); border-radius: 14px; background: var(--gray-100); }
.detail-info-grid span[b-bss1pm4one] { display: block; margin-bottom: 4px; color: var(--gray-500); font-size: 0.96rem; }
.detail-info-grid strong[b-bss1pm4one] { display: block; color: var(--gray-900); font-size: 1.04rem; font-weight: 650; word-break: break-word; }
.tag-row[b-bss1pm4one] { margin-top: 18px; }
.document-tag[b-bss1pm4one] { padding: 6px 10px; border-radius: 999px; background: var(--green-50); color: var(--green-800); font-size: 0.96rem; font-weight: 600; }
.detail-actions[b-bss1pm4one] { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

.panel-title-row[b-bss1pm4one] { justify-content: space-between; }
.documents-page[b-bss1pm4one]  .panel-title { color: var(--gray-900); font-size: 1.3rem; font-weight: 800; }
.documents-page[b-bss1pm4one]  .panel-subtitle { color: var(--gray-500); font-size: 0.98rem; }
.panel-title-icon[b-bss1pm4one] { color: var(--green-800); }
.folder-list[b-bss1pm4one] { display: grid; gap: 7px; margin-top: 20px; }
.folder-button[b-bss1pm4one],
.quick-button[b-bss1pm4one] { width: 100%; border: 0; font-family: inherit; cursor: pointer; transition: 0.18s ease; }
.folder-button[b-bss1pm4one] { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 10px 12px; border-radius: 12px; background: transparent; color: var(--gray-700); font-size: 1.01rem; text-align: left; }
.folder-button span[b-bss1pm4one] { display: flex; min-width: 0; align-items: center; gap: 10px; }
.folder-button strong[b-bss1pm4one] { display: grid; flex: 0 0 auto; place-items: center; min-width: 30px; height: 30px; border-radius: 9px; background: var(--gray-100); color: var(--gray-700); }
.folder-button:hover[b-bss1pm4one] { background: var(--gray-100); transform: translateX(2px); }
.folder-button-active[b-bss1pm4one] { background: var(--green-100); color: var(--green-900); font-weight: 700; }
.folder-button-active strong[b-bss1pm4one] { background: var(--green-800); color: #fff; }
.folder-divider[b-bss1pm4one] { margin: 22px 0; }
.documents-page[b-bss1pm4one]  .quick-title { margin-bottom: 10px; color: var(--gray-900); font-size: 1.08rem; font-weight: 750; }
.quick-links[b-bss1pm4one] { display: grid; gap: 7px; }
.quick-button[b-bss1pm4one] { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 9px 12px; border-radius: 11px; background: transparent; color: var(--gray-700); font-size: 1rem; text-align: left; }
.quick-button:hover[b-bss1pm4one] { background: var(--gray-100); }
.quick-button-active[b-bss1pm4one] { background: var(--gold-100); color: var(--gold-700); font-weight: 700; }
.storage-card[b-bss1pm4one] { margin-top: 24px; padding: 16px; border-radius: 16px; background: linear-gradient(145deg, var(--green-950), var(--green-800)); color: #fff; }
.storage-heading[b-bss1pm4one] { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.storage-heading span[b-bss1pm4one] { display: flex; align-items: center; gap: 8px; font-size: 1.02rem; font-weight: 600; }
.documents-page[b-bss1pm4one]  .storage-text { margin-top: 9px; color: rgba(255, 255, 255, 0.78); font-size: 0.93rem; }

.documents-page[b-bss1pm4one]  .filter-panel { margin-bottom: 22px; }
.documents-page[b-bss1pm4one]  .filter-grid { margin-top: 12px; }
.view-toolbar[b-bss1pm4one] { display: flex; align-items: center; gap: 10px; min-height: 56px; }
.documents-page[b-bss1pm4one]  .view-button { flex: 1; min-height: 48px; border-radius: 12px; font-family: inherit; font-size: 1rem; font-weight: 650; text-transform: none; }
.documents-page[b-bss1pm4one]  .view-button.mud-button-filled { background: var(--green-900); color: #fff; }
.results-heading[b-bss1pm4one] { justify-content: space-between; margin: 4px 0 14px; }
.documents-page[b-bss1pm4one]  .results-title { color: var(--gray-900); font-size: 1.55rem; font-weight: 800; }
.documents-page[b-bss1pm4one]  .results-subtitle { color: var(--gray-500); font-size: 1rem; }

.documents-page[b-bss1pm4one]  .document-card { height: 100%; overflow: hidden; border: 1px solid var(--gray-200); border-radius: 21px; background: #fff; box-shadow: 0 10px 26px rgba(26, 66, 53, 0.07); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.documents-page[b-bss1pm4one]  .document-card:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(26, 66, 53, 0.13); }
.document-cover[b-bss1pm4one] { position: relative; display: flex; min-height: 175px; align-items: center; justify-content: center; background-position: center; background-size: cover; overflow: hidden; }
.document-cover[b-bss1pm4one]::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(5,59,46,0.16)); pointer-events: none; }
.file-cover-pdf[b-bss1pm4one] { background-color: #fff0f1; color: #c83b48; }
.file-cover-word[b-bss1pm4one] { background-color: #eaf3ff; color: #236fb1; }
.file-cover-excel[b-bss1pm4one] { background-color: #e8f7ef; color: #197a4b; }
.file-cover-image[b-bss1pm4one] { background-color: #fff4df; color: #aa6a08; }
.file-cover-generic[b-bss1pm4one] { background-color: #eef3f1; color: #52635c; }
.cover-top-row[b-bss1pm4one] { position: absolute; z-index: 3; top: 12px; left: 12px; right: 12px; display: flex; align-items: center; justify-content: space-between; }
.file-type-pill[b-bss1pm4one] { padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,0.92); color: var(--gray-900); font-size: 0.9rem; font-weight: 800; box-shadow: 0 5px 15px rgba(0,0,0,0.08); }
.documents-page[b-bss1pm4one]  .favorite-button { width: 40px; height: 40px; border-radius: 12px; background: rgba(255,255,255,0.92); color: var(--gold-700); box-shadow: 0 5px 15px rgba(0,0,0,0.08); }
.cover-file-icon[b-bss1pm4one] { position: relative; z-index: 2; font-size: 4.4rem !important; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.10)); }
.pinned-badge[b-bss1pm4one] { position: absolute; z-index: 3; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border-radius: 999px; background: var(--gold-500); color: #fff; font-size: 0.9rem; font-weight: 700; }
.document-card-body[b-bss1pm4one] { padding: 20px; }
.documents-page[b-bss1pm4one]  .document-title { display: -webkit-box; min-height: 58px; margin-top: 13px; overflow: hidden; color: var(--gray-900); font-size: 1.23rem; font-weight: 780; line-height: 1.42; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.documents-page[b-bss1pm4one]  .document-code { margin-top: 5px; color: var(--green-800); font-size: 0.96rem; font-weight: 650; }
.documents-page[b-bss1pm4one]  .document-description { display: -webkit-box; min-height: 50px; margin-top: 9px; overflow: hidden; color: var(--gray-700); font-size: 1rem; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.document-meta[b-bss1pm4one] { display: grid; gap: 8px; margin-top: 16px; }
.document-meta span[b-bss1pm4one] { display: flex; align-items: center; gap: 8px; color: var(--gray-700); font-size: 0.97rem; }
.expiry-warning[b-bss1pm4one] { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 9px 11px; border-radius: 11px; background: var(--red-100); color: var(--red-700); font-size: 0.94rem; font-weight: 650; }
.documents-page[b-bss1pm4one]  .card-divider { margin: 17px 0 13px; }
.card-footer[b-bss1pm4one] { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.activity-counts[b-bss1pm4one] { display: flex; align-items: center; gap: 12px; color: var(--gray-500); font-size: 0.92rem; }
.activity-counts span[b-bss1pm4one] { display: inline-flex; align-items: center; gap: 5px; }
.card-actions[b-bss1pm4one] { display: flex; align-items: center; gap: 2px; }
.documents-page[b-bss1pm4one]  .action-button { width: 36px; height: 36px; color: var(--green-800); }
.documents-page[b-bss1pm4one]  .action-danger { color: var(--red-700); }

.badge[b-bss1pm4one] { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; font-size: 0.9rem; font-weight: 700; line-height: 1.2; }
.badge-success[b-bss1pm4one] { background: var(--green-100); color: var(--green-800); }
.badge-success-soft[b-bss1pm4one] { background: #edf8f3; color: #33775f; }
.badge-warning[b-bss1pm4one] { background: var(--gold-100); color: var(--gold-700); }
.badge-warning-soft[b-bss1pm4one] { background: var(--orange-100); color: var(--orange-700); }
.badge-danger[b-bss1pm4one] { background: var(--red-100); color: var(--red-700); }
.badge-danger-soft[b-bss1pm4one] { background: #fde8eb; color: #9e2632; }
.badge-blue[b-bss1pm4one] { background: var(--blue-100); color: var(--blue-700); }
.badge-neutral[b-bss1pm4one] { background: #edf1ef; color: #586760; }

.document-list[b-bss1pm4one] { display: grid; gap: 12px; }
.documents-page[b-bss1pm4one]  .document-list-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid var(--gray-200); border-radius: 17px; background: #fff; box-shadow: 0 7px 20px rgba(26, 66, 53, 0.06); }
.list-file-icon[b-bss1pm4one] { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; font-size: 1.8rem; }
.list-main[b-bss1pm4one] { min-width: 0; }
.list-title-row[b-bss1pm4one] { display: flex; align-items: center; gap: 8px; }
.documents-page[b-bss1pm4one]  .list-title { overflow: hidden; color: var(--gray-900); font-size: 1.16rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.pin-icon[b-bss1pm4one] { flex: 0 0 auto; color: var(--gold-700); }
.documents-page[b-bss1pm4one]  .list-subtitle { margin: 4px 0 8px; color: var(--gray-500); font-size: 0.96rem; }
.list-stats[b-bss1pm4one] { display: grid; gap: 5px; color: var(--gray-700); font-size: 0.94rem; text-align: right; white-space: nowrap; }
.list-stats span[b-bss1pm4one] { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.list-actions[b-bss1pm4one] { display: flex; align-items: center; gap: 8px; }
.documents-page[b-bss1pm4one]  .favorite-list-button { color: var(--gold-700); }
.documents-page[b-bss1pm4one]  .compact-button,
.documents-page[b-bss1pm4one]  .compact-primary-button { min-height: 40px; border-radius: 10px; font-family: inherit; font-size: 0.96rem; font-weight: 650; text-transform: none; }

.documents-page[b-bss1pm4one]  .empty-state { display: flex; min-height: 300px; flex-direction: column; align-items: center; justify-content: center; gap: 13px; padding: 34px; border: 1px dashed #bfd0c8; border-radius: 22px; background: rgba(255,255,255,0.86); text-align: center; }
.empty-icon[b-bss1pm4one] { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 22px; background: var(--green-100); color: var(--green-800); }
.documents-page[b-bss1pm4one]  .empty-title { color: var(--gray-900); font-size: 1.35rem; font-weight: 750; }
.documents-page[b-bss1pm4one]  .empty-text { max-width: 540px; color: var(--gray-700); font-size: 1.03rem; }

@media (max-width: 1280px) {
    .documents-page[b-bss1pm4one]  .document-list-row { grid-template-columns: 58px minmax(0, 1fr) auto; }
    .list-stats[b-bss1pm4one] { display: none; }
}

@media (max-width: 959px) {
    .documents-page[b-bss1pm4one] { padding: 16px; }
    .documents-page[b-bss1pm4one]  .documents-hero { padding: 30px 24px; border-radius: 23px; }
    .documents-page[b-bss1pm4one]  .folder-panel { position: static; }
    .detail-info-grid[b-bss1pm4one] { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .documents-page[b-bss1pm4one] { padding: 10px; }
    .documents-page[b-bss1pm4one]  .documents-hero { padding: 26px 18px; border-radius: 19px; }
    .hero-benefits[b-bss1pm4one] { display: grid; }
    .hero-benefits span[b-bss1pm4one] { width: 100%; }
    .documents-page[b-bss1pm4one]  .editor-panel,
    .documents-page[b-bss1pm4one]  .detail-panel,
    .documents-page[b-bss1pm4one]  .folder-panel,
    .documents-page[b-bss1pm4one]  .filter-panel { padding: 20px 16px; border-radius: 18px; }
    .section-heading[b-bss1pm4one],
    .filter-heading[b-bss1pm4one] { align-items: flex-start; }
    .section-icon[b-bss1pm4one] { width: 50px; height: 50px; border-radius: 15px; }
    .form-actions[b-bss1pm4one],
    .detail-actions[b-bss1pm4one],
    .results-heading[b-bss1pm4one] { align-items: stretch; flex-direction: column; }
    .documents-page[b-bss1pm4one]  .primary-button,
    .documents-page[b-bss1pm4one]  .secondary-button { width: 100%; }
    .documents-page[b-bss1pm4one]  .document-list-row { grid-template-columns: 52px minmax(0, 1fr); align-items: start; }
    .list-file-icon[b-bss1pm4one] { width: 50px; height: 50px; }
    .list-actions[b-bss1pm4one] { grid-column: 1 / -1; justify-content: flex-end; flex-wrap: wrap; }
    .list-title-row[b-bss1pm4one] { align-items: flex-start; }
    .documents-page[b-bss1pm4one]  .list-title { white-space: normal; }
    .view-toolbar[b-bss1pm4one] { flex-direction: column; }
    .documents-page[b-bss1pm4one]  .view-button { width: 100%; }
}
/* /Components/Pages/05Correspondence/01Correspondence/IncomingCorrespondence.razor.rz.scp.css */
.incoming-page[b-6o2mtn9whv] {
    --green-950: #063b30;
    --green-900: #07503f;
    --green-800: #0a664f;
    --green-700: #0d7a5d;
    --green-100: #dcf4ea;
    --green-50: #f2fbf7;
    --blue-700: #245f9e;
    --blue-100: #e5f0ff;
    --gold-600: #b77c13;
    --gold-500: #d6a52d;
    --gold-100: #fff1c9;
    --red-700: #b52b38;
    --red-100: #ffe5e8;
    --orange-700: #ad5c13;
    --orange-100: #ffedd8;
    --purple-700: #7043a5;
    --purple-100: #eee7ff;
    --ink-950: #17231f;
    --ink-900: #26352f;
    --ink-700: #53645e;
    --ink-500: #7b8b85;
    --line: #dbe8e2;
    --surface: #ffffff;
    width: 100%;
    padding: 8px 2px 46px;
    color: var(--ink-900);
    font-family: "Kanit", sans-serif;
}

.incoming-page[b-6o2mtn9whv]  .mud-typography-root,
.incoming-page[b-6o2mtn9whv]  .mud-input,
.incoming-page[b-6o2mtn9whv]  .mud-input-label,
.incoming-page[b-6o2mtn9whv]  .mud-button-label,
.incoming-page[b-6o2mtn9whv]  .mud-chip-content,
.incoming-page[b-6o2mtn9whv]  .mud-table-cell,
.incoming-page[b-6o2mtn9whv]  .mud-picker,
.incoming-page[b-6o2mtn9whv]  .mud-switch-span {
    font-family: "Kanit", sans-serif !important;
}

.incoming-page[b-6o2mtn9whv]  .incoming-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4.2vw, 58px);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 30px;
    color: #fff;
    background:
        linear-gradient(125deg, rgba(4, 49, 39, .99), rgba(7, 88, 67, .97) 57%, rgba(14, 124, 91, .93)),
        radial-gradient(circle at 82% 12%, rgba(255, 222, 128, .25), transparent 34%);
    box-shadow: 0 24px 58px rgba(5, 58, 43, .22);
}

.incoming-page[b-6o2mtn9whv]  .hero-grid-pattern {
    position: absolute;
    inset: 0;
    opacity: .15;
    background-image:
        linear-gradient(rgba(255, 255, 255, .14) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .14) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to left, #000, transparent 74%);
}

.incoming-page[b-6o2mtn9whv]  .hero-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.incoming-page[b-6o2mtn9whv]  .hero-orb-one {
    top: -120px;
    right: 21%;
    width: 290px;
    height: 290px;
    background: rgba(255, 224, 140, .18);
}

.incoming-page[b-6o2mtn9whv]  .hero-orb-two {
    right: -110px;
    bottom: -150px;
    width: 360px;
    height: 360px;
    background: rgba(255, 255, 255, .09);
}

.incoming-page[b-6o2mtn9whv]  .incoming-hero .mud-grid,
.incoming-page[b-6o2mtn9whv]  .incoming-hero .mud-grid-item {
    position: relative;
    z-index: 2;
}

.incoming-page[b-6o2mtn9whv]  .hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    margin-bottom: 18px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 1.08rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
}

.incoming-page[b-6o2mtn9whv]  .hero-title {
    margin-bottom: 10px !important;
    color: #fff !important;
    font-size: clamp(2.55rem, 4vw, 4.45rem) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-description {
    max-width: 940px;
    color: rgba(255, 255, 255, .9) !important;
    font-size: 1.2rem !important;
    font-weight: 400 !important;
    line-height: 1.78 !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
    margin-top: 24px;
}

.incoming-page[b-6o2mtn9whv]  .hero-benefits span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 1.06rem;
    font-weight: 500;
}

.incoming-page[b-6o2mtn9whv]  .hero-action-card {
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 25px;
    background: rgba(255, 255, 255, .97);
    color: var(--ink-900);
    box-shadow: 0 24px 52px rgba(2, 39, 29, .28);
    backdrop-filter: blur(14px);
}

.incoming-page[b-6o2mtn9whv]  .hero-action-icon {
    display: grid;
    width: 70px;
    height: 70px;
    margin-bottom: 18px;
    place-items: center;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(145deg, var(--gold-500), #e2b94f);
    box-shadow: 0 14px 28px rgba(207, 157, 42, .32);
}

.incoming-page[b-6o2mtn9whv]  .hero-action-icon .mud-icon-root {
    font-size: 2.2rem;
}

.incoming-page[b-6o2mtn9whv]  .hero-action-title {
    color: var(--ink-950) !important;
    font-size: 1.48rem !important;
    font-weight: 750 !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-action-text {
    margin: 7px 0 19px !important;
    color: var(--ink-700) !important;
    font-size: 1.06rem !important;
    line-height: 1.65 !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-create-button,
.incoming-page[b-6o2mtn9whv]  .primary-button,
.incoming-page[b-6o2mtn9whv]  .blue-action-button {
    min-height: 52px;
    border-radius: 14px !important;
    color: #fff !important;
    font-size: 1.07rem !important;
    font-weight: 650 !important;
    box-shadow: 0 10px 24px rgba(10, 75, 58, .22) !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-create-button,
.incoming-page[b-6o2mtn9whv]  .primary-button {
    background: linear-gradient(135deg, var(--green-900), var(--green-700)) !important;
}

.incoming-page[b-6o2mtn9whv]  .hero-create-button {
    width: 100%;
}

.incoming-page[b-6o2mtn9whv]  .blue-action-button {
    background: linear-gradient(135deg, #245f9e, #347abf) !important;
}

.incoming-page[b-6o2mtn9whv]  .summary-grid {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
}

.incoming-page[b-6o2mtn9whv]  .summary-card {
    display: flex;
    align-items: center;
    gap: 17px;
    min-height: 122px;
    padding: 21px;
    border: 1px solid rgba(13, 96, 73, .10);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 13px 32px rgba(19, 57, 47, .075);
    transition: transform .18s ease, box-shadow .18s ease;
}

.incoming-page[b-6o2mtn9whv]  .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 19px 40px rgba(19, 57, 47, .12);
}

.incoming-page[b-6o2mtn9whv]  .summary-icon {
    display: grid;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    place-items: center;
    border-radius: 18px;
}

.incoming-page[b-6o2mtn9whv]  .summary-icon .mud-icon-root {
    font-size: 1.9rem;
}

.incoming-page[b-6o2mtn9whv]  .summary-green .summary-icon { color: #087252; background: var(--green-100); }
.incoming-page[b-6o2mtn9whv]  .summary-blue .summary-icon { color: var(--blue-700); background: var(--blue-100); }
.incoming-page[b-6o2mtn9whv]  .summary-red .summary-icon { color: var(--red-700); background: var(--red-100); }
.incoming-page[b-6o2mtn9whv]  .summary-gold .summary-icon { color: #97660e; background: var(--gold-100); }

.incoming-page[b-6o2mtn9whv]  .summary-value {
    color: var(--ink-950) !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
}

.incoming-page[b-6o2mtn9whv]  .summary-label {
    margin-top: 5px !important;
    color: var(--ink-700) !important;
    font-size: 1.07rem !important;
    font-weight: 550 !important;
}

.incoming-page[b-6o2mtn9whv]  .editor-panel,
.incoming-page[b-6o2mtn9whv]  .detail-panel,
.incoming-page[b-6o2mtn9whv]  .workspace-panel {
    margin-top: 19px;
    padding: clamp(22px, 3vw, 36px);
    border: 1px solid var(--line);
    border-radius: 26px;
    background: var(--surface);
    box-shadow: 0 16px 42px rgba(18, 60, 49, .08);
}

.incoming-page[b-6o2mtn9whv]  .section-heading {
    display: flex;
    align-items: center;
    gap: 17px;
}

.incoming-page[b-6o2mtn9whv]  .section-icon {
    display: grid;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    place-items: center;
    border-radius: 18px;
}

.incoming-page[b-6o2mtn9whv]  .section-icon .mud-icon-root {
    font-size: 1.9rem;
}

.incoming-page[b-6o2mtn9whv]  .section-icon-green { color: var(--green-800); background: var(--green-100); }
.incoming-page[b-6o2mtn9whv]  .section-icon-blue { color: var(--blue-700); background: var(--blue-100); }

.incoming-page[b-6o2mtn9whv]  .section-title-wrap {
    flex: 1;
    min-width: 0;
}

.incoming-page[b-6o2mtn9whv]  .section-title {
    color: var(--ink-950) !important;
    font-size: clamp(1.55rem, 2.5vw, 2.15rem) !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
}

.incoming-page[b-6o2mtn9whv]  .section-subtitle {
    margin-top: 5px !important;
    color: var(--ink-700) !important;
    font-size: 1.06rem !important;
    line-height: 1.6 !important;
}

.incoming-page[b-6o2mtn9whv]  .close-button {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--ink-700);
    background: #fff;
}

.incoming-page[b-6o2mtn9whv]  .section-divider,
.incoming-page[b-6o2mtn9whv]  .workspace-divider {
    margin: 22px 0 25px;
    border-color: var(--line) !important;
}

.incoming-page[b-6o2mtn9whv]  .form-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 17px !important;
    color: var(--green-900) !important;
    font-size: 1.32rem !important;
    font-weight: 700 !important;
}

.incoming-page[b-6o2mtn9whv]  .form-group-spacing {
    margin-top: 31px !important;
}

.incoming-page[b-6o2mtn9whv]  .large-input .mud-input-control-input-container {
    min-height: 58px;
}

.incoming-page[b-6o2mtn9whv]  .large-input .mud-input-slot {
    font-size: 1.08rem !important;
    line-height: 1.5 !important;
}

.incoming-page[b-6o2mtn9whv]  .large-input .mud-input-label {
    color: #50645c !important;
    font-size: 1.02rem !important;
    font-weight: 500 !important;
}

.incoming-page[b-6o2mtn9whv]  .large-input .mud-input-outlined-border {
    border-color: #cbdad4 !important;
    border-radius: 14px !important;
}

.incoming-page[b-6o2mtn9whv]  .large-input:hover .mud-input-outlined-border {
    border-color: var(--green-700) !important;
}

.incoming-page[b-6o2mtn9whv]  .large-input.mud-input-control-margin-dense .mud-input-control-input-container {
    min-height: 54px;
}

.incoming-page[b-6o2mtn9whv]  .title-input .mud-input-slot {
    font-weight: 600 !important;
}

.incoming-page[b-6o2mtn9whv]  .switch-card {
    height: 100%;
    min-height: 102px;
    padding: 15px 18px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--green-50);
}

.incoming-page[b-6o2mtn9whv]  .switch-card .mud-switch-label {
    color: var(--ink-950) !important;
    font-size: 1.08rem !important;
    font-weight: 650 !important;
}

.incoming-page[b-6o2mtn9whv]  .switch-card .mud-typography-root {
    margin: 2px 0 0 52px !important;
    color: var(--ink-700) !important;
    font-size: .98rem !important;
    line-height: 1.5 !important;
}

.incoming-page[b-6o2mtn9whv]  .upload-panel {
    height: 100%;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--theme-bg) 42%, white));
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-head {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 16px;
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-icon {
    display: grid;
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 15px;
    color: var(--green-800);
    background: var(--green-100);
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-icon-blue {
    color: var(--blue-700);
    background: var(--blue-100);
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-head strong,
.incoming-page[b-6o2mtn9whv]  .upload-panel-head span {
    display: block;
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-head strong {
    color: var(--ink-950);
    font-size: 1.11rem;
}

.incoming-page[b-6o2mtn9whv]  .upload-panel-head span {
    margin-top: 3px;
    color: var(--ink-700);
    font-size: .96rem;
}

.incoming-page[b-6o2mtn9whv]  .native-upload-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 52px;
    padding: 11px 17px;
    border: 1px dashed rgba(8, 114, 82, .55);
    border-radius: 15px;
    color: var(--green-900);
    background: var(--green-50);
    font-size: 1.05rem;
    font-weight: 650;
    cursor: pointer;
    transition: all .18s ease;
}

.incoming-page[b-6o2mtn9whv]  .native-upload-button:hover {
    border-color: var(--green-700);
    background: var(--green-100);
}

.incoming-page[b-6o2mtn9whv]  .native-upload-blue {
    border-color: rgba(36, 95, 158, .48);
    color: var(--blue-700);
    background: #f3f8ff;
}

.incoming-page[b-6o2mtn9whv]  .native-upload-button input[type="file"] {
    display: none;
}

.incoming-page[b-6o2mtn9whv]  .upload-preview {
    overflow: hidden;
    margin-top: 15px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #eef4f1;
}

.incoming-page[b-6o2mtn9whv]  .upload-preview img {
    display: block;
    width: 100%;
    max-height: 260px;
    object-fit: cover;
}

.incoming-page[b-6o2mtn9whv]  .selected-file {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid #dce7f5;
    border-radius: 13px;
    color: var(--blue-700);
    background: #f6f9fe;
    font-size: 1rem;
    font-weight: 550;
    overflow-wrap: anywhere;
}

.incoming-page[b-6o2mtn9whv]  .file-path-grid {
    margin-top: 8px !important;
}

.incoming-page[b-6o2mtn9whv]  .form-actions,
.incoming-page[b-6o2mtn9whv]  .detail-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 29px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
}

.incoming-page[b-6o2mtn9whv]  .secondary-button {
    min-height: 50px;
    padding-inline: 20px !important;
    border-color: #b9cbc4 !important;
    border-radius: 14px !important;
    color: var(--ink-900) !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
}

.incoming-page[b-6o2mtn9whv]  .archive-button {
    min-height: 50px;
    border-radius: 14px !important;
    color: #6b7571 !important;
    font-size: 1.03rem !important;
    font-weight: 600 !important;
}

.incoming-page[b-6o2mtn9whv]  .detail-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.incoming-page[b-6o2mtn9whv]  .detail-subject-block {
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: linear-gradient(135deg, var(--green-50), #fff 72%);
}

.incoming-page[b-6o2mtn9whv]  .detail-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 14px;
}

.incoming-page[b-6o2mtn9whv]  .detail-subject {
    color: var(--ink-950) !important;
    font-size: clamp(1.48rem, 2.3vw, 2rem) !important;
    font-weight: 750 !important;
    line-height: 1.45 !important;
}

.incoming-page[b-6o2mtn9whv]  .detail-summary {
    margin-top: 13px !important;
    color: var(--ink-700) !important;
    font-size: 1.1rem !important;
    line-height: 1.75 !important;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card {
    position: relative;
    min-height: 145px;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card > .mud-icon-root {
    margin-bottom: 10px;
    color: var(--green-700);
    font-size: 1.6rem;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card span,
.incoming-page[b-6o2mtn9whv]  .detail-info-card strong,
.incoming-page[b-6o2mtn9whv]  .detail-info-card small {
    display: block;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card span {
    color: var(--ink-500);
    font-size: .94rem;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card strong {
    margin-top: 4px;
    color: var(--ink-950);
    font-size: 1.07rem;
    line-height: 1.45;
}

.incoming-page[b-6o2mtn9whv]  .detail-info-card small {
    margin-top: 5px;
    color: var(--ink-700);
    font-size: .96rem;
    line-height: 1.4;
}

.incoming-page[b-6o2mtn9whv]  .note-box {
    display: flex;
    gap: 13px;
    margin-top: 16px;
    padding: 17px 19px;
    border: 1px solid #f0dfad;
    border-radius: 17px;
    background: #fffbef;
}

.incoming-page[b-6o2mtn9whv]  .note-box > .mud-icon-root {
    flex: 0 0 auto;
    color: var(--gold-600);
}

.incoming-page[b-6o2mtn9whv]  .note-box strong {
    color: #6f5010;
    font-size: 1.05rem;
}

.incoming-page[b-6o2mtn9whv]  .note-box p {
    margin: 5px 0 0;
    color: #735f35;
    font-size: 1rem;
    line-height: 1.6;
}

.incoming-page[b-6o2mtn9whv]  .scan-card {
    height: 100%;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.incoming-page[b-6o2mtn9whv]  .scan-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.incoming-page[b-6o2mtn9whv]  .scan-card-head > .mud-icon-root {
    flex: 0 0 auto;
    color: var(--green-700);
    font-size: 1.75rem;
}

.incoming-page[b-6o2mtn9whv]  .scan-card-head strong,
.incoming-page[b-6o2mtn9whv]  .scan-card-head span {
    display: block;
}

.incoming-page[b-6o2mtn9whv]  .scan-card-head strong {
    color: var(--ink-950);
    font-size: 1.08rem;
}

.incoming-page[b-6o2mtn9whv]  .scan-card-head span {
    margin-top: 2px;
    color: var(--ink-700);
    font-size: .92rem;
    overflow-wrap: anywhere;
}

.incoming-page[b-6o2mtn9whv]  .scan-preview {
    position: relative;
    overflow: hidden;
    min-height: 250px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #e9f1ed;
}

.incoming-page[b-6o2mtn9whv]  .scan-preview img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.incoming-page[b-6o2mtn9whv]  .scan-fallback,
.incoming-page[b-6o2mtn9whv]  .scan-empty {
    display: grid;
    min-height: 250px;
    place-items: center;
    align-content: center;
    gap: 10px;
    color: var(--ink-500);
    background: linear-gradient(135deg, var(--theme-bg), #eaf2ee);
    text-align: center;
}

.incoming-page[b-6o2mtn9whv]  .scan-fallback {
    display: none;
}

.incoming-page[b-6o2mtn9whv]  .scan-fallback .mud-icon-root,
.incoming-page[b-6o2mtn9whv]  .scan-empty .mud-icon-root {
    font-size: 2.6rem;
}

.incoming-page[b-6o2mtn9whv]  .attachment-box {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid #d8e5f5;
    border-radius: 15px;
    background: #f4f8fe;
}

.incoming-page[b-6o2mtn9whv]  .attachment-box > .mud-icon-root {
    color: var(--blue-700);
    font-size: 1.55rem;
}

.incoming-page[b-6o2mtn9whv]  .attachment-box strong,
.incoming-page[b-6o2mtn9whv]  .attachment-box span {
    display: block;
}

.incoming-page[b-6o2mtn9whv]  .attachment-box strong {
    color: var(--ink-950);
    font-size: 1.02rem;
}

.incoming-page[b-6o2mtn9whv]  .attachment-box span {
    margin-top: 2px;
    color: var(--ink-700);
    font-size: .92rem;
    overflow-wrap: anywhere;
}

.incoming-page[b-6o2mtn9whv]  .workspace-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

.incoming-page[b-6o2mtn9whv]  .workspace-kicker {
    margin-bottom: 5px;
    color: var(--green-700);
    font-size: .98rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.incoming-page[b-6o2mtn9whv]  .workspace-title {
    color: var(--ink-950) !important;
    font-size: clamp(1.55rem, 2.5vw, 2.2rem) !important;
    font-weight: 750 !important;
}

.incoming-page[b-6o2mtn9whv]  .workspace-subtitle {
    margin-top: 6px !important;
    color: var(--ink-700) !important;
    font-size: 1.07rem !important;
    line-height: 1.6 !important;
}

.incoming-page[b-6o2mtn9whv]  .result-badge {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    border-radius: 999px;
    color: var(--green-900);
    background: var(--green-100);
    font-size: 1.05rem;
    font-weight: 700;
    white-space: nowrap;
}

.incoming-page[b-6o2mtn9whv]  .filter-grid {
    margin-top: 19px !important;
}

.incoming-page[b-6o2mtn9whv]  .filter-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    margin-top: 13px;
}

.incoming-page[b-6o2mtn9whv]  .quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.incoming-page[b-6o2mtn9whv]  .quick-chip {
    height: 38px;
    border: 1px solid #c7e7db !important;
    color: var(--green-900) !important;
    background: var(--green-50) !important;
    font-size: .98rem !important;
    font-weight: 600 !important;
    cursor: pointer;
}

.incoming-page[b-6o2mtn9whv]  .quick-chip-red {
    border-color: #f0c6cb !important;
    color: var(--red-700) !important;
    background: #fff4f5 !important;
}

.incoming-page[b-6o2mtn9whv]  .quick-chip-orange {
    border-color: #efcfaf !important;
    color: var(--orange-700) !important;
    background: #fff7ef !important;
}

.incoming-page[b-6o2mtn9whv]  .reset-button {
    color: var(--green-800) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.incoming-page[b-6o2mtn9whv]  .incoming-table {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 19px;
}

.incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-head {
    background: linear-gradient(180deg, #f5faf7, #edf6f2);
}

.incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-head .mud-table-cell {
    padding: 17px 15px !important;
    color: var(--ink-900) !important;
    font-size: 1.01rem !important;
    font-weight: 700 !important;
    border-bottom-color: var(--line) !important;
}

.incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-row {
    transition: background .16s ease;
}

.incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-row:hover {
    background: color-mix(in srgb, var(--theme-bg) 58%, white) !important;
}

.incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-cell {
    padding: 17px 15px !important;
    color: var(--ink-900) !important;
    font-size: 1rem !important;
    vertical-align: top;
    border-bottom-color: var(--theme-border) !important;
}

.incoming-page[b-6o2mtn9whv]  .registration-cell strong,
.incoming-page[b-6o2mtn9whv]  .registration-cell span,
.incoming-page[b-6o2mtn9whv]  .registration-cell small,
.incoming-page[b-6o2mtn9whv]  .subject-cell strong,
.incoming-page[b-6o2mtn9whv]  .subject-cell span,
.incoming-page[b-6o2mtn9whv]  .subject-cell small,
.incoming-page[b-6o2mtn9whv]  .assignee-cell strong,
.incoming-page[b-6o2mtn9whv]  .assignee-cell span {
    display: block;
}

.incoming-page[b-6o2mtn9whv]  .registration-cell strong {
    color: var(--green-900);
    font-size: 1.05rem;
    font-weight: 750;
}

.incoming-page[b-6o2mtn9whv]  .registration-cell span {
    margin-top: 5px;
    color: var(--ink-700);
    font-size: .95rem;
}

.incoming-page[b-6o2mtn9whv]  .registration-cell small {
    margin-top: 5px;
    color: var(--ink-500);
    font-size: .91rem;
}

.incoming-page[b-6o2mtn9whv]  .subject-cell {
    max-width: 560px;
}

.incoming-page[b-6o2mtn9whv]  .subject-cell strong {
    color: var(--ink-950);
    font-size: 1.04rem;
    font-weight: 650;
    line-height: 1.55;
}

.incoming-page[b-6o2mtn9whv]  .subject-cell span {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 7px;
    color: var(--ink-700);
    font-size: .97rem;
}

.incoming-page[b-6o2mtn9whv]  .subject-cell small {
    margin-top: 5px;
    color: var(--ink-500);
    font-size: .91rem;
}

.incoming-page[b-6o2mtn9whv]  .priority-cell {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}

.incoming-page[b-6o2mtn9whv]  .due-text,
.incoming-page[b-6o2mtn9whv]  .overdue-text {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
}

.incoming-page[b-6o2mtn9whv]  .due-text { color: var(--ink-700); }
.incoming-page[b-6o2mtn9whv]  .overdue-text { color: var(--red-700); font-weight: 650; }

.incoming-page[b-6o2mtn9whv]  .assignee-cell strong {
    color: var(--ink-950);
    font-size: 1rem;
    font-weight: 650;
}

.incoming-page[b-6o2mtn9whv]  .assignee-cell span {
    margin-top: 5px;
    color: var(--ink-700);
    font-size: .94rem;
}

.incoming-page[b-6o2mtn9whv]  .status-chip,
.incoming-page[b-6o2mtn9whv]  .priority-chip,
.incoming-page[b-6o2mtn9whv]  .type-chip,
.incoming-page[b-6o2mtn9whv]  .overdue-chip {
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    font-weight: 650 !important;
}

.incoming-page[b-6o2mtn9whv]  .status-new { color: #1f659d !important; background: #eaf4ff !important; border-color: #c7def3 !important; }
.incoming-page[b-6o2mtn9whv]  .status-registered { color: #6f4b9e !important; background: #f2ecff !important; border-color: #ddcff6 !important; }
.incoming-page[b-6o2mtn9whv]  .status-pending { color: #9a6511 !important; background: #fff5d9 !important; border-color: #efdca4 !important; }
.incoming-page[b-6o2mtn9whv]  .status-progress { color: #ad5c13 !important; background: #ffedd8 !important; border-color: #efc99f !important; }
.incoming-page[b-6o2mtn9whv]  .status-completed { color: #087252 !important; background: #e2f5ed !important; border-color: #bce6d6 !important; }
.incoming-page[b-6o2mtn9whv]  .status-archived { color: #616c68 !important; background: #eef1f0 !important; border-color: #d7ddda !important; }

.incoming-page[b-6o2mtn9whv]  .priority-normal { color: #53645e !important; background: #f1f5f3 !important; border-color: #d8e2de !important; }
.incoming-page[b-6o2mtn9whv]  .priority-urgent { color: #ad5c13 !important; background: #ffedd8 !important; border-color: #efc99f !important; }
.incoming-page[b-6o2mtn9whv]  .priority-very-urgent { color: #b52b38 !important; background: #ffe8ea !important; border-color: #f2c0c6 !important; }
.incoming-page[b-6o2mtn9whv]  .priority-immediate { color: #fff !important; background: linear-gradient(135deg, #b6202e, #df4452) !important; border-color: #b6202e !important; }
.incoming-page[b-6o2mtn9whv]  .type-chip { color: var(--blue-700) !important; background: var(--blue-100) !important; border-color: #c9ddf6 !important; }
.incoming-page[b-6o2mtn9whv]  .overdue-chip { color: #fff !important; background: var(--red-700) !important; border-color: var(--red-700) !important; }

.incoming-page[b-6o2mtn9whv]  .action-column {
    width: 150px;
    text-align: center !important;
}

.incoming-page[b-6o2mtn9whv]  .table-actions {
    display: flex;
    justify-content: center;
    gap: 6px;
}

.incoming-page[b-6o2mtn9whv]  .action-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
}

.incoming-page[b-6o2mtn9whv]  .action-view { color: var(--blue-700); background: #edf5ff; }
.incoming-page[b-6o2mtn9whv]  .action-edit { color: var(--green-800); background: var(--green-50); }
.incoming-page[b-6o2mtn9whv]  .action-delete { color: var(--red-700); background: #fff0f2; }

.incoming-page[b-6o2mtn9whv]  .empty-state,
.incoming-page[b-6o2mtn9whv]  .loading-state {
    display: grid;
    min-height: 260px;
    place-items: center;
    align-content: center;
    gap: 10px;
    padding: 35px;
    color: var(--ink-700);
    text-align: center;
}

.incoming-page[b-6o2mtn9whv]  .empty-state > .mud-icon-root {
    color: #9fb3ab;
    font-size: 3.3rem;
}

.incoming-page[b-6o2mtn9whv]  .empty-state .mud-typography-h5 {
    color: var(--ink-950) !important;
    font-weight: 700 !important;
}

.incoming-page[b-6o2mtn9whv]  .mud-table-pagination {
    min-height: 64px;
    color: var(--ink-700);
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
    font-size: .98rem;
}

@media (max-width: 1100px) {
    .incoming-page[b-6o2mtn9whv]  .hero-action-card {
        max-width: 600px;
    }

    .incoming-page[b-6o2mtn9whv]  .detail-info-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 760px) {
    .incoming-page[b-6o2mtn9whv] {
        padding-bottom: 28px;
    }

    .incoming-page[b-6o2mtn9whv]  .incoming-hero {
        padding: 26px 20px;
        border-radius: 23px;
    }

    .incoming-page[b-6o2mtn9whv]  .hero-title {
        font-size: 2.45rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .hero-description {
        font-size: 1.08rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .hero-benefits {
        display: grid;
        gap: 10px;
    }

    .incoming-page[b-6o2mtn9whv]  .summary-card {
        display: block;
        min-height: 144px;
        padding: 17px;
    }

    .incoming-page[b-6o2mtn9whv]  .summary-icon {
        width: 54px;
        height: 54px;
        margin-bottom: 12px;
    }

    .incoming-page[b-6o2mtn9whv]  .summary-value {
        font-size: 1.8rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .summary-label {
        font-size: .98rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .editor-panel,
    .incoming-page[b-6o2mtn9whv]  .detail-panel,
    .incoming-page[b-6o2mtn9whv]  .workspace-panel {
        padding: 19px 15px;
        border-radius: 21px;
    }

    .incoming-page[b-6o2mtn9whv]  .section-heading {
        align-items: flex-start;
    }

    .incoming-page[b-6o2mtn9whv]  .section-icon {
        flex-basis: 52px;
        width: 52px;
        height: 52px;
    }

    .incoming-page[b-6o2mtn9whv]  .workspace-heading {
        display: block;
    }

    .incoming-page[b-6o2mtn9whv]  .result-badge {
        margin-top: 13px;
    }

    .incoming-page[b-6o2mtn9whv]  .detail-info-grid {
        grid-template-columns: 1fr;
    }

    .incoming-page[b-6o2mtn9whv]  .form-actions,
    .incoming-page[b-6o2mtn9whv]  .detail-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .incoming-page[b-6o2mtn9whv]  .form-actions .mud-button-root,
    .incoming-page[b-6o2mtn9whv]  .detail-actions .mud-button-root {
        width: 100%;
    }

    .incoming-page[b-6o2mtn9whv]  .filter-actions-row {
        display: block;
    }

    .incoming-page[b-6o2mtn9whv]  .reset-button {
        margin-top: 10px;
    }

    .incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-row {
        margin-bottom: 13px;
        border: 1px solid var(--line);
        border-radius: 16px;
        background: #fff;
        box-shadow: 0 8px 22px rgba(20, 62, 51, .06);
    }

    .incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-cell {
        padding: 12px 14px !important;
    }

    .incoming-page[b-6o2mtn9whv]  .action-column {
        width: auto;
        text-align: left !important;
    }

    .incoming-page[b-6o2mtn9whv]  .table-actions {
        justify-content: flex-start;
    }
}

@media (min-width: 1700px) {
    .incoming-page[b-6o2mtn9whv]  .hero-description,
    .incoming-page[b-6o2mtn9whv]  .section-subtitle,
    .incoming-page[b-6o2mtn9whv]  .workspace-subtitle {
        font-size: 1.25rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .large-input .mud-input-slot {
        font-size: 1.14rem !important;
    }

    .incoming-page[b-6o2mtn9whv]  .incoming-table .mud-table-body .mud-table-cell {
        font-size: 1.06rem !important;
    }
}
/* /Components/Pages/05Correspondence/01Correspondence/OutgoingCorrespondence.razor.rz.scp.css */
.outgoing-page[b-nglh1lvf3k] {
    --green-950: #053b2e;
    --green-900: #075541;
    --green-800: #08705a;
    --green-700: #0b876d;
    --green-100: #dff6ee;
    --green-50: #f1fbf7;
    --gold-600: #c68b18;
    --gold-500: #dca52f;
    --gold-100: #fff2cd;
    --blue-700: #1d5f9b;
    --blue-100: #e5f2ff;
    --red-700: #bb3541;
    --red-100: #ffe7e9;
    --gray-900: #17211e;
    --gray-700: #4b5b55;
    --gray-500: #72817c;
    --gray-300: #d9e2de;
    --gray-200: #e8eeeb;
    --gray-100: #f4f7f5;
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(circle at 8% 0%, rgba(12, 135, 109, 0.10), transparent 28%),
        radial-gradient(circle at 96% 8%, rgba(220, 165, 47, 0.13), transparent 24%),
        var(--theme-bg);
    color: var(--gray-900);
    font-family: "Kanit", "Noto Sans Thai", sans-serif;
}

.outgoing-page[b-nglh1lvf3k]  .outgoing-hero {
    position: relative;
    overflow: hidden;
    padding: 38px 40px;
    border-radius: 28px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(5, 59, 46, 0.98), rgba(8, 112, 90, 0.96)),
        #075541;
    box-shadow: 0 24px 54px rgba(5, 59, 46, 0.25);
}

.hero-grid-pattern[b-nglh1lvf3k] {
    position: absolute;
    inset: 0;
    opacity: 0.14;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.18) 1px, transparent 1px);
    background-size: 34px 34px;
    pointer-events: none;
}

.hero-orb[b-nglh1lvf3k] {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.hero-orb-one[b-nglh1lvf3k] {
    width: 310px;
    height: 310px;
    top: -190px;
    right: 18%;
    background: rgba(255, 215, 120, 0.14);
}

.hero-orb-two[b-nglh1lvf3k] {
    width: 220px;
    height: 220px;
    right: -70px;
    bottom: -105px;
    background: rgba(255, 255, 255, 0.10);
}

.hero-kicker[b-nglh1lvf3k] {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    margin-bottom: 16px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    font-size: 1.02rem;
    font-weight: 600;
}

.outgoing-page[b-nglh1lvf3k]  .hero-title {
    position: relative;
    z-index: 2;
    margin-bottom: 12px;
    color: #fff;
    font-size: clamp(2.2rem, 4vw, 3.35rem);
    font-weight: 800;
    line-height: 1.15;
}

.outgoing-page[b-nglh1lvf3k]  .hero-description {
    position: relative;
    z-index: 2;
    max-width: 900px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1.18rem;
    font-weight: 400;
    line-height: 1.75;
}

.hero-benefits[b-nglh1lvf3k] {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.hero-benefits span[b-nglh1lvf3k] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.11);
    color: rgba(255, 255, 255, 0.94);
    font-size: 1rem;
    font-weight: 500;
}

.hero-action-card[b-nglh1lvf3k] {
    position: relative;
    z-index: 2;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 23px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--gray-900);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}

.hero-action-icon[b-nglh1lvf3k] {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    margin-bottom: 16px;
    border-radius: 19px;
    background: linear-gradient(145deg, var(--gold-500), var(--gold-600));
    color: #fff;
    box-shadow: 0 12px 24px rgba(198, 139, 24, 0.25);
}

.outgoing-page[b-nglh1lvf3k]  .hero-action-title {
    color: var(--green-950);
    font-size: 1.38rem;
    font-weight: 750;
}

.outgoing-page[b-nglh1lvf3k]  .hero-action-text {
    margin-top: 5px;
    color: var(--gray-700);
    font-size: 1.04rem;
    line-height: 1.6;
}

.outgoing-page[b-nglh1lvf3k]  .hero-create-button {
    width: 100%;
    min-height: 50px;
    margin-top: 18px;
    border-radius: 13px;
    background: var(--green-900);
    color: #fff;
    font-family: inherit;
    font-size: 1.08rem;
    font-weight: 700;
    text-transform: none;
}

.outgoing-page[b-nglh1lvf3k]  .summary-grid {
    margin-top: 10px;
    margin-bottom: 4px;
}

.outgoing-page[b-nglh1lvf3k]  .summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 118px;
    padding: 21px;
    border: 1px solid var(--gray-200);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 26px rgba(26, 66, 53, 0.07);
}

.summary-icon[b-nglh1lvf3k] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 17px;
}

.summary-gray .summary-icon[b-nglh1lvf3k] { background: #eef1f0; color: #596761; }
.summary-blue .summary-icon[b-nglh1lvf3k] { background: var(--blue-100); color: var(--blue-700); }
.summary-gold .summary-icon[b-nglh1lvf3k] { background: var(--gold-100); color: #9d6b09; }
.summary-green .summary-icon[b-nglh1lvf3k] { background: var(--green-100); color: var(--green-800); }

.outgoing-page[b-nglh1lvf3k]  .summary-value {
    color: var(--gray-900);
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.1;
}

.outgoing-page[b-nglh1lvf3k]  .summary-label {
    margin-top: 5px;
    color: var(--gray-700);
    font-size: 1.02rem;
    font-weight: 550;
}

.outgoing-page[b-nglh1lvf3k]  .editor-panel,
.outgoing-page[b-nglh1lvf3k]  .detail-panel,
.outgoing-page[b-nglh1lvf3k]  .filter-panel {
    margin-top: 22px;
    padding: 28px;
    border: 1px solid var(--gray-200);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 14px 36px rgba(26, 66, 53, 0.09);
}

.outgoing-page[b-nglh1lvf3k]  .editor-panel {
    border-top: 5px solid var(--green-800);
}

.outgoing-page[b-nglh1lvf3k]  .detail-panel {
    border-top: 5px solid var(--blue-700);
}

.section-heading[b-nglh1lvf3k],
.filter-heading[b-nglh1lvf3k] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.section-title-wrap[b-nglh1lvf3k] {
    flex: 1;
    min-width: 0;
}

.section-icon[b-nglh1lvf3k] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    border-radius: 17px;
}

.section-icon-green[b-nglh1lvf3k] { background: var(--green-100); color: var(--green-800); }
.section-icon-blue[b-nglh1lvf3k] { background: var(--blue-100); color: var(--blue-700); }

.outgoing-page[b-nglh1lvf3k]  .section-title {
    color: var(--gray-900);
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.25;
}

.outgoing-page[b-nglh1lvf3k]  .section-subtitle {
    margin-top: 4px;
    color: var(--gray-700);
    font-size: 1.04rem;
    line-height: 1.55;
}

.outgoing-page[b-nglh1lvf3k]  .close-button {
    color: var(--gray-700);
}

.outgoing-page[b-nglh1lvf3k]  .section-divider {
    margin: 22px 0 26px;
}

.outgoing-page[b-nglh1lvf3k]  .form-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 18px;
    color: var(--green-950);
    font-size: 1.28rem;
    font-weight: 750;
}

.outgoing-page[b-nglh1lvf3k]  .form-group-title .mud-icon-root {
    color: var(--green-700);
}

.outgoing-page[b-nglh1lvf3k]  .form-divider {
    margin: 26px 0;
}

.outgoing-page[b-nglh1lvf3k]  .large-input .mud-input-label,
.outgoing-page[b-nglh1lvf3k]  .large-input .mud-input-label-outlined {
    color: #52635c;
    font-family: inherit;
    font-size: 1.02rem;
    font-weight: 550;
}

.outgoing-page[b-nglh1lvf3k]  .large-input input,
.outgoing-page[b-nglh1lvf3k]  .large-input textarea,
.outgoing-page[b-nglh1lvf3k]  .large-input .mud-select-input {
    color: var(--gray-900);
    font-family: inherit;
    font-size: 1.08rem;
    font-weight: 500;
}

.outgoing-page[b-nglh1lvf3k]  .large-input .mud-input-outlined-border {
    border-color: #cdd9d4;
    border-width: 1.3px;
    border-radius: 13px;
}

.outgoing-page[b-nglh1lvf3k]  .large-input:hover .mud-input-outlined-border {
    border-color: var(--green-700);
}

.outgoing-page[b-nglh1lvf3k]  .large-input.mud-input-control {
    margin-top: 2px;
}

.switch-column[b-nglh1lvf3k] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-height: 86px;
    padding-left: 22px !important;
}

.outgoing-page[b-nglh1lvf3k]  .switch-column .mud-typography {
    font-size: 1.04rem;
    font-weight: 550;
}

.file-card[b-nglh1lvf3k] {
    height: 100%;
    padding: 20px;
    border: 1px dashed #b6c9c1;
    border-radius: 18px;
    background: var(--green-50);
}

.file-card-heading[b-nglh1lvf3k] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    color: var(--green-900);
}

.file-card-heading > .mud-icon-root[b-nglh1lvf3k] {
    font-size: 2rem;
}

.file-card-heading strong[b-nglh1lvf3k],
.file-card-heading span[b-nglh1lvf3k] {
    display: block;
}

.file-card-heading strong[b-nglh1lvf3k] {
    font-size: 1.13rem;
    font-weight: 750;
}

.file-card-heading span[b-nglh1lvf3k] {
    margin-top: 2px;
    color: var(--gray-700);
    font-size: 0.96rem;
}

.native-file-input[b-nglh1lvf3k] {
    width: 100%;
    margin-bottom: 14px;
    padding: 11px;
    border: 1px solid #cbd9d3;
    border-radius: 11px;
    background: #fff;
    color: var(--gray-700);
    font-family: inherit;
    font-size: 1rem;
}

.outgoing-page[b-nglh1lvf3k]  .compact-field {
    margin-top: 10px;
}

.image-preview[b-nglh1lvf3k] {
    overflow: hidden;
    width: 100%;
    height: 190px;
    margin-top: 14px;
    border-radius: 14px;
    background: #eaf1ee;
}

.image-preview img[b-nglh1lvf3k] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.file-note[b-nglh1lvf3k] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    margin-top: 14px;
    padding: 10px 12px;
    border-radius: 11px;
    background: #fff;
    color: var(--gray-700);
    font-size: 0.98rem;
    word-break: break-all;
}

.form-actions[b-nglh1lvf3k],
.detail-actions[b-nglh1lvf3k] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
}

.outgoing-page[b-nglh1lvf3k]  .cancel-button,
.outgoing-page[b-nglh1lvf3k]  .secondary-action,
.outgoing-page[b-nglh1lvf3k]  .save-button,
.outgoing-page[b-nglh1lvf3k]  .primary-action {
    min-height: 48px;
    padding-inline: 22px;
    border-radius: 12px;
    font-family: inherit;
    font-size: 1.06rem;
    font-weight: 700;
    text-transform: none;
}

.outgoing-page[b-nglh1lvf3k]  .cancel-button,
.outgoing-page[b-nglh1lvf3k]  .secondary-action {
    border-color: #bac9c3;
    color: var(--gray-700);
}

.outgoing-page[b-nglh1lvf3k]  .save-button,
.outgoing-page[b-nglh1lvf3k]  .primary-action {
    background: var(--green-900);
    color: #fff;
}

.detail-status-row[b-nglh1lvf3k] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 20px 0;
}

.status-badge[b-nglh1lvf3k],
.priority-badge[b-nglh1lvf3k],
.overdue-badge[b-nglh1lvf3k],
.document-type[b-nglh1lvf3k],
.result-count[b-nglh1lvf3k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 30px;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.2;
}

.status-draft[b-nglh1lvf3k] { background: #eef1f0; color: #53615c; }
.status-review[b-nglh1lvf3k] { background: #e9eefb; color: #465f9d; }
.status-pending[b-nglh1lvf3k] { background: #fff0cd; color: #9a6807; }
.status-approved[b-nglh1lvf3k] { background: #e2f5ed; color: #08705a; }
.status-signed[b-nglh1lvf3k] { background: #e2efff; color: #1d5f9b; }
.status-numbered[b-nglh1lvf3k] { background: #eee7ff; color: #6542a4; }
.status-sent[b-nglh1lvf3k] { background: #dff6ee; color: #075f4c; }
.status-delivered[b-nglh1lvf3k] { background: #dff4e5; color: #2f7444; }
.status-archived[b-nglh1lvf3k] { background: #e7ecea; color: #4d5c57; }

.priority-normal[b-nglh1lvf3k] { background: #eef2f0; color: #596761; }
.priority-urgent[b-nglh1lvf3k] { background: #fff0cd; color: #9b6805; }
.priority-very-urgent[b-nglh1lvf3k] { background: #ffe7d6; color: #b65218; }
.priority-immediate[b-nglh1lvf3k] { background: #ffe2e5; color: #b42435; }
.overdue-badge[b-nglh1lvf3k] { background: #ffdde1; color: #b12334; }

.detail-image-card[b-nglh1lvf3k] {
    position: relative;
    overflow: hidden;
    height: 260px;
    border-radius: 20px;
    background: linear-gradient(145deg, #e6f3ee, color-mix(in srgb, var(--theme-bg) 58%, white));
}

.detail-image-card img[b-nglh1lvf3k] {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cover-fallback[b-nglh1lvf3k] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: grid;
    place-items: center;
    color: rgba(7, 85, 65, 0.45);
}

.cover-fallback .mud-icon-root[b-nglh1lvf3k] {
    font-size: 4.5rem;
}

.detail-information-grid[b-nglh1lvf3k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.detail-info[b-nglh1lvf3k] {
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--gray-200);
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.detail-info span[b-nglh1lvf3k],
.detail-info strong[b-nglh1lvf3k] {
    display: block;
}

.detail-info span[b-nglh1lvf3k] {
    color: var(--gray-500);
    font-size: 0.94rem;
}

.detail-info strong[b-nglh1lvf3k] {
    margin-top: 3px;
    color: var(--gray-900);
    font-size: 1.04rem;
    font-weight: 650;
    overflow-wrap: anywhere;
}

.detail-summary[b-nglh1lvf3k] {
    margin-top: 18px;
    padding: 18px;
    border-radius: 16px;
    background: var(--gray-100);
}

.detail-summary span[b-nglh1lvf3k] {
    color: var(--green-900);
    font-size: 1rem;
    font-weight: 700;
}

.detail-summary p[b-nglh1lvf3k] {
    margin: 6px 0 0;
    color: var(--gray-700);
    font-size: 1.05rem;
    line-height: 1.7;
}

.workflow-row[b-nglh1lvf3k] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 20px;
}

.workflow-step[b-nglh1lvf3k] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 13px;
    border: 1px solid var(--gray-200);
    border-radius: 14px;
    background: #fafcfb;
    opacity: 0.62;
}

.workflow-step.completed[b-nglh1lvf3k] {
    border-color: #b9dfd1;
    background: var(--green-50);
    opacity: 1;
}

.workflow-dot[b-nglh1lvf3k] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: #e8eeeb;
    color: var(--gray-500);
}

.workflow-step.completed .workflow-dot[b-nglh1lvf3k] {
    background: var(--green-100);
    color: var(--green-800);
}

.workflow-step strong[b-nglh1lvf3k],
.workflow-step span[b-nglh1lvf3k] {
    display: block;
}

.workflow-step strong[b-nglh1lvf3k] {
    color: var(--gray-900);
    font-size: 0.97rem;
    font-weight: 700;
}

.workflow-step span[b-nglh1lvf3k] {
    margin-top: 2px;
    color: var(--gray-500);
    font-size: 0.83rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filter-heading[b-nglh1lvf3k] {
    justify-content: space-between;
    margin-bottom: 20px;
}

.result-count[b-nglh1lvf3k] {
    flex: 0 0 auto;
    padding: 8px 15px;
    background: var(--green-100);
    color: var(--green-900);
    font-size: 1rem;
}

.quick-filters[b-nglh1lvf3k] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 16px;
}

.quick-filter[b-nglh1lvf3k] {
    min-height: 39px;
    padding: 7px 14px;
    border: 1px solid #cfdbd6;
    border-radius: 999px;
    background: #fff;
    color: var(--gray-700);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.98rem;
    font-weight: 600;
    transition: all 0.18s ease;
}

.quick-filter:hover[b-nglh1lvf3k],
.quick-filter.active[b-nglh1lvf3k] {
    border-color: var(--green-800);
    background: var(--green-800);
    color: #fff;
}

.document-list[b-nglh1lvf3k] {
    display: grid;
    gap: 17px;
    margin-top: 20px;
}

.outgoing-page[b-nglh1lvf3k]  .document-card {
    display: grid;
    grid-template-columns: 215px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--gray-200);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 10px 26px rgba(26, 66, 53, 0.07);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.outgoing-page[b-nglh1lvf3k]  .document-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 17px 36px rgba(26, 66, 53, 0.12);
}

.document-cover[b-nglh1lvf3k] {
    position: relative;
    min-height: 265px;
    overflow: hidden;
    background: linear-gradient(145deg, #dfeee8, #f5faf8);
}

.document-cover img[b-nglh1lvf3k] {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.document-type[b-nglh1lvf3k] {
    position: absolute;
    z-index: 3;
    left: 14px;
    bottom: 14px;
    max-width: calc(100% - 28px);
    background: rgba(5, 59, 46, 0.90);
    color: #fff;
}

.document-content[b-nglh1lvf3k] {
    min-width: 0;
    padding: 21px 23px;
}

.document-topline[b-nglh1lvf3k],
.document-footer[b-nglh1lvf3k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.badge-group[b-nglh1lvf3k],
.attachment-info[b-nglh1lvf3k],
.card-actions[b-nglh1lvf3k] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.updated-text[b-nglh1lvf3k] {
    flex: 0 0 auto;
    color: var(--gray-500);
    font-size: 0.91rem;
}

.outgoing-page[b-nglh1lvf3k]  .document-subject {
    margin-top: 13px;
    color: var(--green-950);
    font-size: 1.34rem;
    font-weight: 800;
    line-height: 1.42;
}

.outgoing-page[b-nglh1lvf3k]  .document-summary {
    display: -webkit-box;
    margin-top: 7px;
    overflow: hidden;
    color: var(--gray-700);
    font-size: 1.02rem;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.document-meta-grid[b-nglh1lvf3k] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 17px;
}

.document-meta-grid > div[b-nglh1lvf3k] {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 0 8px;
    min-width: 0;
    padding: 10px 11px;
    border-radius: 12px;
    background: var(--gray-100);
}

.document-meta-grid .mud-icon-root[b-nglh1lvf3k] {
    grid-row: 1 / 3;
    align-self: center;
    color: var(--green-700);
    font-size: 1.25rem;
}

.document-meta-grid span[b-nglh1lvf3k],
.document-meta-grid strong[b-nglh1lvf3k] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-meta-grid span[b-nglh1lvf3k] {
    color: var(--gray-500);
    font-size: 0.83rem;
}

.document-meta-grid strong[b-nglh1lvf3k] {
    color: var(--gray-900);
    font-size: 0.94rem;
    font-weight: 650;
}

.document-footer[b-nglh1lvf3k] {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid var(--gray-200);
}

.attachment-info[b-nglh1lvf3k] {
    color: var(--gray-700);
    font-size: 0.93rem;
}

.attachment-info span[b-nglh1lvf3k] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.outgoing-page[b-nglh1lvf3k]  .action-view,
.outgoing-page[b-nglh1lvf3k]  .action-edit,
.outgoing-page[b-nglh1lvf3k]  .action-delete {
    width: 42px;
    height: 42px;
    border-radius: 11px;
}

.outgoing-page[b-nglh1lvf3k]  .action-view { background: var(--blue-100); color: var(--blue-700); }
.outgoing-page[b-nglh1lvf3k]  .action-edit { background: var(--gold-100); color: #956608; }
.outgoing-page[b-nglh1lvf3k]  .action-delete { background: var(--red-100); color: var(--red-700); }

.outgoing-page[b-nglh1lvf3k]  .advance-button {
    min-height: 42px;
    padding-inline: 15px;
    border-radius: 11px;
    background: var(--green-900);
    color: #fff;
    font-family: inherit;
    font-size: 0.96rem;
    font-weight: 700;
    text-transform: none;
}

.loading-state[b-nglh1lvf3k],
.outgoing-page[b-nglh1lvf3k]  .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 330px;
    margin-top: 20px;
    padding: 34px;
    border: 1px solid var(--gray-200);
    border-radius: 22px;
    background: #fff;
    color: var(--gray-700);
    text-align: center;
}

.loading-state[b-nglh1lvf3k] {
    gap: 15px;
    font-size: 1.08rem;
}

.outgoing-page[b-nglh1lvf3k]  .empty-state .mud-typography {
    margin-top: 7px;
}

.outgoing-page[b-nglh1lvf3k]  .empty-icon {
    color: #8e9d97;
    font-size: 4rem;
}

.outgoing-page[b-nglh1lvf3k]  .empty-state .primary-action {
    margin-top: 18px;
}

@media (max-width: 1199.98px) {
    .workflow-row[b-nglh1lvf3k] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .document-meta-grid[b-nglh1lvf3k] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 959.98px) {
    .outgoing-page[b-nglh1lvf3k] {
        padding: 17px;
    }

    .outgoing-page[b-nglh1lvf3k]  .outgoing-hero {
        padding: 30px 25px;
        border-radius: 23px;
    }

    .outgoing-page[b-nglh1lvf3k]  .editor-panel,
    .outgoing-page[b-nglh1lvf3k]  .detail-panel,
    .outgoing-page[b-nglh1lvf3k]  .filter-panel {
        padding: 22px;
        border-radius: 20px;
    }

    .outgoing-page[b-nglh1lvf3k]  .document-card {
        grid-template-columns: 170px minmax(0, 1fr);
    }

    .document-cover[b-nglh1lvf3k] {
        min-height: 300px;
    }

    .document-meta-grid[b-nglh1lvf3k] {
        grid-template-columns: 1fr;
    }

    .detail-information-grid[b-nglh1lvf3k] {
        grid-template-columns: 1fr;
    }

    .workflow-row[b-nglh1lvf3k] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 699.98px) {
    .outgoing-page[b-nglh1lvf3k] {
        padding: 10px;
    }

    .outgoing-page[b-nglh1lvf3k]  .outgoing-hero {
        padding: 24px 18px;
        border-radius: 19px;
    }

    .hero-benefits[b-nglh1lvf3k] {
        flex-direction: column;
    }

    .hero-benefits span[b-nglh1lvf3k] {
        width: 100%;
    }

    .outgoing-page[b-nglh1lvf3k]  .hero-title {
        font-size: 2.15rem;
    }

    .outgoing-page[b-nglh1lvf3k]  .hero-description {
        font-size: 1.06rem;
    }

    .outgoing-page[b-nglh1lvf3k]  .summary-card {
        min-height: 105px;
        padding: 15px;
        gap: 11px;
    }

    .summary-icon[b-nglh1lvf3k] {
        width: 49px;
        height: 49px;
        border-radius: 14px;
    }

    .outgoing-page[b-nglh1lvf3k]  .summary-value {
        font-size: 1.5rem;
    }

    .outgoing-page[b-nglh1lvf3k]  .summary-label {
        font-size: 0.9rem;
    }

    .section-heading[b-nglh1lvf3k],
    .filter-heading[b-nglh1lvf3k] {
        align-items: flex-start;
    }

    .section-icon[b-nglh1lvf3k] {
        width: 49px;
        height: 49px;
        border-radius: 14px;
    }

    .outgoing-page[b-nglh1lvf3k]  .editor-panel,
    .outgoing-page[b-nglh1lvf3k]  .detail-panel,
    .outgoing-page[b-nglh1lvf3k]  .filter-panel {
        padding: 18px 15px;
    }

    .filter-heading[b-nglh1lvf3k] {
        flex-direction: column;
    }

    .form-actions[b-nglh1lvf3k],
    .detail-actions[b-nglh1lvf3k] {
        flex-direction: column-reverse;
    }

    .outgoing-page[b-nglh1lvf3k]  .cancel-button,
    .outgoing-page[b-nglh1lvf3k]  .secondary-action,
    .outgoing-page[b-nglh1lvf3k]  .save-button,
    .outgoing-page[b-nglh1lvf3k]  .primary-action {
        width: 100%;
    }

    .outgoing-page[b-nglh1lvf3k]  .document-card {
        display: block;
    }

    .document-cover[b-nglh1lvf3k] {
        min-height: 210px;
    }

    .document-content[b-nglh1lvf3k] {
        padding: 18px 15px;
    }

    .document-topline[b-nglh1lvf3k],
    .document-footer[b-nglh1lvf3k] {
        align-items: flex-start;
        flex-direction: column;
    }

    .updated-text[b-nglh1lvf3k] {
        width: 100%;
    }

    .card-actions[b-nglh1lvf3k] {
        width: 100%;
    }

    .outgoing-page[b-nglh1lvf3k]  .advance-button {
        flex: 1;
    }

    .workflow-row[b-nglh1lvf3k] {
        grid-template-columns: 1fr;
    }

    .detail-image-card[b-nglh1lvf3k] {
        height: 210px;
    }
}

@media (min-width: 1800px) {
    .outgoing-page[b-nglh1lvf3k] {
        padding: 30px 42px;
    }

    .outgoing-page[b-nglh1lvf3k]  .hero-description {
        font-size: 1.28rem;
    }

    .outgoing-page[b-nglh1lvf3k]  .large-input input,
    .outgoing-page[b-nglh1lvf3k]  .large-input textarea,
    .outgoing-page[b-nglh1lvf3k]  .large-input .mud-select-input {
        font-size: 1.14rem;
    }
}
/* /Components/Pages/05Correspondence/02Staff/Departments.razor.rz.scp.css */
.departments-page[b-pmvff77orz] {
    --dept-green-950: #052f27;
    --dept-green-900: #06483a;
    --dept-green-800: #08634d;
    --dept-green-700: #0c7a5d;
    --dept-green-100: #dcf5eb;
    --dept-gold: #f3bd57;
    --dept-ink: #18352d;
    --dept-muted: #657770;
    --dept-border: #d9e7e2;
    min-height: 100%;
    padding: 22px;
    background:
        radial-gradient(circle at 8% 0%, rgba(17, 135, 101, .10), transparent 28%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #f1f7f5 100%);
    font-family: "Kanit", sans-serif;
}

.departments-page[b-pmvff77orz]  .departments-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: white;
    background:
        linear-gradient(125deg, rgba(4, 44, 36, .98), rgba(8, 103, 76, .95)),
        url('/images/news/news-community-meeting.jpg') center/cover;
    box-shadow: 0 24px 56px rgba(5, 62, 47, .25);
}

.hero-content[b-pmvff77orz] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 370px;
    gap: 34px;
    align-items: center;
}

.hero-orb[b-pmvff77orz] {
    position: absolute;
    border-radius: 999px;
    opacity: .55;
}

.hero-orb-one[b-pmvff77orz] {
    width: 330px;
    height: 330px;
    top: -200px;
    right: 16%;
    background: rgba(255, 215, 129, .20);
}

.hero-orb-two[b-pmvff77orz] {
    width: 260px;
    height: 260px;
    left: -105px;
    bottom: -170px;
    background: rgba(45, 217, 163, .22);
}

.hero-kicker[b-pmvff77orz],
.hero-points[b-pmvff77orz],
.panel-heading[b-pmvff77orz],
.content-toolbar[b-pmvff77orz],
.department-card-top[b-pmvff77orz],
.department-type-row[b-pmvff77orz],
.department-card-actions[b-pmvff77orz],
.hierarchy-title-row[b-pmvff77orz],
.hierarchy-root-header[b-pmvff77orz],
.modal-header[b-pmvff77orz],
.modal-actions[b-pmvff77orz],
.form-section-heading[b-pmvff77orz],
.detail-status-row[b-pmvff77orz] {
    display: flex;
    align-items: center;
}

.hero-kicker[b-pmvff77orz] {
    width: fit-content;
    gap: 9px;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .10);
    font-size: 1.05rem;
    font-weight: 500;
}

.departments-page[b-pmvff77orz]  .hero-title {
    margin-top: 18px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.45rem, 4.5vw, 4.45rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.035em;
}

.departments-page[b-pmvff77orz]  .hero-subtitle {
    max-width: 790px;
    margin-top: 13px;
    color: rgba(255, 255, 255, .86);
    font-size: 1.22rem;
    line-height: 1.75;
}

.hero-points[b-pmvff77orz] {
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 24px;
}

.hero-points span[b-pmvff77orz] {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    color: rgba(255, 255, 255, .92);
    font-size: 1.02rem;
}

.departments-page[b-pmvff77orz]  .hero-action-card {
    display: grid;
    gap: 14px;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 24px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(16px);
}

.hero-action-icon[b-pmvff77orz] {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    color: #604000;
    background: linear-gradient(135deg, #ffdc8d, #efb548);
    box-shadow: 0 12px 28px rgba(243, 187, 75, .25);
}

.hero-action-icon[b-pmvff77orz]  .mud-icon-root {
    font-size: 2rem;
}

.departments-page[b-pmvff77orz]  .hero-action-title {
    color: #fff;
    font-weight: 700;
}

.departments-page[b-pmvff77orz]  .hero-action-text {
    color: rgba(255, 255, 255, .78);
    font-size: 1.02rem;
    line-height: 1.58;
}

.departments-page[b-pmvff77orz]  .hero-action-button {
    min-height: 50px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.06rem;
    font-weight: 700;
}

.departments-page[b-pmvff77orz]  .summary-grid {
    margin-top: 10px;
}

.departments-page[b-pmvff77orz]  .summary-card {
    display: flex;
    gap: 18px;
    align-items: center;
    min-height: 140px;
    padding: 23px;
    border: 1px solid rgba(17, 102, 77, .10);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(30, 77, 63, .08);
}

.summary-icon[b-pmvff77orz] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 59px;
    height: 59px;
    border-radius: 18px;
}

.summary-icon[b-pmvff77orz]  .mud-icon-root { font-size: 1.95rem; }
.summary-card-green .summary-icon[b-pmvff77orz] { color: #0b7657; background: #daf4e8; }
.summary-card-blue .summary-icon[b-pmvff77orz] { color: #246bb0; background: #e0efff; }
.summary-card-amber .summary-icon[b-pmvff77orz] { color: #b46e00; background: #fff0d0; }
.summary-card-purple .summary-icon[b-pmvff77orz] { color: #7552bc; background: #eee7ff; }

.departments-page[b-pmvff77orz]  .summary-label {
    color: #61726c;
    font-size: 1.04rem;
    font-weight: 500;
}

.departments-page[b-pmvff77orz]  .summary-value {
    margin: 2px 0;
    color: var(--dept-ink);
    font-family: "Kanit", sans-serif;
    font-size: 2.45rem;
    font-weight: 800;
    line-height: 1.05;
}

.departments-page[b-pmvff77orz]  .summary-note {
    color: #84928d;
    font-size: .96rem;
}

.departments-page[b-pmvff77orz]  .filter-panel,
.departments-page[b-pmvff77orz]  .hierarchy-panel,
.departments-page[b-pmvff77orz]  .department-table-wrap {
    margin-top: 20px;
    padding: 25px;
    border: 1px solid var(--dept-border);
    border-radius: 24px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 13px 32px rgba(27, 73, 60, .07);
}

.panel-heading[b-pmvff77orz],
.content-toolbar[b-pmvff77orz],
.hierarchy-title-row[b-pmvff77orz],
.modal-header[b-pmvff77orz],
.modal-actions[b-pmvff77orz] {
    justify-content: space-between;
    gap: 16px;
}

.panel-heading[b-pmvff77orz] {
    margin-bottom: 18px;
}

.departments-page[b-pmvff77orz]  .panel-title,
.departments-page[b-pmvff77orz]  .content-title {
    color: var(--dept-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 750;
}

.departments-page[b-pmvff77orz]  .panel-subtitle,
.departments-page[b-pmvff77orz]  .content-subtitle {
    color: var(--dept-muted);
    font-size: 1rem;
}

.departments-page[b-pmvff77orz]  .large-input .mud-input-label {
    color: #425a52;
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 500;
}

.departments-page[b-pmvff77orz]  .large-input .mud-input-slot,
.departments-page[b-pmvff77orz]  .large-input input,
.departments-page[b-pmvff77orz]  .large-input textarea,
.departments-page[b-pmvff77orz]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.08rem;
}

.departments-page[b-pmvff77orz]  .large-input .mud-input-outlined-border {
    border-color: #cfded8;
    border-radius: 13px;
}

.departments-page[b-pmvff77orz]  .large-input .mud-input-control-input-container {
    min-height: 54px;
}

.content-toolbar[b-pmvff77orz] {
    margin: 27px 0 4px;
}

.departments-page[b-pmvff77orz]  .department-grid {
    margin-top: 2px;
}

.departments-page[b-pmvff77orz]  .department-card {
    height: 100%;
    padding: 22px;
    overflow: hidden;
    border: 1px solid var(--dept-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(27, 75, 60, .08);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.departments-page[b-pmvff77orz]  .department-card:hover {
    transform: translateY(-4px);
    border-color: rgba(19, 128, 95, .32);
    box-shadow: 0 22px 46px rgba(21, 82, 63, .14);
}

.department-card-top[b-pmvff77orz] {
    align-items: flex-start;
    gap: 15px;
}

.department-avatar-wrap[b-pmvff77orz] {
    position: relative;
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
}

.department-avatar-fallback[b-pmvff77orz],
.department-avatar-image[b-pmvff77orz] {
    position: absolute;
    inset: 0;
    width: 72px;
    height: 72px;
    border-radius: 20px;
}

.department-avatar-fallback[b-pmvff77orz] {
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(145deg, #0a765a, #07503f);
    font-size: 1.35rem;
    font-weight: 800;
}

.department-avatar-image[b-pmvff77orz] {
    z-index: 1;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 9px 22px rgba(18, 87, 66, .18);
}

.status-dot[b-pmvff77orz] {
    position: absolute;
    z-index: 3;
    right: -3px;
    bottom: -3px;
    width: 19px;
    height: 19px;
    border: 3px solid #fff;
    border-radius: 50%;
}

.dot-active[b-pmvff77orz] { background: #23a36d; }
.dot-warning[b-pmvff77orz] { background: #eaa42c; }
.dot-info[b-pmvff77orz] { background: #378fd3; }
.dot-closed[b-pmvff77orz] { background: #d85252; }

.department-heading[b-pmvff77orz] {
    min-width: 0;
    flex: 1;
}

.department-type-row[b-pmvff77orz] {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 5px;
}

.department-code[b-pmvff77orz] {
    color: #687a73;
    font-size: .96rem;
    font-weight: 600;
}

.departments-page[b-pmvff77orz]  .department-name {
    color: var(--dept-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 750;
    line-height: 1.32;
}

.departments-page[b-pmvff77orz]  .department-type {
    color: var(--dept-green-700);
    font-size: 1.02rem;
    font-weight: 600;
}

.parent-department-box[b-pmvff77orz],
.leader-row[b-pmvff77orz],
.mission-box[b-pmvff77orz] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.parent-department-box[b-pmvff77orz] {
    margin-top: 18px;
    padding: 13px 15px;
    border-radius: 15px;
    color: #32564a;
    background: #f0f8f5;
}

.parent-department-box > div[b-pmvff77orz],
.leader-row > div:last-child[b-pmvff77orz] {
    display: grid;
    min-width: 0;
}

.parent-department-box span[b-pmvff77orz],
.leader-row span[b-pmvff77orz] {
    color: var(--theme-muted);
    font-size: .91rem;
}

.parent-department-box strong[b-pmvff77orz],
.leader-row strong[b-pmvff77orz] {
    color: #23463a;
    font-size: 1.02rem;
    font-weight: 650;
}

.leader-row[b-pmvff77orz] {
    margin-top: 15px;
    align-items: center;
}

.leader-icon[b-pmvff77orz] {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border-radius: 13px;
    color: #7f5711;
    background: #fff2d7;
}

.department-metrics[b-pmvff77orz] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 17px;
}

.department-metrics > div[b-pmvff77orz] {
    display: grid;
    justify-items: center;
    padding: 12px 8px;
    border: 1px solid #e2ece8;
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.department-metrics span[b-pmvff77orz] {
    color: #778982;
    font-size: .88rem;
}

.department-metrics strong[b-pmvff77orz] {
    color: var(--dept-ink);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.15;
}

.department-metrics small[b-pmvff77orz] {
    color: var(--theme-muted);
    font-size: .82rem;
}

.mission-box[b-pmvff77orz] {
    margin-top: 16px;
    padding: 14px;
    border-radius: 15px;
    color: #48635a;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.mission-box p[b-pmvff77orz] {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    font-size: .98rem;
    line-height: 1.58;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.contact-grid[b-pmvff77orz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 16px;
}

.contact-grid > div[b-pmvff77orz] {
    display: flex;
    min-width: 0;
    gap: 8px;
    align-items: center;
    color: #64776f;
    font-size: .94rem;
}

.contact-grid span[b-pmvff77orz] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contact-span[b-pmvff77orz] { grid-column: 1 / -1; }

.department-card-actions[b-pmvff77orz] {
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 17px;
    border-top: 1px solid #e7efec;
}

.departments-page[b-pmvff77orz]  .department-card-actions .mud-button-root {
    min-height: 43px;
    border-radius: 12px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 600;
}

.hierarchy-title-row[b-pmvff77orz] {
    margin-bottom: 22px;
}

.hierarchy-root-grid[b-pmvff77orz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.hierarchy-root-card[b-pmvff77orz] {
    overflow: hidden;
    border: 1px solid var(--theme-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.hierarchy-root-header[b-pmvff77orz] {
    gap: 14px;
    padding: 18px;
    color: #fff;
    background: linear-gradient(125deg, #07503f, #0a765a);
}

.hierarchy-root-header > div:nth-child(2)[b-pmvff77orz] {
    display: grid;
    min-width: 0;
    flex: 1;
}

.hierarchy-root-header span[b-pmvff77orz] {
    color: rgba(255, 255, 255, .72);
    font-size: .9rem;
}

.hierarchy-root-header strong[b-pmvff77orz] {
    font-size: 1.2rem;
    line-height: 1.35;
}

.hierarchy-root-header small[b-pmvff77orz] {
    color: rgba(255, 255, 255, .85);
    font-size: .93rem;
}

.hierarchy-icon[b-pmvff77orz] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 50px;
    height: 50px;
    border-radius: 15px;
    background: rgba(255, 255, 255, .14);
}

.hierarchy-children[b-pmvff77orz] {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.hierarchy-child-card[b-pmvff77orz] {
    display: flex;
    width: 100%;
    gap: 12px;
    align-items: center;
    padding: 13px;
    border: 1px solid #e1ebe7;
    border-radius: 14px;
    color: inherit;
    text-align: left;
    background: #fff;
    cursor: pointer;
    transition: border-color .18s ease, transform .18s ease;
}

.hierarchy-child-card:hover[b-pmvff77orz] {
    transform: translateX(3px);
    border-color: rgba(15, 122, 93, .40);
}

.child-icon[b-pmvff77orz] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #0b7358;
    background: #e1f4ed;
}

.child-copy[b-pmvff77orz] {
    display: grid;
    min-width: 0;
    flex: 1;
}

.child-copy small[b-pmvff77orz] { color: #72847d; }
.child-copy strong[b-pmvff77orz] { color: #23463a; font-size: 1.02rem; }
.child-copy em[b-pmvff77orz] { color: #8b9994; font-size: .88rem; font-style: normal; }

.hierarchy-empty[b-pmvff77orz] {
    padding: 18px;
    border: 1px dashed #ccdcd6;
    border-radius: 13px;
    color: #80908a;
    text-align: center;
}

.orphan-section[b-pmvff77orz] {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #e3ece8;
}

.orphan-list[b-pmvff77orz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.orphan-list button[b-pmvff77orz] {
    padding: 9px 13px;
    border: 1px solid #d8e6e1;
    border-radius: 999px;
    color: #375b4f;
    background: #fff;
    cursor: pointer;
}

.departments-page[b-pmvff77orz]  .department-table-wrap {
    overflow-x: auto;
}

.departments-page[b-pmvff77orz]  .department-table .mud-table-head .mud-table-cell {
    color: #3f5b52;
    background: #f2f8f6;
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 700;
}

.departments-page[b-pmvff77orz]  .department-table .mud-table-cell {
    padding-top: 16px;
    padding-bottom: 16px;
    color: #334e45;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.table-department[b-pmvff77orz] {
    display: flex;
    min-width: 250px;
    gap: 11px;
    align-items: center;
}

.table-department-icon[b-pmvff77orz] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #0b7358;
    background: #e0f4ec;
}

.table-department > div[b-pmvff77orz] {
    display: grid;
}

.table-department strong[b-pmvff77orz] {
    color: var(--dept-ink);
    font-size: 1.04rem;
}

.table-department span[b-pmvff77orz],
.table-secondary[b-pmvff77orz] {
    display: block;
    color: #798a83;
    font-size: .91rem;
}

.departments-page[b-pmvff77orz]  .state-panel {
    display: grid;
    justify-items: center;
    gap: 13px;
    margin-top: 20px;
    padding: 55px 24px;
    border: 1px dashed #c8dbd4;
    border-radius: 24px;
    color: #567068;
    background: rgba(255, 255, 255, .80);
}

.state-icon[b-pmvff77orz] {
    font-size: 4rem;
    color: #7fa99b;
}

.modal-backdrop[b-pmvff77orz] {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(4, 28, 22, .62);
    backdrop-filter: blur(6px);
}

.departments-page[b-pmvff77orz]  .modal-card {
    width: min(1080px, 100%);
    max-height: calc(100vh - 44px);
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.departments-page[b-pmvff77orz]  .form-modal { width: min(1180px, 100%); }
.departments-page[b-pmvff77orz]  .detail-modal { width: min(980px, 100%); }
.departments-page[b-pmvff77orz]  .delete-modal { width: min(520px, 100%); padding: 30px; text-align: center; }

.modal-header[b-pmvff77orz] {
    position: sticky;
    z-index: 4;
    top: 0;
    padding: 22px 26px;
    border-bottom: 1px solid #e3ece8;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(12px);
}

.departments-page[b-pmvff77orz]  .modal-title {
    color: var(--dept-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 750;
}

.departments-page[b-pmvff77orz]  .modal-subtitle {
    color: var(--dept-muted);
    font-size: 1rem;
}

.modal-body[b-pmvff77orz] {
    padding: 25px 26px;
}

.form-section[b-pmvff77orz] {
    padding: 21px;
    border: 1px solid var(--theme-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.form-section + .form-section[b-pmvff77orz] {
    margin-top: 18px;
}

.form-section-heading[b-pmvff77orz] {
    gap: 12px;
    margin-bottom: 18px;
}

.form-section-heading > span[b-pmvff77orz] {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 14px;
    color: #0b7358;
    background: #def3eb;
}

.form-section-heading > div[b-pmvff77orz] {
    display: grid;
}

.form-section-heading strong[b-pmvff77orz] {
    color: #24483c;
    font-size: 1.18rem;
}

.form-section-heading small[b-pmvff77orz] {
    color: var(--theme-muted);
    font-size: .94rem;
}

.image-upload-layout[b-pmvff77orz] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 22px;
}

.image-preview-box[b-pmvff77orz] {
    display: grid;
    place-items: center;
    min-height: 205px;
    overflow: hidden;
    border: 1px dashed #bfd4cc;
    border-radius: 19px;
    background: #f3f8f6;
}

.image-preview-box img[b-pmvff77orz] {
    width: 100%;
    height: 100%;
    min-height: 205px;
    object-fit: cover;
}

.image-preview-fallback[b-pmvff77orz] {
    display: grid;
    justify-items: center;
    gap: 8px;
    color: #779188;
}

.image-preview-fallback[b-pmvff77orz]  .mud-icon-root { font-size: 3.5rem; }

.image-upload-fields[b-pmvff77orz] {
    display: grid;
    gap: 13px;
}

.image-upload-fields p[b-pmvff77orz] {
    margin: 0;
    color: var(--theme-muted);
    font-size: .94rem;
}

.file-picker[b-pmvff77orz] {
    display: inline-flex;
    width: fit-content;
    gap: 9px;
    align-items: center;
    padding: 11px 17px;
    border-radius: 13px;
    color: #fff;
    background: #0c7358;
    font-size: 1rem;
    font-weight: 650;
    cursor: pointer;
}

.file-picker input[b-pmvff77orz] {
    display: none;
}

.modal-actions[b-pmvff77orz] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    padding: 17px 26px;
    border-top: 1px solid #e3ece8;
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(12px);
}

.departments-page[b-pmvff77orz]  .modal-actions .mud-button-root {
    min-height: 46px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.detail-banner[b-pmvff77orz] {
    position: relative;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 28px;
    color: #fff;
    background: linear-gradient(125deg, #06483a, #0b7a5c);
}

.detail-image-wrap[b-pmvff77orz] {
    position: relative;
    width: 116px;
    height: 116px;
}

.detail-image-fallback[b-pmvff77orz],
.detail-image-wrap img[b-pmvff77orz] {
    position: absolute;
    inset: 0;
    width: 116px;
    height: 116px;
    border-radius: 26px;
}

.detail-image-fallback[b-pmvff77orz] {
    display: grid;
    place-items: center;
    color: #174d3c;
    background: #daf4e8;
    font-size: 2rem;
    font-weight: 800;
}

.detail-image-wrap img[b-pmvff77orz] {
    object-fit: cover;
    border: 4px solid rgba(255, 255, 255, .85);
}

.detail-title-copy span[b-pmvff77orz],
.detail-title-copy p[b-pmvff77orz] {
    color: rgba(255, 255, 255, .76);
}

.detail-title-copy p[b-pmvff77orz] { margin: 4px 0 0; font-size: 1.03rem; }
.detail-title-copy[b-pmvff77orz]  .mud-typography { color: #fff; font-family: "Kanit", sans-serif; font-weight: 750; }
.detail-close[b-pmvff77orz] { align-self: start; }
.detail-status-row[b-pmvff77orz] { flex-wrap: wrap; gap: 9px; }

.detail-metric-grid[b-pmvff77orz] { margin-top: 14px; }

.detail-metric[b-pmvff77orz] {
    display: grid;
    justify-items: center;
    padding: 15px 10px;
    border: 1px solid var(--theme-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-metric span[b-pmvff77orz] { color: #72847d; font-size: .91rem; }
.detail-metric strong[b-pmvff77orz] { color: #24483c; font-size: 1.18rem; }

.detail-section[b-pmvff77orz] {
    margin-top: 20px;
    padding: 19px;
    border: 1px solid #dfeae6;
    border-radius: 18px;
}

.detail-section h3[b-pmvff77orz] {
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 0 0 14px;
    color: #23463a;
    font-size: 1.18rem;
}

.detail-info-grid[b-pmvff77orz],
.detail-contact-grid[b-pmvff77orz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.detail-info-grid > div[b-pmvff77orz] {
    display: grid;
    padding: 12px;
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-info-grid span[b-pmvff77orz],
.detail-text-block span[b-pmvff77orz],
.detail-contact-grid small[b-pmvff77orz] {
    color: var(--theme-muted);
    font-size: .9rem;
}

.detail-info-grid strong[b-pmvff77orz] { color: var(--theme-ink); font-size: 1rem; }

.detail-text-block + .detail-text-block[b-pmvff77orz] { margin-top: 13px; }
.detail-text-block p[b-pmvff77orz] { margin: 3px 0 0; color: #405d53; font-size: 1rem; line-height: 1.7; }

.detail-contact-grid > div[b-pmvff77orz] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 13px;
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-contact-grid span[b-pmvff77orz] {
    display: grid;
    color: #37564c;
}

.delete-icon[b-pmvff77orz] {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto 16px;
    border-radius: 22px;
    color: #c23f3f;
    background: #fee7e7;
}

.delete-icon[b-pmvff77orz]  .mud-icon-root { font-size: 2.4rem; }

.departments-page[b-pmvff77orz]  .delete-title {
    color: #3c2d2d;
    font-family: "Kanit", sans-serif;
    font-weight: 750;
}

.departments-page[b-pmvff77orz]  .delete-copy {
    margin: 11px 0 18px;
    color: #6f5b5b;
    font-size: 1.04rem;
    line-height: 1.65;
}

.delete-actions[b-pmvff77orz] {
    position: static;
    justify-content: center;
    margin-top: 18px;
    padding: 0;
    border: 0;
}

@media (max-width: 1100px) {
    .hero-content[b-pmvff77orz] { grid-template-columns: 1fr; }
    .departments-page[b-pmvff77orz]  .hero-action-card { max-width: 520px; }
    .hierarchy-root-grid[b-pmvff77orz] { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
    .departments-page[b-pmvff77orz] { padding: 12px; }
    .departments-page[b-pmvff77orz]  .departments-hero { padding: 25px 20px; border-radius: 24px; }
    .departments-page[b-pmvff77orz]  .hero-title { font-size: 2.45rem; }
    .departments-page[b-pmvff77orz]  .hero-subtitle { font-size: 1.08rem; }
    .hero-points[b-pmvff77orz] { display: grid; }
    .panel-heading[b-pmvff77orz],
    .content-toolbar[b-pmvff77orz],
    .hierarchy-title-row[b-pmvff77orz] { align-items: flex-start; flex-direction: column; }
    .department-metrics[b-pmvff77orz] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .contact-grid[b-pmvff77orz] { grid-template-columns: 1fr; }
    .contact-span[b-pmvff77orz] { grid-column: auto; }
    .department-card-actions[b-pmvff77orz] { justify-content: stretch; }
    .department-card-actions[b-pmvff77orz]  .mud-button-root { flex: 1; }
    .image-upload-layout[b-pmvff77orz] { grid-template-columns: 1fr; }
    .image-preview-box[b-pmvff77orz] { min-height: 180px; }
    .detail-banner[b-pmvff77orz] { grid-template-columns: 90px minmax(0, 1fr); padding: 22px; }
    .detail-image-wrap[b-pmvff77orz],
    .detail-image-fallback[b-pmvff77orz],
    .detail-image-wrap img[b-pmvff77orz] { width: 88px; height: 88px; border-radius: 20px; }
    .detail-close[b-pmvff77orz] { position: absolute; top: 10px; right: 10px; }
    .detail-info-grid[b-pmvff77orz],
    .detail-contact-grid[b-pmvff77orz] { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .departments-page[b-pmvff77orz]  .summary-card { min-height: 120px; padding: 19px; }
    .department-card-top[b-pmvff77orz] { flex-wrap: wrap; }
    .department-heading[b-pmvff77orz] { min-width: calc(100% - 95px); }
    .department-metrics span[b-pmvff77orz] { font-size: .78rem; }
    .department-metrics strong[b-pmvff77orz] { font-size: 1.25rem; }
    .modal-backdrop[b-pmvff77orz] { padding: 8px; }
    .departments-page[b-pmvff77orz]  .modal-card { max-height: calc(100vh - 16px); border-radius: 20px; }
    .modal-header[b-pmvff77orz],
    .modal-body[b-pmvff77orz],
    .modal-actions[b-pmvff77orz] { padding-left: 17px; padding-right: 17px; }
    .form-section[b-pmvff77orz] { padding: 15px; }
}

.modal-click-shield[b-pmvff77orz] {
    display: flex;
    width: 100%;
    max-height: 100%;
    justify-content: center;
}
/* /Components/Pages/05Correspondence/02Staff/Staff.razor.rz.scp.css */
.staff-page[b-rbxbibeyhw] {
    --staff-green-950: #062f27;
    --staff-green-900: #08483a;
    --staff-green-800: #0b5f4b;
    --staff-green-700: #0f7a5f;
    --staff-green-100: #dff5ec;
    --staff-gold: #f4bd56;
    --staff-ink: #19342d;
    --staff-muted: #64756f;
    --staff-border: #dbe8e3;
    min-height: 100%;
    padding: 22px;
    background:
        radial-gradient(circle at 8% 0%, rgba(20, 136, 103, .09), transparent 26%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #f2f7f5 100%);
    font-family: "Kanit", sans-serif;
}

.staff-page[b-rbxbibeyhw]  .staff-hero {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    padding: 38px;
    color: white;
    background:
        linear-gradient(125deg, rgba(4, 45, 37, .98), rgba(10, 103, 78, .96)),
        url('/images/news/news-community-meeting.jpg') center/cover;
    box-shadow: 0 24px 55px rgba(6, 61, 47, .24);
}

.hero-content[b-rbxbibeyhw] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 34px;
    align-items: center;
}

.hero-glow[b-rbxbibeyhw] {
    position: absolute;
    border-radius: 999px;
    filter: blur(3px);
    opacity: .55;
}

.hero-glow-one[b-rbxbibeyhw] {
    width: 330px;
    height: 330px;
    right: 18%;
    top: -190px;
    background: rgba(255, 220, 144, .19);
}

.hero-glow-two[b-rbxbibeyhw] {
    width: 250px;
    height: 250px;
    left: -100px;
    bottom: -160px;
    background: rgba(37, 207, 154, .22);
}

.hero-kicker[b-rbxbibeyhw],
.hero-points[b-rbxbibeyhw],
.profile-code-row[b-rbxbibeyhw],
.content-toolbar[b-rbxbibeyhw],
.panel-heading[b-rbxbibeyhw],
.staff-card-top[b-rbxbibeyhw],
.staff-card-actions[b-rbxbibeyhw],
.modal-header[b-rbxbibeyhw],
.modal-actions[b-rbxbibeyhw],
.form-section-heading[b-rbxbibeyhw],
.image-preview-row[b-rbxbibeyhw],
.table-profile[b-rbxbibeyhw],
.detail-profile-banner[b-rbxbibeyhw] {
    display: flex;
    align-items: center;
}

.hero-kicker[b-rbxbibeyhw] {
    gap: 9px;
    width: fit-content;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .10);
    font-size: 1.05rem;
    font-weight: 500;
}

.staff-page[b-rbxbibeyhw]  .hero-title {
    margin-top: 18px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.4rem, 4.5vw, 4.4rem);
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: 1.08;
}

.staff-page[b-rbxbibeyhw]  .hero-subtitle {
    max-width: 760px;
    margin-top: 13px;
    color: rgba(255, 255, 255, .85);
    font-size: 1.23rem;
    line-height: 1.75;
}

.hero-points[b-rbxbibeyhw] {
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 24px;
}

.hero-points span[b-rbxbibeyhw] {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    color: rgba(255, 255, 255, .9);
    font-size: 1.02rem;
}

.staff-page[b-rbxbibeyhw]  .hero-action-card {
    position: relative;
    display: grid;
    gap: 14px;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 24px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(16px);
}

.hero-action-icon[b-rbxbibeyhw] {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 18px;
    background: linear-gradient(135deg, #ffd67f, #f2b449);
    color: #5e3a00;
    box-shadow: 0 12px 28px rgba(243, 187, 75, .25);
}

.hero-action-icon[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 2rem;
}

.staff-page[b-rbxbibeyhw]  .hero-action-title {
    color: #fff;
    font-weight: 700;
}

.staff-page[b-rbxbibeyhw]  .hero-action-text {
    color: rgba(255, 255, 255, .77);
    font-size: 1.02rem;
    line-height: 1.55;
}

.staff-page[b-rbxbibeyhw]  .hero-action-button {
    min-height: 48px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
}

.staff-page[b-rbxbibeyhw]  .summary-grid {
    margin-top: 10px;
}

.staff-page[b-rbxbibeyhw]  .summary-card {
    display: flex;
    gap: 18px;
    align-items: center;
    min-height: 138px;
    padding: 23px;
    border: 1px solid rgba(17, 102, 77, .10);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(30, 77, 63, .08);
}

.summary-icon[b-rbxbibeyhw] {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
}

.summary-icon[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 1.9rem;
}

.summary-card-green .summary-icon[b-rbxbibeyhw] { background: #daf4e8; color: #0b7657; }
.summary-card-blue .summary-icon[b-rbxbibeyhw] { background: #e0efff; color: #246bb0; }
.summary-card-amber .summary-icon[b-rbxbibeyhw] { background: #fff0d0; color: #b46e00; }
.summary-card-purple .summary-icon[b-rbxbibeyhw] { background: #eee7ff; color: #7552bc; }

.staff-page[b-rbxbibeyhw]  .summary-label {
    color: #61726c;
    font-size: 1.04rem;
    font-weight: 500;
}

.staff-page[b-rbxbibeyhw]  .summary-value {
    margin: 2px 0;
    color: var(--staff-ink);
    font-family: "Kanit", sans-serif;
    font-size: 2.45rem;
    font-weight: 800;
    line-height: 1.05;
}

.staff-page[b-rbxbibeyhw]  .summary-note {
    color: #83918c;
    font-size: .95rem;
}

.staff-page[b-rbxbibeyhw]  .filter-panel,
.staff-page[b-rbxbibeyhw]  .staff-table-wrap {
    margin-top: 20px;
    padding: 25px;
    border: 1px solid var(--staff-border);
    border-radius: 24px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 13px 32px rgba(27, 73, 60, .07);
}

.panel-heading[b-rbxbibeyhw],
.content-toolbar[b-rbxbibeyhw] {
    justify-content: space-between;
    gap: 16px;
}

.panel-heading[b-rbxbibeyhw] {
    margin-bottom: 18px;
}

.staff-page[b-rbxbibeyhw]  .panel-title,
.staff-page[b-rbxbibeyhw]  .content-title {
    color: var(--staff-ink);
    font-weight: 750;
}

.staff-page[b-rbxbibeyhw]  .panel-subtitle,
.staff-page[b-rbxbibeyhw]  .content-subtitle {
    color: var(--staff-muted);
    font-size: 1rem;
}

.staff-page[b-rbxbibeyhw]  .large-input .mud-input-label {
    color: #425a52;
    font-family: "Kanit", sans-serif;
    font-size: 1.02rem;
    font-weight: 500;
}

.staff-page[b-rbxbibeyhw]  .large-input .mud-input-slot,
.staff-page[b-rbxbibeyhw]  .large-input input,
.staff-page[b-rbxbibeyhw]  .large-input textarea,
.staff-page[b-rbxbibeyhw]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.08rem;
}

.staff-page[b-rbxbibeyhw]  .large-input .mud-input-outlined-border {
    border-color: #cfded8;
    border-radius: 13px;
}

.staff-page[b-rbxbibeyhw]  .large-input .mud-input-control-input-container {
    min-height: 54px;
}

.content-toolbar[b-rbxbibeyhw] {
    margin: 27px 0 4px;
}

.staff-page[b-rbxbibeyhw]  .staff-grid {
    margin-top: 2px;
}

.staff-page[b-rbxbibeyhw]  .staff-card {
    height: 100%;
    overflow: hidden;
    padding: 22px;
    border: 1px solid var(--staff-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(27, 75, 60, .08);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.staff-page[b-rbxbibeyhw]  .staff-card:hover {
    transform: translateY(-4px);
    border-color: rgba(19, 128, 95, .32);
    box-shadow: 0 22px 46px rgba(21, 82, 63, .14);
}

.staff-card-top[b-rbxbibeyhw] {
    align-items: flex-start;
    gap: 15px;
}

.profile-photo-wrap[b-rbxbibeyhw] {
    position: relative;
    flex: 0 0 auto;
    width: 78px;
    height: 78px;
}

.profile-fallback[b-rbxbibeyhw],
.profile-photo[b-rbxbibeyhw],
.table-avatar[b-rbxbibeyhw],
.detail-avatar[b-rbxbibeyhw] {
    border-radius: 22px;
}

.profile-fallback[b-rbxbibeyhw],
.table-avatar[b-rbxbibeyhw],
.detail-avatar[b-rbxbibeyhw] {
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #0d7a5c, #45b78d);
    color: white;
    font-weight: 800;
}

.profile-fallback[b-rbxbibeyhw],
.profile-photo[b-rbxbibeyhw] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.profile-fallback[b-rbxbibeyhw] {
    font-size: 1.45rem;
}

.profile-photo[b-rbxbibeyhw] {
    z-index: 2;
    object-fit: cover;
    background: #e7f2ee;
}

.status-dot[b-rbxbibeyhw] {
    position: absolute;
    z-index: 3;
    right: -3px;
    bottom: -3px;
    width: 20px;
    height: 20px;
    border: 4px solid white;
    border-radius: 50%;
}

.status-dot-active[b-rbxbibeyhw] { background: #21b57a; }
.status-dot-probation[b-rbxbibeyhw] { background: #3d8ee6; }
.status-dot-leave[b-rbxbibeyhw] { background: #efa72f; }
.status-dot-inactive[b-rbxbibeyhw] { background: #9aa7a2; }

.profile-main[b-rbxbibeyhw] {
    min-width: 0;
    flex: 1;
}

.staff-page[b-rbxbibeyhw]  .profile-name {
    overflow: hidden;
    color: var(--staff-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.35rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-page[b-rbxbibeyhw]  .profile-position {
    margin-top: 3px;
    color: #526961;
    font-size: 1.04rem;
}

.profile-code-row[b-rbxbibeyhw] {
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 9px;
}

.profile-code-row > span[b-rbxbibeyhw] {
    color: #7e8e88;
    font-size: .96rem;
    font-weight: 600;
}

.department-box[b-rbxbibeyhw] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-top: 20px;
    padding: 15px;
    border-radius: 17px;
    background: #f1f8f5;
    color: #176b52;
}

.department-box > div[b-rbxbibeyhw] {
    display: grid;
    gap: 2px;
}

.department-box strong[b-rbxbibeyhw] {
    color: #20483c;
    font-size: 1.05rem;
}

.department-box span[b-rbxbibeyhw] {
    color: #6b7e77;
    font-size: .96rem;
}

.staff-meta-grid[b-rbxbibeyhw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 17px;
}

.meta-item[b-rbxbibeyhw] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    min-width: 0;
    padding: 12px;
    border: 1px solid #e3ece8;
    border-radius: 15px;
    background: #fff;
}

.meta-item[b-rbxbibeyhw]  .mud-icon-root {
    color: #2f8b6e;
    font-size: 1.18rem;
}

.meta-item > div[b-rbxbibeyhw] {
    display: grid;
    min-width: 0;
}

.meta-item span[b-rbxbibeyhw] {
    color: #82908b;
    font-size: .87rem;
}

.meta-item strong[b-rbxbibeyhw] {
    overflow: hidden;
    color: #344d45;
    font-size: .98rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.meta-span-two[b-rbxbibeyhw] {
    grid-column: 1 / -1;
}

.staff-card-actions[b-rbxbibeyhw] {
    justify-content: flex-end;
    gap: 10px;
    margin-top: 19px;
    padding-top: 17px;
    border-top: 1px solid #e7eeeb;
}

.staff-page[b-rbxbibeyhw]  .staff-card-actions .mud-button-root,
.staff-page[b-rbxbibeyhw]  .modal-actions .mud-button-root,
.staff-page[b-rbxbibeyhw]  .filter-panel .mud-button-root {
    min-height: 44px;
    border-radius: 12px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 600;
}

.staff-page[b-rbxbibeyhw]  .state-panel {
    display: grid;
    place-items: center;
    gap: 13px;
    min-height: 280px;
    margin-top: 18px;
    padding: 35px;
    border: 1px dashed #cbdad4;
    border-radius: 24px;
    background: rgba(255, 255, 255, .86);
    text-align: center;
}

.staff-page[b-rbxbibeyhw]  .state-icon {
    color: #5c9b87;
    font-size: 4.2rem;
}

.staff-page[b-rbxbibeyhw]  .staff-table-wrap {
    overflow-x: auto;
    padding: 8px 18px 18px;
}

.staff-page[b-rbxbibeyhw]  .staff-table-wrap .mud-table-cell,
.staff-page[b-rbxbibeyhw]  .staff-table-wrap .mud-table-head .mud-table-cell {
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.staff-page[b-rbxbibeyhw]  .staff-table-wrap .mud-table-head .mud-table-cell {
    color: #476258;
    font-weight: 700;
}

.table-profile[b-rbxbibeyhw] {
    gap: 12px;
}

.table-avatar[b-rbxbibeyhw] {
    width: 48px;
    height: 48px;
}

.table-profile > div:last-child[b-rbxbibeyhw],
.table-stack[b-rbxbibeyhw] {
    display: grid;
    gap: 2px;
}

.table-profile strong[b-rbxbibeyhw],
.table-stack strong[b-rbxbibeyhw] {
    color: #27483d;
    font-size: 1.04rem;
}

.table-profile span[b-rbxbibeyhw],
.table-stack span[b-rbxbibeyhw] {
    color: #73857e;
}

.text-right[b-rbxbibeyhw] {
    text-align: right;
}

.staff-modal-backdrop[b-rbxbibeyhw] {
    position: fixed;
    z-index: 1300;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(4, 28, 22, .68);
    backdrop-filter: blur(8px);
}

.staff-modal-backdrop[b-rbxbibeyhw]  .staff-modal {
    width: min(1080px, 100%);
    max-height: calc(100vh - 44px);
    overflow: auto;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 28px;
    background: #f9fcfb;
    box-shadow: 0 34px 80px rgba(0, 0, 0, .28);
}

.staff-modal-backdrop[b-rbxbibeyhw]  .form-modal {
    width: min(1180px, 100%);
}

.staff-modal-backdrop[b-rbxbibeyhw]  .confirm-modal {
    width: min(520px, 100%);
    padding: 34px;
    text-align: center;
}

.modal-header[b-rbxbibeyhw] {
    position: sticky;
    z-index: 4;
    top: 0;
    justify-content: space-between;
    gap: 20px;
    padding: 24px 28px;
    border-bottom: 1px solid #dde8e4;
    background: rgba(249, 252, 251, .96);
    backdrop-filter: blur(14px);
}

.staff-modal-backdrop[b-rbxbibeyhw]  .modal-title {
    color: #163d31;
    font-family: "Kanit", sans-serif;
    font-weight: 780;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .modal-subtitle {
    color: #71837c;
    font-size: 1.02rem;
}

.detail-profile-banner[b-rbxbibeyhw] {
    gap: 20px;
    margin: 25px 28px 8px;
    padding: 24px;
    border-radius: 22px;
    background: linear-gradient(135deg, #0a5a46, #16936f);
    color: white;
}

.detail-avatar[b-rbxbibeyhw] {
    flex: 0 0 auto;
    width: 88px;
    height: 88px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .22);
    font-size: 1.8rem;
}

.detail-profile-copy[b-rbxbibeyhw] {
    display: grid;
    gap: 5px;
}

.detail-profile-copy[b-rbxbibeyhw]  .mud-typography {
    color: white;
    font-family: "Kanit", sans-serif;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .detail-grid {
    padding: 14px 28px 6px;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .detail-section {
    height: 100%;
    padding: 20px;
    border: 1px solid #dfe9e5;
    border-radius: 19px;
    background: white;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .detail-section-title {
    margin-bottom: 10px;
    color: #1b5643;
    font-weight: 700;
}

.detail-row[b-rbxbibeyhw] {
    display: grid;
    grid-template-columns: minmax(130px, .65fr) 1.35fr;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px dashed #e1eae6;
}

.detail-row:last-child[b-rbxbibeyhw] {
    border-bottom: 0;
}

.detail-row span[b-rbxbibeyhw] {
    color: #7d8c86;
}

.detail-row strong[b-rbxbibeyhw] {
    color: #304a41;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.form-modal[b-rbxbibeyhw]  .mud-form {
    padding: 24px 28px 8px;
}

.form-section-heading[b-rbxbibeyhw] {
    gap: 13px;
    margin-bottom: 17px;
    padding: 15px 17px;
    border-radius: 16px;
    background: #eaf6f1;
    color: #167354;
}

.form-section-heading > div[b-rbxbibeyhw] {
    display: grid;
}

.form-section-heading strong[b-rbxbibeyhw] {
    color: #17493a;
    font-size: 1.16rem;
}

.form-section-heading span[b-rbxbibeyhw] {
    color: #6a7d75;
    font-size: .96rem;
}

.form-section-spaced[b-rbxbibeyhw] {
    margin-top: 24px;
}

.upload-box[b-rbxbibeyhw] {
    position: relative;
    display: grid;
    place-items: center;
    gap: 6px;
    min-height: 145px;
    padding: 18px;
    overflow: hidden;
    border: 2px dashed #a9cfc1;
    border-radius: 18px;
    background: #eff8f4;
    color: #23694f;
    text-align: center;
}

.upload-box[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 2.2rem;
}

.upload-box span[b-rbxbibeyhw] {
    color: var(--theme-muted);
    font-size: .92rem;
}

.native-file-input[b-rbxbibeyhw] {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.image-preview-row[b-rbxbibeyhw] {
    gap: 15px;
    padding: 14px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: #fff;
}

.image-preview[b-rbxbibeyhw] {
    width: 78px;
    height: 78px;
    border-radius: 18px;
    object-fit: cover;
}

.image-preview-row > div[b-rbxbibeyhw] {
    display: grid;
    gap: 4px;
}

.image-preview-row span[b-rbxbibeyhw] {
    color: var(--theme-muted);
}

.modal-actions[b-rbxbibeyhw] {
    justify-content: flex-end;
    gap: 12px;
    padding: 20px 28px 26px;
}

.sticky-actions[b-rbxbibeyhw] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    border-top: 1px solid #dde8e4;
    background: rgba(249, 252, 251, .96);
    backdrop-filter: blur(14px);
}

.centered-actions[b-rbxbibeyhw] {
    justify-content: center;
    padding: 24px 0 0;
}

.confirm-icon[b-rbxbibeyhw] {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    margin: 0 auto 19px;
    border-radius: 24px;
    background: #ffe7e5;
    color: #c13a32;
}

.confirm-icon[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 2.5rem;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .confirm-title {
    color: #3b342f;
    font-weight: 750;
}

.staff-modal-backdrop[b-rbxbibeyhw]  .confirm-text {
    margin-top: 11px;
    color: #6d6a66;
    font-size: 1.08rem;
    line-height: 1.75;
}

@media (max-width: 1100px) {
    .hero-content[b-rbxbibeyhw] {
        grid-template-columns: 1fr;
    }

    .staff-page[b-rbxbibeyhw]  .hero-action-card {
        max-width: 620px;
    }
}

@media (max-width: 768px) {
    .staff-page[b-rbxbibeyhw] {
        padding: 13px;
    }

    .staff-page[b-rbxbibeyhw]  .staff-hero {
        padding: 26px 20px;
        border-radius: 24px;
    }

    .staff-page[b-rbxbibeyhw]  .hero-title {
        font-size: 2.45rem;
    }

    .staff-page[b-rbxbibeyhw]  .hero-subtitle {
        font-size: 1.08rem;
    }

    .staff-page[b-rbxbibeyhw]  .summary-card {
        min-height: 120px;
    }

    .panel-heading[b-rbxbibeyhw],
    .content-toolbar[b-rbxbibeyhw],
    .staff-card-actions[b-rbxbibeyhw] {
        align-items: stretch;
        flex-direction: column;
    }

    .staff-card-actions[b-rbxbibeyhw]  .mud-button-root {
        width: 100%;
    }

    .staff-meta-grid[b-rbxbibeyhw] {
        grid-template-columns: 1fr;
    }

    .meta-span-two[b-rbxbibeyhw] {
        grid-column: auto;
    }

    .staff-modal-backdrop[b-rbxbibeyhw] {
        padding: 8px;
    }

    .staff-modal-backdrop[b-rbxbibeyhw]  .staff-modal {
        max-height: calc(100vh - 16px);
        border-radius: 22px;
    }

    .modal-header[b-rbxbibeyhw],
    .modal-actions[b-rbxbibeyhw],
    .form-modal[b-rbxbibeyhw]  .mud-form,
    .staff-modal-backdrop[b-rbxbibeyhw]  .detail-grid {
        padding-right: 18px;
        padding-left: 18px;
    }

    .detail-profile-banner[b-rbxbibeyhw] {
        align-items: flex-start;
        margin-right: 18px;
        margin-left: 18px;
    }

    .detail-row[b-rbxbibeyhw] {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

@media (max-width: 480px) {
    .hero-kicker[b-rbxbibeyhw] {
        align-items: flex-start;
        border-radius: 16px;
    }

    .hero-points[b-rbxbibeyhw] {
        display: grid;
    }

    .staff-card-top[b-rbxbibeyhw] {
        flex-wrap: wrap;
    }

    .profile-main[b-rbxbibeyhw] {
        min-width: calc(100% - 105px);
    }

    .detail-profile-banner[b-rbxbibeyhw] {
        flex-direction: column;
    }

    .modal-actions[b-rbxbibeyhw] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .modal-actions[b-rbxbibeyhw]  .mud-button-root {
        width: 100%;
    }
}
/* ============================================================
   PREMIUM ADD / EDIT STAFF POPUP
   เนƒเธซเน‰เธ™เธณเธŠเธธเธ”เธ™เธตเน‰เน„เธ›เธ•เนˆเธญเธ—เน‰เธฒเธข Staff.razor.css เน€เธ”เธดเธก
   เธฃเธญเธ‡เธฃเธฑเธš Scoped CSS เนเธฅเธฐเน„เธกเนˆเธกเธตเธ„เธณเธชเธฑเนˆเธ‡เธ™เธณเน€เธ‚เน‰เธฒเน„เธŸเธฅเนŒเธ เธฒเธขเธ™เธญเธ
   ============================================================ */

.premium-form-backdrop[b-rbxbibeyhw] {
    padding: 18px;
    background: radial-gradient(circle at 20% 10%, rgba(13, 126, 91, .18), transparent 32%), rgba(2, 30, 23, .76);
    backdrop-filter: blur(8px);
}

    .premium-form-backdrop[b-rbxbibeyhw]  .staff-form-shell {
        display: flex;
        width: min(1180px, 100%);
        max-height: calc(100vh - 36px);
        flex-direction: column;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.72);
        border-radius: 30px;
        background: var(--theme-bg);
        box-shadow: 0 34px 90px rgba(2, 34, 26, .35), 0 0 0 1px rgba(7, 94, 70, .06);
    }

.premium-modal-header[b-rbxbibeyhw] {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    overflow: hidden;
    padding: 23px 27px;
    color: #fff;
    background: radial-gradient(circle at 82% 18%, rgba(255, 211, 92, .19), transparent 29%), linear-gradient(130deg, #043a2d 0%, #086049 58%, #0b7859 100%);
}

    .premium-modal-header[b-rbxbibeyhw]::before {
        position: absolute;
        inset: 0;
        content: "";
        opacity: .1;
        pointer-events: none;
        background-image: linear-gradient(rgba(255,255,255,.22) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.22) 1px, transparent 1px);
        background-size: 34px 34px;
        mask-image: linear-gradient(90deg, transparent, #000);
    }

.premium-modal-title-wrap[b-rbxbibeyhw] {
    position: relative;
    z-index: 1;
    display: grid;
    min-width: 0;
    grid-template-columns: 58px 1fr;
    gap: 15px;
    align-items: center;
}

.premium-modal-icon[b-rbxbibeyhw] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 18px;
    color: #543c02;
    background: linear-gradient(135deg, #ffe7a4, #dfb23e);
    box-shadow: 0 10px 24px rgba(1,27,20,.22);
}

    .premium-modal-icon[b-rbxbibeyhw]  .mud-icon-root {
        font-size: 2rem;
    }

.premium-modal-kicker[b-rbxbibeyhw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-bottom: 3px;
    color: rgba(255,255,255,.72);
    font-size: .83rem;
    font-weight: 650;
}

.premium-modal-dot[b-rbxbibeyhw] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #ffd875;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-modal-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.65rem;
    font-weight: 850;
    line-height: 1.3;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-modal-subtitle {
    margin-top: 2px;
    color: rgba(255,255,255,.72);
    font-family: "Kanit", sans-serif;
    font-size: .93rem;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-close-button {
    position: relative;
    z-index: 1;
    width: 46px;
    height: 46px;
    color: #fff;
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.09);
}

.premium-form-summary[b-rbxbibeyhw] {
    display: grid;
    flex: 0 0 auto;
    grid-template-columns: minmax(330px, .85fr) minmax(420px, 1.15fr);
    gap: 14px;
    padding: 15px 20px;
    border-bottom: 1px solid var(--theme-border);
    background: rgba(255,255,255,.94);
}

.premium-profile-summary[b-rbxbibeyhw],
.premium-completion-card[b-rbxbibeyhw] {
    min-width: 0;
    border: 1px solid var(--theme-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(23, 77, 60, .055);
}

.premium-profile-summary[b-rbxbibeyhw] {
    display: grid;
    grid-template-columns: 76px 1fr;
    gap: 13px;
    align-items: center;
    padding: 13px;
}

.premium-profile-preview[b-rbxbibeyhw] {
    position: relative;
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    overflow: hidden;
    border: 3px solid #d9eee6;
    border-radius: 21px;
    color: #fff;
    background: linear-gradient(135deg, var(--theme-primary), #27a27b);
    font-size: 1.25rem;
    font-weight: 850;
}

    .premium-profile-preview img[b-rbxbibeyhw] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.premium-profile-status[b-rbxbibeyhw] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 15px;
    height: 15px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #21b87d;
}

.premium-profile-copy[b-rbxbibeyhw] {
    display: grid;
    min-width: 0;
    gap: 3px;
}

    .premium-profile-copy > small[b-rbxbibeyhw] {
        color: var(--theme-muted);
        font-size: .76rem;
    }

    .premium-profile-copy > strong[b-rbxbibeyhw] {
        overflow: hidden;
        color: var(--theme-ink);
        font-size: 1.07rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .premium-profile-copy > span[b-rbxbibeyhw] {
        overflow: hidden;
        color: #6b7f77;
        font-size: .86rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.premium-profile-tags[b-rbxbibeyhw] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 5px;
}

    .premium-profile-tags span[b-rbxbibeyhw] {
        display: inline-flex;
        min-width: 0;
        align-items: center;
        gap: 4px;
        padding: 4px 7px;
        border-radius: 9px;
        color: #467063;
        background: #edf6f2;
        font-size: .72rem;
    }

.premium-completion-card[b-rbxbibeyhw] {
    display: grid;
    gap: 10px;
    padding: 14px 16px;
}

.premium-completion-head[b-rbxbibeyhw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

    .premium-completion-head > div[b-rbxbibeyhw] {
        display: flex;
        align-items: baseline;
        gap: 8px;
    }

    .premium-completion-head small[b-rbxbibeyhw] {
        color: #687d75;
        font-size: .82rem;
    }

    .premium-completion-head strong[b-rbxbibeyhw] {
        color: var(--theme-primary);
        font-size: 1.35rem;
        font-weight: 900;
    }

.premium-completion-badge[b-rbxbibeyhw] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 9px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: #e2f4ec;
    font-size: .72rem;
    font-weight: 750;
}

.premium-step-list[b-rbxbibeyhw] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.premium-step[b-rbxbibeyhw] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 5px;
    padding: 6px 7px;
    border-radius: 10px;
    color: #75877f;
    background: #f4f7f6;
    font-size: .7rem;
    white-space: nowrap;
}

    .premium-step b[b-rbxbibeyhw] {
        display: grid;
        width: 21px;
        height: 21px;
        flex: 0 0 auto;
        place-items: center;
        border-radius: 7px;
        color: #fff;
        background: #8aa29a;
        font-size: .68rem;
    }

    .premium-step.active[b-rbxbibeyhw] {
        color: var(--theme-primary);
        background: #e9f6f1;
        font-weight: 750;
    }

        .premium-step.active b[b-rbxbibeyhw] {
            background: var(--theme-primary);
        }

.premium-form-scroll[b-rbxbibeyhw] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 18px 20px 24px;
    scroll-behavior: smooth;
}

    .premium-form-scroll[b-rbxbibeyhw]::-webkit-scrollbar {
        width: 10px;
    }

    .premium-form-scroll[b-rbxbibeyhw]::-webkit-scrollbar-track {
        background: #eef4f1;
    }

    .premium-form-scroll[b-rbxbibeyhw]::-webkit-scrollbar-thumb {
        border: 2px solid #eef4f1;
        border-radius: 999px;
        background: #9bbcaf;
    }

.premium-form-section[b-rbxbibeyhw] {
    position: relative;
    overflow: hidden;
    margin-bottom: 16px;
    padding: 20px;
    border: 1px solid var(--theme-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 9px 25px rgba(22, 72, 57, .055);
}

    .premium-form-section:last-child[b-rbxbibeyhw] {
        margin-bottom: 0;
    }

    .premium-form-section[b-rbxbibeyhw]::after {
        position: absolute;
        right: -65px;
        bottom: -85px;
        width: 190px;
        height: 190px;
        border-radius: 50%;
        content: "";
        pointer-events: none;
        background: radial-gradient(circle, rgba(17, 138, 98, .065), transparent 68%);
    }

.premium-section-header[b-rbxbibeyhw],
.premium-field-grid[b-rbxbibeyhw] {
    position: relative;
    z-index: 1;
}

.premium-section-header[b-rbxbibeyhw] {
    display: grid;
    grid-template-columns: 49px 1fr auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 17px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e4ede9;
}

.premium-section-icon[b-rbxbibeyhw] {
    display: grid;
    width: 49px;
    height: 49px;
    place-items: center;
    border-radius: 15px;
    color: var(--theme-primary);
    background: #def3ea;
}

.premium-section-icon-blue[b-rbxbibeyhw] {
    color: #276ea5;
    background: #e4f1fb;
}

.premium-section-icon-purple[b-rbxbibeyhw] {
    color: #714ba4;
    background: #eee6f9;
}

.premium-section-icon-amber[b-rbxbibeyhw] {
    color: #9d6804;
    background: #fff0c9;
}

.premium-section-icon[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 1.7rem;
}

.premium-section-header h3[b-rbxbibeyhw] {
    margin: 0;
    color: var(--theme-ink);
    font-size: 1.17rem;
    line-height: 1.35;
}

.premium-section-header p[b-rbxbibeyhw] {
    margin: 3px 0 0;
    color: #71847c;
    font-size: .85rem;
    line-height: 1.5;
}

.premium-section-number[b-rbxbibeyhw] {
    color: #d7e5df;
    font-size: 1.65rem;
    font-weight: 900;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-input .mud-input-control {
    min-height: 58px;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-input .mud-input-label,
.premium-form-backdrop[b-rbxbibeyhw]  .premium-input input,
.premium-form-backdrop[b-rbxbibeyhw]  .premium-input textarea,
.premium-form-backdrop[b-rbxbibeyhw]  .premium-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-input .mud-input-outlined-border {
    border-color: #cadbd4;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-input:hover .mud-input-outlined-border {
    border-color: #7fb8a4;
}

.premium-postal-input[b-rbxbibeyhw]  input {
    color: var(--theme-primary);
    font-weight: 850;
    letter-spacing: .08em;
}

.premium-address-section[b-rbxbibeyhw] {
    background: linear-gradient(135deg, rgba(245,250,248,.98), #fff 56%);
}

.premium-address-preview[b-rbxbibeyhw] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 12px;
    align-items: center;
    margin-top: 14px;
    padding: 14px;
    border: 1px dashed #9fc9ba;
    border-radius: 16px;
    background: #f0f8f5;
}

.premium-address-preview-icon[b-rbxbibeyhw] {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(135deg, #2778b0, #42a1ca);
}

.premium-address-preview > div[b-rbxbibeyhw] {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.premium-address-preview small[b-rbxbibeyhw] {
    color: #74877f;
    font-size: .78rem;
}

.premium-address-preview strong[b-rbxbibeyhw] {
    color: #254c40;
    font-size: .94rem;
    line-height: 1.55;
}

.premium-address-preview span[b-rbxbibeyhw] {
    color: #2d7b62;
    font-size: .77rem;
}

.premium-upload-card[b-rbxbibeyhw] {
    display: grid;
    height: 100%;
    gap: 12px;
    padding: 14px;
    border: 1px dashed #9fc7b8;
    border-radius: 19px;
    background: linear-gradient(145deg, #edf8f4, #fff);
}

.premium-upload-preview[b-rbxbibeyhw] {
    position: relative;
    display: grid;
    width: 100%;
    min-height: 245px;
    place-items: center;
    overflow: hidden;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--theme-primary), #2aa07a);
    font-size: 2rem;
    font-weight: 900;
    cursor: pointer;
}

    .premium-upload-preview > img[b-rbxbibeyhw] {
        width: 100%;
        height: 100%;
        min-height: 245px;
        object-fit: cover;
    }

.premium-native-file-input[b-rbxbibeyhw] {
    position: absolute;
    z-index: 3;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.premium-upload-overlay[b-rbxbibeyhw] {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: #fff;
    background: rgba(3, 47, 36, .66);
    opacity: 0;
    transition: opacity .2s ease;
    pointer-events: none;
}

.premium-upload-preview:hover .premium-upload-overlay[b-rbxbibeyhw] {
    opacity: 1;
}

.premium-upload-overlay[b-rbxbibeyhw]  .mud-icon-root {
    font-size: 2.15rem;
}

.premium-upload-copy[b-rbxbibeyhw] {
    display: grid;
    gap: 3px;
}

    .premium-upload-copy strong[b-rbxbibeyhw] {
        color: #254b3f;
        font-size: 1rem;
    }

    .premium-upload-copy span[b-rbxbibeyhw] {
        color: #71847c;
        font-size: .82rem;
    }

    .premium-upload-copy small[b-rbxbibeyhw] {
        margin-top: 4px;
        padding: 6px 9px;
        overflow: hidden;
        border-radius: 9px;
        color: var(--theme-primary);
        background: color-mix(in srgb, var(--theme-light) 13%, white);
        font-size: .77rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.premium-modal-actions[b-rbxbibeyhw] {
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 15px 21px;
    border-top: 1px solid #d9e6e1;
    background: rgba(255,255,255,.97);
    box-shadow: 0 -10px 26px rgba(18, 66, 51, .06);
    backdrop-filter: blur(12px);
}

.premium-save-note[b-rbxbibeyhw] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    color: #687c74;
    font-size: .82rem;
}

    .premium-save-note[b-rbxbibeyhw]  .mud-icon-root {
        color: var(--theme-primary);
    }

.premium-action-buttons[b-rbxbibeyhw] {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

.premium-form-backdrop[b-rbxbibeyhw]  .premium-action-buttons .mud-button-root {
    min-width: 150px;
    min-height: 48px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 750;
}

@media (max-width: 980px) {
    .premium-form-summary[b-rbxbibeyhw] {
        grid-template-columns: 1fr;
    }

    .premium-step-list[b-rbxbibeyhw] {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 720px) {
    .premium-form-backdrop[b-rbxbibeyhw] {
        padding: 7px;
    }

        .premium-form-backdrop[b-rbxbibeyhw]  .staff-form-shell {
            max-height: calc(100vh - 14px);
            border-radius: 22px;
        }

    .premium-modal-header[b-rbxbibeyhw] {
        padding: 18px;
    }

    .premium-modal-title-wrap[b-rbxbibeyhw] {
        grid-template-columns: 48px 1fr;
    }

    .premium-modal-icon[b-rbxbibeyhw] {
        width: 48px;
        height: 48px;
        border-radius: 15px;
    }

    .premium-form-backdrop[b-rbxbibeyhw]  .premium-modal-title {
        font-size: 1.35rem;
    }

    .premium-form-backdrop[b-rbxbibeyhw]  .premium-modal-subtitle {
        display: none;
    }

    .premium-form-summary[b-rbxbibeyhw] {
        padding: 11px;
    }

    .premium-profile-summary[b-rbxbibeyhw] {
        grid-template-columns: 62px 1fr;
    }

    .premium-profile-preview[b-rbxbibeyhw] {
        width: 62px;
        height: 62px;
        border-radius: 17px;
    }

    .premium-completion-badge[b-rbxbibeyhw] {
        display: none;
    }

    .premium-step-list[b-rbxbibeyhw] {
        grid-template-columns: 1fr 1fr;
    }

    .premium-form-scroll[b-rbxbibeyhw] {
        padding: 12px;
    }

    .premium-form-section[b-rbxbibeyhw] {
        padding: 15px;
        border-radius: 18px;
    }

    .premium-section-header[b-rbxbibeyhw] {
        grid-template-columns: 44px 1fr;
    }

    .premium-section-icon[b-rbxbibeyhw] {
        width: 44px;
        height: 44px;
    }

    .premium-section-number[b-rbxbibeyhw] {
        display: none;
    }

    .premium-modal-actions[b-rbxbibeyhw] {
        align-items: stretch;
        flex-direction: column;
        padding: 12px;
    }

    .premium-save-note[b-rbxbibeyhw] {
        display: none;
    }

    .premium-action-buttons[b-rbxbibeyhw] {
        width: 100%;
        flex-direction: column-reverse;
    }

    .premium-form-backdrop[b-rbxbibeyhw]  .premium-action-buttons .mud-button-root {
        width: 100%;
    }

    .premium-upload-preview[b-rbxbibeyhw],
    .premium-upload-preview > img[b-rbxbibeyhw] {
        min-height: 220px;
    }
}
/* /Components/Pages/05Correspondence/02Staff/StaffAssignments.razor.rz.scp.css */
.assignment-page[b-se6dronpfx] {
    --asg-primary: var(--theme-primary);
    --asg-primary-dark: #064536;
    --asg-primary-soft: #eaf7f2;
    --asg-gold: #d5a93d;
    --asg-ink: var(--theme-ink);
    --asg-muted: #647a72;
    --asg-border: #dfece7;
    padding: 18px;
    font-family: "Kanit", sans-serif;
    color: var(--asg-ink);
    background: linear-gradient(180deg, #f4faf7 0%, #ffffff 45%);
}

.assignment-page[b-se6dronpfx]  .mud-typography-root,
.assignment-page[b-se6dronpfx]  .mud-input,
.assignment-page[b-se6dronpfx]  .mud-input-label,
.assignment-page[b-se6dronpfx]  .mud-button-root,
.assignment-page[b-se6dronpfx]  .mud-select,
.assignment-page[b-se6dronpfx]  .mud-checkbox {
    font-family: "Kanit", sans-serif;
}

.assignment-page[b-se6dronpfx]  .assignment-hero {
    position: relative;
    overflow: hidden;
    padding: 42px;
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 213, 106, .22), transparent 26%),
        linear-gradient(135deg, #064536 0%, #0a6f52 58%, #15906d 100%);
    box-shadow: 0 24px 55px rgba(6, 69, 54, .22);
}

.hero-orb[b-se6dronpfx] { position:absolute; border-radius:50%; pointer-events:none; }
.hero-orb-one[b-se6dronpfx] { width:230px; height:230px; right:-75px; top:-90px; background:rgba(255,255,255,.08); }
.hero-orb-two[b-se6dronpfx] { width:150px; height:150px; left:48%; bottom:-105px; background:rgba(213,169,61,.15); }
.hero-layout[b-se6dronpfx] { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:36px; align-items:center; }
.hero-kicker[b-se6dronpfx] { display:inline-flex; align-items:center; gap:9px; padding:8px 14px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.1); font-size:1rem; }
.assignment-page[b-se6dronpfx]  .hero-title { margin-top:17px; color:#fff; font-size:3.1rem; font-weight:800; letter-spacing:-.02em; }
.assignment-page[b-se6dronpfx]  .hero-subtitle { max-width:820px; margin-top:12px; color:rgba(255,255,255,.86); font-size:1.18rem; line-height:1.75; }
.hero-features[b-se6dronpfx] { display:flex; flex-wrap:wrap; gap:12px 20px; margin-top:24px; }
.hero-features span[b-se6dronpfx] { display:inline-flex; align-items:center; gap:7px; color:#f4fffb; font-size:1rem; }
.assignment-page[b-se6dronpfx]  .hero-action-card { padding:24px; border:1px solid rgba(255,255,255,.24); border-radius:24px; color:#fff; background:rgba(255,255,255,.12); backdrop-filter:blur(14px); }
.hero-action-icon[b-se6dronpfx] { display:grid; place-items:center; width:58px; height:58px; border-radius:18px; color:#fff4c7; background:rgba(213,169,61,.24); }
.hero-action-icon[b-se6dronpfx]  .mud-icon-root { font-size:2rem; }
.assignment-page[b-se6dronpfx]  .hero-action-title { margin-top:16px; color:#fff; font-size:1.48rem; font-weight:750; }
.assignment-page[b-se6dronpfx]  .hero-action-text { margin:8px 0 18px; color:rgba(255,255,255,.78); font-size:1rem; line-height:1.6; }
.assignment-page[b-se6dronpfx]  .hero-action-card .mud-button-root { min-height:50px; border-radius:15px; color:#4c3a08; font-size:1.08rem; font-weight:750; }

.summary-grid[b-se6dronpfx] { margin-top:6px; }
.assignment-page[b-se6dronpfx]  .summary-card { display:flex; align-items:center; gap:18px; min-height:145px; padding:24px; border:1px solid var(--asg-border); border-radius:22px; background:#fff; box-shadow:0 12px 30px rgba(18,76,60,.07); }
.summary-icon[b-se6dronpfx] { display:grid; place-items:center; flex:0 0 auto; width:58px; height:58px; border-radius:18px; }
.summary-icon[b-se6dronpfx]  .mud-icon-root { font-size:2rem; }
.summary-green .summary-icon[b-se6dronpfx] { color:#0d7657; background:#e4f6ef; }
.summary-amber .summary-icon[b-se6dronpfx] { color:#a76a00; background:#fff2d6; }
.summary-red .summary-icon[b-se6dronpfx] { color:#c34242; background:#ffe7e7; }
.summary-blue .summary-icon[b-se6dronpfx] { color:#2d6ca0; background:#e8f2fb; }
.assignment-page[b-se6dronpfx]  .summary-label { color:#5f756d; font-size:1.04rem; font-weight:650; }
.assignment-page[b-se6dronpfx]  .summary-value { margin-top:2px; color:var(--asg-ink); font-size:2.2rem; font-weight:850; }
.assignment-page[b-se6dronpfx]  .summary-note { color:#82938d; font-size:.96rem; }

.assignment-page[b-se6dronpfx]  .filter-panel { margin-top:22px; padding:25px; border:1px solid var(--asg-border); border-radius:24px; background:#fff; box-shadow:0 12px 32px rgba(17,78,61,.06); }
.panel-heading[b-se6dronpfx], .content-toolbar[b-se6dronpfx] { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.assignment-page[b-se6dronpfx]  .panel-title, .assignment-page[b-se6dronpfx]  .content-title { color:var(--asg-ink); font-size:1.42rem; font-weight:800; }
.assignment-page[b-se6dronpfx]  .panel-subtitle, .assignment-page[b-se6dronpfx]  .content-subtitle { margin-top:3px; color:var(--asg-muted); font-size:1rem; }
.assignment-page[b-se6dronpfx]  .large-input .mud-input-control { min-height:56px; }
.assignment-page[b-se6dronpfx]  .large-input .mud-input { font-size:1.05rem; }
.assignment-page[b-se6dronpfx]  .large-input .mud-input-label { font-size:1.02rem; }

.content-toolbar[b-se6dronpfx] { margin:28px 0 18px; }
.toolbar-actions[b-se6dronpfx] { display:flex; align-items:center; gap:12px; }
.assignment-page[b-se6dronpfx]  .content-toolbar .mud-button-root { min-height:46px; border-radius:13px; font-size:1.02rem; font-weight:700; }
.assignment-page[b-se6dronpfx]  .view-active { color:#fff !important; background:var(--asg-primary) !important; }

.assignment-page[b-se6dronpfx]  .state-panel { display:grid; justify-items:center; gap:14px; padding:56px 24px; border:1px dashed #b8d2c8; border-radius:24px; color:#61756e; background:#f9fcfb; text-align:center; }
.empty-icon[b-se6dronpfx] { display:grid; place-items:center; width:74px; height:74px; border-radius:22px; color:#4c8a75; background:#e8f5f0; }
.empty-icon[b-se6dronpfx]  .mud-icon-root { font-size:2.5rem; }

.assignment-page[b-se6dronpfx]  .assignment-card { position:relative; overflow:visible; height:100%; padding:24px; border:1px solid var(--asg-border); border-radius:24px; background:#fff; box-shadow:0 12px 30px rgba(16,75,59,.08); transition:.2s ease; }
.assignment-page[b-se6dronpfx]  .assignment-card:hover { transform:translateY(-3px); box-shadow:0 18px 38px rgba(16,75,59,.12); }
.card-accent[b-se6dronpfx] { position:absolute; top:0; left:0; right:0; height:5px; border-radius:24px 24px 0 0; }
.accent-normal[b-se6dronpfx] { background:#78b8a2; }.accent-urgent[b-se6dronpfx]{background:#e3b04f}.accent-very-urgent[b-se6dronpfx]{background:#e0714d}.accent-critical[b-se6dronpfx]{background:#c83e50}
.card-top[b-se6dronpfx] { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.card-code-row[b-se6dronpfx] { display:flex; align-items:center; gap:8px; }
.assignment-code[b-se6dronpfx] { color:var(--theme-muted); font-size:.93rem; font-weight:650; }
.pin-icon[b-se6dronpfx] { color:#d19b24; }
.badge-row[b-se6dronpfx] { display:flex; flex-wrap:wrap; gap:7px; }
.status-badge[b-se6dronpfx], .priority-badge[b-se6dronpfx] { display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; font-size:.86rem; font-weight:700; white-space:nowrap; }
.status-draft[b-se6dronpfx]{color:#65736e;background:#eef1f0}.status-assigned[b-se6dronpfx]{color:#356c9d;background:#e8f2fb}.status-accepted[b-se6dronpfx]{color:#715caa;background:#f0ecfb}.status-progress[b-se6dronpfx]{color:var(--theme-primary);background:#e2f5ee}.status-review[b-se6dronpfx]{color:#9a6600;background:#fff2d7}.status-completed[b-se6dronpfx]{color:#23704f;background:#dff3e9}.status-revision[b-se6dronpfx]{color:#ae4b28;background:#ffe9df}.status-cancelled[b-se6dronpfx]{color:#a63c3c;background:#ffe3e3}
.priority-normal[b-se6dronpfx]{color:#50746a;background:#edf5f2}.priority-urgent[b-se6dronpfx]{color:#976100;background:#fff0cf}.priority-very-urgent[b-se6dronpfx]{color:#b24a25;background:#ffe5d9}.priority-critical[b-se6dronpfx]{color:#ad2940;background:#ffe1e7}
.assignment-page[b-se6dronpfx]  .assignment-title { margin-top:18px; min-height:62px; color:var(--asg-ink); font-size:1.32rem; font-weight:800; line-height:1.45; }
.assignment-page[b-se6dronpfx]  .assignment-description { display:-webkit-box; overflow:hidden; min-height:72px; margin-top:8px; color:var(--theme-muted); font-size:1rem; line-height:1.65; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.assignee-box[b-se6dronpfx] { display:flex; align-items:center; gap:13px; margin-top:18px; padding:14px; border-radius:17px; background:#f2f8f5; }
.assignee-avatar[b-se6dronpfx] { position:relative; overflow:hidden; flex:0 0 auto; width:54px; height:54px; border-radius:17px; background:linear-gradient(135deg,#0d7658,#27a47f); }
.assignee-avatar img[b-se6dronpfx] { width:100%; height:100%; object-fit:cover; }
.avatar-fallback[b-se6dronpfx] { display:none; place-items:center; position:absolute; inset:0; color:#fff; font-size:1.05rem; font-weight:800; }
.avatar-visible[b-se6dronpfx] { display:grid; }
.assignee-info[b-se6dronpfx] { display:grid; min-width:0; }
.assignee-info span[b-se6dronpfx] { color:var(--theme-muted); font-size:.86rem; }
.assignee-info strong[b-se6dronpfx] { overflow:hidden; color:#24483c; font-size:1.05rem; text-overflow:ellipsis; white-space:nowrap; }
.assignee-info small[b-se6dronpfx] { overflow:hidden; color:#788b84; font-size:.88rem; text-overflow:ellipsis; white-space:nowrap; }
.progress-section[b-se6dronpfx] { margin-top:18px; }
.progress-head[b-se6dronpfx] { display:flex; justify-content:space-between; margin-bottom:8px; color:var(--theme-muted); }
.progress-head strong[b-se6dronpfx] { color:#24483c; font-size:1rem; }
.meta-grid[b-se6dronpfx] { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:17px; }
.meta-grid > div[b-se6dronpfx] { display:grid; justify-items:center; gap:4px; padding:12px 7px; border:1px solid #e3eee9; border-radius:14px; text-align:center; }
.meta-grid[b-se6dronpfx]  .mud-icon-root { color:#4f8975; }
.meta-grid span[b-se6dronpfx] { color:#778a83; font-size:.8rem; }
.meta-grid strong[b-se6dronpfx] { color:#294a40; font-size:.89rem; }
.overdue-alert[b-se6dronpfx], .due-note[b-se6dronpfx] { display:flex; align-items:center; gap:8px; margin-top:14px; padding:11px 13px; border-radius:13px; font-size:.94rem; font-weight:650; }
.overdue-alert[b-se6dronpfx] { color:#a63b3b; background:#fff0f0; }.due-note[b-se6dronpfx]{color:#5f756d;background:#f2f7f5}
.card-actions[b-se6dronpfx] { position:relative; justify-content:space-between; margin-top:18px; padding-top:16px; border-top:1px solid #e5efeb; }
.assignment-page[b-se6dronpfx]  .card-actions .mud-button-root { font-size:.96rem; font-weight:650; }
.action-menu[b-se6dronpfx] { position:absolute; z-index:20; right:18px; bottom:64px; display:grid; min-width:205px; padding:8px; border:1px solid #dceae4; border-radius:15px; background:#fff; box-shadow:0 18px 40px rgba(13,59,46,.18); }
.action-menu button[b-se6dronpfx] { display:flex; align-items:center; gap:9px; padding:11px 12px; border:0; border-radius:10px; color:#34564b; background:transparent; font-family:"Kanit",sans-serif; font-size:.95rem; cursor:pointer; }
.action-menu button:hover[b-se6dronpfx] { background:#eff7f4; }.action-menu .danger-action[b-se6dronpfx]{color:#bd3e3e}.action-menu .danger-action:hover[b-se6dronpfx]{background:#fff0f0}
.due-overdue[b-se6dronpfx]{color:#c23c3c!important;font-weight:750}.due-soon[b-se6dronpfx]{color:#bd7400!important;font-weight:750}.due-normal[b-se6dronpfx]{color:#405f55}

.assignment-page[b-se6dronpfx]  .table-panel { overflow:hidden; border:1px solid var(--asg-border); border-radius:24px; background:#fff; box-shadow:0 12px 30px rgba(17,76,60,.07); }
.table-scroll[b-se6dronpfx] { overflow:auto; }
.assignment-table[b-se6dronpfx] { width:100%; min-width:1180px; border-collapse:collapse; }
.assignment-table th[b-se6dronpfx] { padding:15px; color:#4e6a61; background:#eff7f4; text-align:left; font-size:.98rem; font-weight:750; }
.assignment-table td[b-se6dronpfx] { padding:16px 15px; border-bottom:1px solid #e4eee9; color:#344f46; font-size:1rem; vertical-align:middle; }
.assignment-table tbody tr:hover[b-se6dronpfx] { background:#f9fcfb; }
.table-title-cell[b-se6dronpfx] { display:grid; min-width:300px; }
.table-title-cell strong[b-se6dronpfx] { color:#24483c; font-size:1.02rem; }
.table-title-cell span[b-se6dronpfx], .table-assignee span[b-se6dronpfx] { color:#7a8d86; font-size:.88rem; }
.table-assignee[b-se6dronpfx] { display:flex; align-items:center; gap:10px; min-width:240px; }
.table-avatar[b-se6dronpfx] { display:grid; place-items:center; flex:0 0 auto; width:42px; height:42px; border-radius:13px; color:#fff!important; background:linear-gradient(135deg,#0b7054,#28a37e); font-weight:800; }
.table-assignee div[b-se6dronpfx] { display:grid; }.table-assignee strong[b-se6dronpfx]{color:#2c4c42}.table-progress[b-se6dronpfx]{display:grid;grid-template-columns:120px auto;gap:9px;align-items:center;min-width:175px}

.modal-backdrop[b-se6dronpfx] { position:fixed; z-index:1500; inset:0; display:grid; place-items:center; padding:20px; background:rgba(5,31,24,.62); backdrop-filter:blur(5px); }
.assignment-page[b-se6dronpfx]  .modal-panel { width:min(720px,100%); max-height:93vh; overflow:auto; border-radius:27px; background:#fff; }
.assignment-page[b-se6dronpfx]  .modal-large { width:min(1050px,100%); }
.modal-header[b-se6dronpfx] { position:sticky; z-index:5; top:0; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:24px 26px; border-bottom:1px solid var(--theme-border); background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
.assignment-page[b-se6dronpfx]  .modal-title { color:var(--asg-ink); font-family:"Kanit",sans-serif; font-weight:850; }
.assignment-page[b-se6dronpfx]  .modal-subtitle { color:var(--asg-muted); font-size:1rem; }
.modal-body[b-se6dronpfx], .detail-body[b-se6dronpfx] { padding:24px 26px; }
.form-section-title[b-se6dronpfx] { display:flex; align-items:center; gap:10px; margin:6px 0 16px; padding-bottom:10px; border-bottom:1px solid #e5efeb; color:#155e48; font-size:1.17rem; font-weight:750; }
.form-section-title:not(:first-child)[b-se6dronpfx] { margin-top:30px; }
.modal-actions[b-se6dronpfx] { position:sticky; bottom:0; z-index:4; display:flex; justify-content:flex-end; gap:10px; padding:18px 26px; border-top:1px solid var(--theme-border); background:#fff; }
.assignment-page[b-se6dronpfx]  .modal-actions .mud-button-root { min-height:46px; border-radius:13px; font-size:1.02rem; font-weight:700; }
.upload-box[b-se6dronpfx] { display:flex; align-items:center; justify-content:center; gap:10px; min-height:82px; padding:18px; border:2px dashed #a6c9bc; border-radius:18px; color:#356b59; background:#f5fbf8; cursor:pointer; font-size:1.03rem; }
.upload-box input[b-se6dronpfx] { display:none; }
.evidence-preview[b-se6dronpfx] { margin-top:12px; overflow:hidden; width:220px; height:135px; border-radius:17px; box-shadow:0 8px 20px rgba(20,72,55,.16); }
.evidence-preview img[b-se6dronpfx] { width:100%; height:100%; object-fit:cover; }

.detail-hero[b-se6dronpfx] { display:flex; justify-content:space-between; gap:24px; padding:28px 26px; color:#fff; background:linear-gradient(135deg,#07503d,#0c7556); }
.detail-hero > div:first-child[b-se6dronpfx] { flex:1; }
.assignment-page[b-se6dronpfx]  .detail-title { margin-top:13px; color:#fff; font-size:1.8rem; font-weight:850; }
.assignment-page[b-se6dronpfx]  .detail-description { margin-top:8px; color:rgba(255,255,255,.82); font-size:1.05rem; line-height:1.7; }
.detail-progress-ring[b-se6dronpfx] { display:grid; place-items:center; align-content:center; flex:0 0 auto; width:130px; height:130px; border:8px solid rgba(255,255,255,.23); border-radius:50%; background:rgba(255,255,255,.1); }
.detail-progress-ring strong[b-se6dronpfx] { font-size:1.8rem; }.detail-progress-ring span[b-se6dronpfx]{font-size:.9rem;color:rgba(255,255,255,.78)}
.detail-section + .detail-section[b-se6dronpfx] { margin-top:25px; }
.assignment-page[b-se6dronpfx]  .detail-section-title { margin-bottom:13px; color:#1f5544; font-size:1.18rem; font-weight:800; }
.detail-person-grid[b-se6dronpfx] { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.detail-person-card[b-se6dronpfx] { display:grid; gap:4px; padding:16px; border:1px solid #dfebe6; border-radius:16px; background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.detail-person-card span[b-se6dronpfx], .detail-grid span[b-se6dronpfx], .detail-grid small[b-se6dronpfx] { color:#72867e; font-size:.9rem; }.detail-person-card strong[b-se6dronpfx],.detail-grid strong[b-se6dronpfx]{color:#294a40;font-size:1.02rem}
.detail-grid[b-se6dronpfx] { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }
.detail-grid > div[b-se6dronpfx] { display:grid; gap:5px; padding:15px; border:1px solid #e1ece7; border-radius:15px; }
.detail-span[b-se6dronpfx] { grid-column:1/-1; }
.detail-evidence[b-se6dronpfx] { padding:0 26px 24px; }.detail-evidence span[b-se6dronpfx]{display:block;margin-bottom:8px;color:var(--theme-muted)}.detail-evidence img[b-se6dronpfx]{width:100%;max-height:320px;object-fit:cover;border-radius:19px}
.confirm-panel[b-se6dronpfx] { padding:34px; text-align:center; }.confirm-icon[b-se6dronpfx]{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 18px;border-radius:22px;color:#c33f3f;background:#ffe6e6}.confirm-icon[b-se6dronpfx]  .mud-icon-root{font-size:2.2rem}.confirm-text[b-se6dronpfx]{margin-top:12px;color:#62766e;line-height:1.7}.center-actions[b-se6dronpfx]{position:static;justify-content:center;border:0;padding:22px 0 0}

@media (max-width: 1100px) {
    .hero-layout[b-se6dronpfx] { grid-template-columns:1fr; }
    .assignment-page[b-se6dronpfx]  .hero-action-card { max-width:520px; }
}

@media (max-width: 760px) {
    .assignment-page[b-se6dronpfx] { padding:12px; }
    .assignment-page[b-se6dronpfx]  .assignment-hero { padding:28px 20px; border-radius:24px; }
    .assignment-page[b-se6dronpfx]  .hero-title { font-size:2.3rem; }
    .assignment-page[b-se6dronpfx]  .hero-subtitle { font-size:1.08rem; }
    .panel-heading[b-se6dronpfx], .content-toolbar[b-se6dronpfx] { align-items:flex-start; flex-direction:column; }
    .toolbar-actions[b-se6dronpfx] { width:100%; flex-wrap:wrap; }
    .meta-grid[b-se6dronpfx], .detail-grid[b-se6dronpfx], .detail-person-grid[b-se6dronpfx] { grid-template-columns:1fr; }
    .detail-span[b-se6dronpfx] { grid-column:auto; }
    .card-top[b-se6dronpfx] { flex-direction:column; }
    .detail-hero[b-se6dronpfx] { flex-direction:column; }
    .detail-progress-ring[b-se6dronpfx] { width:110px; height:110px; }
    .modal-backdrop[b-se6dronpfx] { padding:8px; }
    .modal-header[b-se6dronpfx], .modal-body[b-se6dronpfx], .detail-body[b-se6dronpfx], .modal-actions[b-se6dronpfx] { padding-left:18px; padding-right:18px; }
}
/* /Components/Pages/05Correspondence/02Staff/StaffAttendance.razor.rz.scp.css */
.attendance-page[b-avmeh2md1l] {
    --att-green-950: #052f27;
    --att-green-900: #074838;
    --att-green-800: #0a624b;
    --att-green-700: #0d7a5b;
    --att-gold: #f2bd58;
    --att-ink: #17362d;
    --att-muted: #657870;
    --att-border: #d9e8e2;
    min-height: 100%;
    padding: 22px;
    background: radial-gradient(circle at 8% 0%, rgba(20, 136, 103, .09), transparent 26%), linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #f2f7f5 100%);
    font-family: "Kanit", sans-serif;
}

.attendance-page[b-avmeh2md1l]  .attendance-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: #fff;
    background: linear-gradient(125deg, rgba(4, 45, 37, .98), rgba(10, 103, 78, .96)), url('/images/news/news-community-meeting.jpg') center/cover;
    box-shadow: 0 24px 55px rgba(6, 61, 47, .24);
}

.hero-content[b-avmeh2md1l] { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 34px; align-items: center; }
.hero-glow[b-avmeh2md1l] { position: absolute; border-radius: 999px; opacity: .55; }
.hero-glow-one[b-avmeh2md1l] { width: 330px; height: 330px; right: 18%; top: -190px; background: rgba(255, 220, 144, .19); }
.hero-glow-two[b-avmeh2md1l] { width: 250px; height: 250px; left: -100px; bottom: -160px; background: rgba(37, 207, 154, .22); }
.hero-kicker[b-avmeh2md1l], .hero-points[b-avmeh2md1l], .clock-card-head[b-avmeh2md1l], .clock-actions[b-avmeh2md1l], .panel-heading[b-avmeh2md1l], .content-toolbar[b-avmeh2md1l], .date-toolbar[b-avmeh2md1l], .date-nav[b-avmeh2md1l], .date-actions[b-avmeh2md1l], .attendance-card-head[b-avmeh2md1l], .profile-code-row[b-avmeh2md1l], .card-actions[b-avmeh2md1l], .modal-header[b-avmeh2md1l], .modal-actions[b-avmeh2md1l], .form-section-heading[b-avmeh2md1l], .table-profile[b-avmeh2md1l], .detail-profile-banner[b-avmeh2md1l] { display: flex; align-items: center; }
.hero-kicker[b-avmeh2md1l] { gap: 9px; width: fit-content; padding: 8px 14px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(255,255,255,.10); font-size: 1.05rem; font-weight: 500; }
.attendance-page[b-avmeh2md1l]  .hero-title { margin-top: 18px; color: #fff; font-family: "Kanit", sans-serif; font-size: clamp(2.35rem, 4.5vw, 4.25rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; }
.attendance-page[b-avmeh2md1l]  .hero-subtitle { max-width: 780px; margin-top: 13px; color: rgba(255,255,255,.85); font-size: 1.23rem; line-height: 1.75; }
.hero-points[b-avmeh2md1l] { flex-wrap: wrap; gap: 12px 20px; margin-top: 24px; }
.hero-points span[b-avmeh2md1l] { display: inline-flex; align-items: center; gap: 7px; font-size: 1.02rem; color: rgba(255,255,255,.9); }

.attendance-page[b-avmeh2md1l]  .clock-card { padding: 25px; border: 1px solid rgba(255,255,255,.2); border-radius: 24px; background: rgba(255,255,255,.12); backdrop-filter: blur(16px); }
.clock-card-head[b-avmeh2md1l] { gap: 16px; }
.clock-icon[b-avmeh2md1l] { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 18px; color: #5a3900; background: linear-gradient(135deg,#ffd67f,#f2b449); }
.clock-icon[b-avmeh2md1l]  .mud-icon-root { font-size: 2rem; }
.attendance-page[b-avmeh2md1l]  .clock-label { color: rgba(255,255,255,.78); font-size: 1rem; }
.attendance-page[b-avmeh2md1l]  .clock-time { color: #fff; font-family: "Kanit", sans-serif; font-size: 2.65rem; font-weight: 800; line-height: 1; }
.attendance-page[b-avmeh2md1l]  .clock-date { margin-top: 5px; color: rgba(255,255,255,.8); font-size: .98rem; }
.clock-actions[b-avmeh2md1l] { gap: 10px; margin-top: 20px; }
.clock-actions[b-avmeh2md1l]  .mud-button-root { flex: 1; min-height: 48px; border-radius: 14px; font-family: "Kanit",sans-serif; font-size: 1.02rem; font-weight: 700; }
.attendance-page[b-avmeh2md1l]  .clock-note { display: block; margin-top: 12px; color: rgba(255,255,255,.68); font-size: .9rem; }

.attendance-page[b-avmeh2md1l]  .summary-grid { margin-top: 10px; }
.attendance-page[b-avmeh2md1l]  .summary-card { display: flex; gap: 18px; align-items: center; min-height: 138px; padding: 23px; border: 1px solid rgba(17,102,77,.10); border-radius: 23px; background: #fff; box-shadow: 0 12px 30px rgba(30,77,63,.08); }
.summary-icon[b-avmeh2md1l] { display: grid; place-items: center; flex: 0 0 auto; width: 58px; height: 58px; border-radius: 18px; }
.summary-icon[b-avmeh2md1l]  .mud-icon-root { font-size: 1.9rem; }
.summary-green .summary-icon[b-avmeh2md1l] { color:#0b7657; background:#daf4e8; }
.summary-amber .summary-icon[b-avmeh2md1l] { color:#b46e00; background:#fff0d0; }
.summary-blue .summary-icon[b-avmeh2md1l] { color:#246bb0; background:#e0efff; }
.summary-red .summary-icon[b-avmeh2md1l] { color:#c13f3f; background:#ffe5e5; }
.attendance-page[b-avmeh2md1l]  .summary-label { color:#61726c; font-size:1.04rem; font-weight:500; }
.attendance-page[b-avmeh2md1l]  .summary-value { margin:2px 0; color:var(--att-ink); font-family:"Kanit",sans-serif; font-size:2.45rem; font-weight:800; line-height:1.05; }
.attendance-page[b-avmeh2md1l]  .summary-note { color:#83918c; font-size:.95rem; }

.attendance-page[b-avmeh2md1l]  .date-toolbar, .attendance-page[b-avmeh2md1l]  .filter-panel, .attendance-page[b-avmeh2md1l]  .table-wrap { margin-top:20px; padding:24px; border:1px solid var(--att-border); border-radius:24px; background:rgba(255,255,255,.96); box-shadow:0 13px 32px rgba(27,73,60,.07); }
.date-toolbar[b-avmeh2md1l], .panel-heading[b-avmeh2md1l], .content-toolbar[b-avmeh2md1l] { justify-content:space-between; gap:16px; }
.date-nav[b-avmeh2md1l] { gap:8px; }
.date-display[b-avmeh2md1l] { min-width:310px; text-align:center; }
.attendance-page[b-avmeh2md1l]  .selected-date-title, .attendance-page[b-avmeh2md1l]  .panel-title, .attendance-page[b-avmeh2md1l]  .content-title { color:var(--att-ink); font-weight:750; }
.attendance-page[b-avmeh2md1l]  .selected-date-subtitle, .attendance-page[b-avmeh2md1l]  .panel-subtitle, .attendance-page[b-avmeh2md1l]  .content-subtitle { color:var(--att-muted); font-size:1rem; }
.date-actions[b-avmeh2md1l] { gap:10px; flex-wrap:wrap; }
.attendance-page[b-avmeh2md1l]  .date-picker { min-width:190px; }
.panel-heading[b-avmeh2md1l] { margin-bottom:18px; }
.attendance-page[b-avmeh2md1l]  .large-input .mud-input-label, .attendance-page[b-avmeh2md1l]  .date-picker .mud-input-label { color:#425a52; font-family:"Kanit",sans-serif; font-size:1.03rem; font-weight:500; }
.attendance-page[b-avmeh2md1l]  .large-input input, .attendance-page[b-avmeh2md1l]  .large-input textarea, .attendance-page[b-avmeh2md1l]  .large-input .mud-select-input, .attendance-page[b-avmeh2md1l]  .date-picker input { font-family:"Kanit",sans-serif; font-size:1.08rem; }
.attendance-page[b-avmeh2md1l]  .large-input .mud-input-control, .attendance-page[b-avmeh2md1l]  .date-picker .mud-input-control { min-height:58px; }

.content-toolbar[b-avmeh2md1l] { margin:26px 2px 14px; }
.attendance-page[b-avmeh2md1l]  .state-panel { display:grid; justify-items:center; gap:13px; margin-top:16px; padding:58px 24px; border:1px dashed #bfd5cc; border-radius:24px; color:#60736c; background:#fff; text-align:center; }
.state-icon[b-avmeh2md1l] { font-size:3.5rem; color:#739e90; }

.attendance-page[b-avmeh2md1l]  .attendance-card { position:relative; overflow:hidden; height:100%; padding:24px; border:1px solid #dceae4; border-radius:24px; background:#fff; box-shadow:0 13px 32px rgba(29,74,61,.08); transition:.22s ease; }
.attendance-page[b-avmeh2md1l]  .attendance-card:hover { transform:translateY(-4px); box-shadow:0 20px 42px rgba(29,74,61,.13); }
.card-status-bar[b-avmeh2md1l] { position:absolute; top:0; left:0; right:0; height:6px; }
.status-green[b-avmeh2md1l]{background:#23a777}.status-amber[b-avmeh2md1l]{background:#eba928}.status-blue[b-avmeh2md1l]{background:#3b82d0}.status-purple[b-avmeh2md1l]{background:#8a67d3}.status-red[b-avmeh2md1l]{background:#dc5252}.status-orange[b-avmeh2md1l]{background:#e47b2b}.status-gray[b-avmeh2md1l]{background:#8a9691}
.attendance-card-head[b-avmeh2md1l] { align-items:flex-start; gap:14px; }
.profile-photo-wrap[b-avmeh2md1l] { position:relative; flex:0 0 auto; width:72px; height:72px; }
.profile-fallback[b-avmeh2md1l], .profile-photo[b-avmeh2md1l] { position:absolute; inset:0; width:72px; height:72px; border-radius:22px; }
.profile-fallback[b-avmeh2md1l] { display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#0c7a5b,#15a077); font-size:1.4rem; font-weight:800; }
.profile-photo[b-avmeh2md1l] { object-fit:cover; border:3px solid #fff; box-shadow:0 8px 18px rgba(18,83,64,.16); }
.profile-main[b-avmeh2md1l] { min-width:0; flex:1; }
.attendance-page[b-avmeh2md1l]  .profile-name { color:var(--att-ink); font-size:1.28rem; font-weight:750; line-height:1.35; }
.attendance-page[b-avmeh2md1l]  .profile-position { color:#5f746c; font-size:1rem; }
.profile-code-row[b-avmeh2md1l] { flex-wrap:wrap; gap:8px; margin-top:8px; }
.profile-code-row > span[b-avmeh2md1l] { color:#789087; font-size:.92rem; }
.department-box[b-avmeh2md1l] { display:flex; gap:12px; align-items:center; margin-top:18px; padding:14px 16px; border-radius:16px; color:#265848; background:#eef8f4; }
.department-box div[b-avmeh2md1l] { display:grid; }
.department-box strong[b-avmeh2md1l] { font-size:1rem; }
.department-box span[b-avmeh2md1l] { color:#6f837c; font-size:.92rem; }
.time-grid[b-avmeh2md1l] { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:15px; }
.time-box[b-avmeh2md1l] { display:grid; gap:2px; padding:15px; border-radius:16px; }
.time-in[b-avmeh2md1l] { background:#ecf8f3; }.time-out[b-avmeh2md1l]{background:#eef4fb;}
.time-box span[b-avmeh2md1l]{color:#6a7d76;font-size:.92rem}.time-box strong[b-avmeh2md1l]{color:var(--att-ink);font-size:1.42rem}.time-box small[b-avmeh2md1l]{color:#87958f}
.attendance-metrics[b-avmeh2md1l] { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; }
.attendance-metrics > div[b-avmeh2md1l] { display:grid; justify-items:center; gap:4px; padding:12px 6px; border:1px solid #e3eee9; border-radius:14px; text-align:center; }
.attendance-metrics[b-avmeh2md1l]  .mud-icon-root { color:#4e8975; }
.attendance-metrics span[b-avmeh2md1l] { color:#768980; font-size:.82rem; }
.attendance-metrics strong[b-avmeh2md1l] { color:#24453a; font-size:.94rem; }
.location-row[b-avmeh2md1l] { display:flex; align-items:center; gap:9px; margin-top:14px; color:#526b62; font-size:.98rem; }
.work-summary[b-avmeh2md1l] { margin-top:12px; padding:13px 15px; border-left:4px solid #80c6ae; border-radius:0 12px 12px 0; color:#52675f; background:color-mix(in srgb, var(--theme-bg) 58%, white); line-height:1.55; }
.card-actions[b-avmeh2md1l] { justify-content:space-between; gap:8px; margin-top:18px; padding-top:16px; border-top:1px solid #e5efeb; }

.table-scroll[b-avmeh2md1l] { overflow:auto; }
.attendance-table[b-avmeh2md1l] { width:100%; min-width:1100px; border-collapse:collapse; }
.attendance-table th[b-avmeh2md1l] { padding:14px; color:#557069; background:#f0f7f4; text-align:left; font-size:.98rem; font-weight:700; }
.attendance-table td[b-avmeh2md1l] { padding:15px 14px; border-bottom:1px solid #e5efeb; color:#344f46; font-size:1rem; vertical-align:middle; }
.attendance-table tbody tr:hover[b-avmeh2md1l] { background:color-mix(in srgb, var(--theme-bg) 58%, white); }
.table-profile[b-avmeh2md1l] { gap:11px; min-width:255px; }
.table-avatar[b-avmeh2md1l] { display:grid; place-items:center; flex:0 0 auto; width:44px; height:44px; border-radius:14px; color:#fff; background:linear-gradient(135deg,#0d7c5c,#25a67e); font-weight:700; }
.table-profile div:last-child[b-avmeh2md1l] { display:grid; }
.table-profile span[b-avmeh2md1l], .table-subtext[b-avmeh2md1l] { display:block; color:#7c8e87; font-size:.9rem; }

.modal-backdrop[b-avmeh2md1l] { position:fixed; z-index:1400; inset:0; display:grid; place-items:center; padding:20px; background:rgba(7,31,25,.58); backdrop-filter:blur(5px); }
.attendance-page[b-avmeh2md1l]  .modal-panel { width:min(720px,100%); max-height:92vh; overflow:auto; border-radius:26px; background:#fff; }
.attendance-page[b-avmeh2md1l]  .modal-large { width:min(1050px,100%); }
.modal-header[b-avmeh2md1l] { position:sticky; z-index:4; top:0; justify-content:space-between; gap:15px; padding:24px 26px; border-bottom:1px solid #e3ece8; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }
.attendance-page[b-avmeh2md1l]  .modal-title { color:var(--att-ink); font-family:"Kanit",sans-serif; font-weight:800; }
.attendance-page[b-avmeh2md1l]  .modal-subtitle { color:var(--att-muted); font-size:1rem; }
.modal-body[b-avmeh2md1l] { padding:24px 26px; }
.form-section-heading[b-avmeh2md1l] { gap:10px; margin:10px 0 16px; padding-bottom:10px; border-bottom:1px solid #e6efeb; color:#175d49; font-size:1.14rem; font-weight:700; }
.form-section-heading:not(:first-child)[b-avmeh2md1l]{margin-top:28px}
.modal-actions[b-avmeh2md1l] { position:sticky; bottom:0; justify-content:flex-end; gap:10px; padding:18px 26px; border-top:1px solid var(--theme-border); background:#fff; }
.modal-actions[b-avmeh2md1l]  .mud-button-root { min-height:46px; border-radius:13px; font-family:"Kanit",sans-serif; font-size:1.02rem; font-weight:650; }
.upload-box[b-avmeh2md1l] { display:flex; align-items:center; justify-content:center; gap:10px; min-height:82px; padding:18px; border:2px dashed #a7c9bc; border-radius:18px; color:#356b59; background:#f6fbf9; cursor:pointer; font-size:1.03rem; }
.upload-box input[b-avmeh2md1l] { display:none; }
.evidence-preview[b-avmeh2md1l] { margin-top:12px; overflow:hidden; width:190px; height:120px; border-radius:16px; box-shadow:0 8px 20px rgba(20,72,55,.15); }
.evidence-preview img[b-avmeh2md1l] { width:100%; height:100%; object-fit:cover; }
.detail-profile-banner[b-avmeh2md1l] { gap:16px; padding:24px 26px; background:linear-gradient(135deg,#eff9f5,color-mix(in srgb, var(--theme-bg) 58%, white)); }
.detail-avatar[b-avmeh2md1l] { display:grid; place-items:center; width:64px; height:64px; border-radius:20px; color:#fff; background:linear-gradient(135deg,#0d7c5c,#25a67e); font-size:1.3rem; font-weight:800; }
.detail-profile-banner > div:nth-child(2)[b-avmeh2md1l]{flex:1}
.detail-grid[b-avmeh2md1l] { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; padding:24px 26px; }
.detail-grid > div[b-avmeh2md1l] { display:grid; gap:5px; padding:15px; border:1px solid #e2ede8; border-radius:15px; }
.detail-grid span[b-avmeh2md1l] { color:#73867e; font-size:.92rem; }.detail-grid strong[b-avmeh2md1l]{color:#26463b;font-size:1.02rem}.detail-span[b-avmeh2md1l]{grid-column:1/-1}
.detail-evidence[b-avmeh2md1l] { padding:0 26px 24px; }.detail-evidence span[b-avmeh2md1l]{display:block;margin-bottom:8px;color:var(--theme-muted)}.detail-evidence img[b-avmeh2md1l]{width:100%;max-height:300px;object-fit:cover;border-radius:18px}
.confirm-panel[b-avmeh2md1l] { padding:34px; text-align:center; }.confirm-icon[b-avmeh2md1l]{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 18px;border-radius:22px;color:#c54141;background:#ffe7e7}.confirm-icon[b-avmeh2md1l]  .mud-icon-root{font-size:2.2rem}.confirm-text[b-avmeh2md1l]{margin-top:12px;color:var(--theme-muted);line-height:1.7}.center-actions[b-avmeh2md1l]{position:static;justify-content:center;border:0;padding:22px 0 0}

@media (max-width: 1100px) { .hero-content[b-avmeh2md1l]{grid-template-columns:1fr}.clock-card[b-avmeh2md1l]{max-width:520px}.date-toolbar[b-avmeh2md1l]{align-items:flex-start;flex-direction:column}.date-actions[b-avmeh2md1l]{width:100%} }
@media (max-width: 760px) { .attendance-page[b-avmeh2md1l]{padding:12px}.attendance-page[b-avmeh2md1l]  .attendance-hero{padding:26px 20px;border-radius:24px}.attendance-page[b-avmeh2md1l]  .hero-title{font-size:2.35rem}.attendance-page[b-avmeh2md1l]  .hero-subtitle{font-size:1.08rem}.clock-actions[b-avmeh2md1l]{flex-direction:column}.clock-actions[b-avmeh2md1l]  .mud-button-root{width:100%}.date-nav[b-avmeh2md1l]{width:100%;justify-content:center}.date-display[b-avmeh2md1l]{min-width:0}.date-actions[b-avmeh2md1l]{display:grid;grid-template-columns:1fr}.attendance-page[b-avmeh2md1l]  .date-picker{width:100%}.panel-heading[b-avmeh2md1l],.content-toolbar[b-avmeh2md1l]{align-items:flex-start;flex-direction:column}.time-grid[b-avmeh2md1l],.detail-grid[b-avmeh2md1l]{grid-template-columns:1fr}.attendance-metrics[b-avmeh2md1l]{grid-template-columns:1fr}.detail-span[b-avmeh2md1l]{grid-column:auto}.modal-backdrop[b-avmeh2md1l]{padding:8px}.modal-header[b-avmeh2md1l],.modal-body[b-avmeh2md1l],.modal-actions[b-avmeh2md1l]{padding-left:18px;padding-right:18px} }
/* /Components/Pages/05Correspondence/03Reports/ExecutiveReport.razor.rz.scp.css */

.executive-report-page[b-rouq1pzi2g] {
    --exec-primary: var(--theme-primary);
    --exec-primary-dark: var(--theme-dark);
    --exec-primary-soft: color-mix(in srgb, var(--theme-light) 13%, white);
    --exec-gold: var(--theme-accent);
    --exec-ink: var(--theme-ink);
    --exec-muted: var(--theme-muted);
    --exec-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--exec-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(27, 144, 105, .08), transparent 29%),
        linear-gradient(180deg, var(--theme-bg) 0%, var(--theme-bg) 100%);
    font-family: "Kanit", sans-serif;
}

.executive-report-page[b-rouq1pzi2g],
.executive-report-page *[b-rouq1pzi2g] {
    box-sizing: border-box;
}

.executive-report-page[b-rouq1pzi2g]  .executive-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 30px;
    color: #fff;
    background:
        linear-gradient(128deg, rgba(4, 49, 38, .98), rgba(10, 106, 78, .96)),
        linear-gradient(135deg, var(--theme-dark), var(--theme-primary));
    box-shadow: 0 24px 54px rgba(6, 66, 51, .24);
}

.hero-orb[b-rouq1pzi2g] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.hero-orb-one[b-rouq1pzi2g] {
    width: 340px;
    height: 340px;
    top: -190px;
    right: 18%;
    background: rgba(255, 208, 85, .14);
}

.hero-orb-two[b-rouq1pzi2g] {
    width: 250px;
    height: 250px;
    right: -80px;
    bottom: -130px;
    background: rgba(255,255,255,.10);
}

.hero-layout[b-rouq1pzi2g] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 600;
}

.executive-report-page[b-rouq1pzi2g]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.4rem, 4vw, 4.1rem);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.02em;
}

.executive-report-page[b-rouq1pzi2g]  .hero-subtitle {
    max-width: 820px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.23rem;
    line-height: 1.8;
}

.hero-features[b-rouq1pzi2g] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 23px;
}

.hero-features span[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    color: rgba(255,255,255,.90);
    background: rgba(255,255,255,.10);
    font-size: .98rem;
    font-weight: 600;
}

.executive-report-page[b-rouq1pzi2g]  .hero-status-card {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.26);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-status-top[b-rouq1pzi2g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-status-icon[b-rouq1pzi2g] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    color: #563c00;
    background: linear-gradient(135deg, #ffe4a0, var(--theme-accent));
}

.hero-status-icon[b-rouq1pzi2g]  .mud-icon-root {
    font-size: 2rem;
}

.live-badge[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    color: #effff8;
    background: rgba(255,255,255,.10);
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .05em;
}

.live-badge i[b-rouq1pzi2g] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--theme-light);
    box-shadow: 0 0 0 5px rgba(111, 242, 182, .14);
}

.executive-report-page[b-rouq1pzi2g]  .hero-status-title {
    margin-top: 18px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-status-grid[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-status-grid div[b-rouq1pzi2g] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-status-grid small[b-rouq1pzi2g] {
    color: rgba(255,255,255,.67);
    font-size: .88rem;
}

.hero-status-grid strong[b-rouq1pzi2g] {
    color: #fff;
    font-size: 1.08rem;
}

.executive-report-page[b-rouq1pzi2g]  .hero-status-card .mud-button-root {
    min-height: 49px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
}

.executive-report-page[b-rouq1pzi2g]  .filter-panel,
.executive-report-page[b-rouq1pzi2g]  .dashboard-panel,
.executive-report-page[b-rouq1pzi2g]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--exec-border);
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 30px rgba(21, 73, 57, .08);
}

.filter-heading[b-rouq1pzi2g],
.panel-heading[b-rouq1pzi2g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.compact-heading[b-rouq1pzi2g] {
    margin-bottom: 14px;
}

.executive-report-page[b-rouq1pzi2g]  .panel-title {
    color: var(--exec-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 850;
}

.executive-report-page[b-rouq1pzi2g]  .panel-subtitle {
    margin-top: 4px;
    color: var(--exec-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.filter-actions[b-rouq1pzi2g],
.apply-row[b-rouq1pzi2g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.apply-row[b-rouq1pzi2g] {
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--exec-border);
}

.executive-report-page[b-rouq1pzi2g]  .large-input .mud-input-control {
    min-height: 58px;
}

.executive-report-page[b-rouq1pzi2g]  .large-input .mud-input-label,
.executive-report-page[b-rouq1pzi2g]  .large-input input,
.executive-report-page[b-rouq1pzi2g]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.04rem;
}

.executive-report-page[b-rouq1pzi2g]  .filter-panel .mud-button-root,
.executive-report-page[b-rouq1pzi2g]  .dashboard-panel .mud-button-root {
    min-height: 45px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.executive-report-page[b-rouq1pzi2g]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--exec-muted);
}

.kpi-grid[b-rouq1pzi2g] {
    margin-top: 1px;
}

.executive-report-page[b-rouq1pzi2g]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 176px;
    align-items: flex-start;
    gap: 18px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--exec-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 26px rgba(21, 73, 57, .075);
}

.executive-report-page[b-rouq1pzi2g]  .kpi-card::after {
    position: absolute;
    right: -38px;
    bottom: -48px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    content: "";
    background: var(--kpi-soft);
}

.kpi-green[b-rouq1pzi2g] { --kpi-main:var(--theme-primary); --kpi-soft:#d9f3e9; }
.kpi-blue[b-rouq1pzi2g] { --kpi-main:#286dba; --kpi-soft:#dfeeff; }
.kpi-purple[b-rouq1pzi2g] { --kpi-main:#7552aa; --kpi-soft:#eee6fb; }
.kpi-amber[b-rouq1pzi2g] { --kpi-main:#b67805; --kpi-soft:#fff0ca; }
.kpi-teal[b-rouq1pzi2g] { --kpi-main:#16858b; --kpi-soft:#dcf4f3; }
.kpi-red[b-rouq1pzi2g] { --kpi-main:#c04f54; --kpi-soft:#ffe3e4; }

.kpi-icon[b-rouq1pzi2g] {
    position: relative;
    z-index: 1;
    display: grid;
    flex: 0 0 auto;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: var(--kpi-main);
    background: var(--kpi-soft);
}

.kpi-icon[b-rouq1pzi2g]  .mud-icon-root {
    font-size: 2rem;
}

.kpi-content[b-rouq1pzi2g] {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
}

.executive-report-page[b-rouq1pzi2g]  .kpi-label {
    color: var(--theme-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.kpi-value-row[b-rouq1pzi2g] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
}

.kpi-value-row strong[b-rouq1pzi2g] {
    color: var(--exec-ink);
    font-size: 2.15rem;
    font-weight: 900;
    letter-spacing: -.02em;
}

.kpi-value-row span[b-rouq1pzi2g] {
    color: var(--exec-muted);
    font-size: 1rem;
    font-weight: 600;
}

.kpi-footer[b-rouq1pzi2g] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 13px;
}

.kpi-footer small[b-rouq1pzi2g] {
    color: #72867e;
    font-size: .9rem;
}

.trend[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
    font-weight: 800;
}

.trend-up[b-rouq1pzi2g] { color: var(--theme-primary); }
.trend-down[b-rouq1pzi2g] { color: #c14b50; }
.trend-stable[b-rouq1pzi2g] { color: var(--theme-muted); }

.main-grid[b-rouq1pzi2g],
.bottom-grid[b-rouq1pzi2g] {
    margin-top: 1px;
}

.trend-panel[b-rouq1pzi2g],
.alert-panel[b-rouq1pzi2g] {
    height: 100%;
}

.chart-legend[b-rouq1pzi2g] {
    display: flex;
    gap: 14px;
    color: var(--theme-muted);
    font-size: .92rem;
}

.chart-legend span[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.chart-legend i[b-rouq1pzi2g] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.legend-service[b-rouq1pzi2g] { background: var(--theme-primary); }
.legend-completed[b-rouq1pzi2g] { background: var(--theme-accent); }

.bar-chart[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: repeat(6, minmax(46px, 1fr));
    gap: 14px;
    align-items: end;
    min-height: 290px;
    padding: 24px 10px 4px;
    border-bottom: 1px solid var(--exec-border);
    background:
        repeating-linear-gradient(
            to top,
            transparent 0,
            transparent 53px,
            rgba(17, 91, 68, .07) 54px
        );
}

.bar-column[b-rouq1pzi2g] {
    display: grid;
    gap: 9px;
    align-items: end;
    height: 250px;
    text-align: center;
}

.bar-column > strong[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .92rem;
}

.bar-values[b-rouq1pzi2g] {
    display: flex;
    align-items: end;
    justify-content: center;
    gap: 6px;
    height: 215px;
}

.bar[b-rouq1pzi2g] {
    position: relative;
    width: min(35%, 31px);
    min-height: 16px;
    border-radius: 9px 9px 4px 4px;
    transition: .25s ease;
}

.bar:hover[b-rouq1pzi2g] {
    transform: translateY(-3px);
    filter: brightness(1.05);
}

.bar span[b-rouq1pzi2g] {
    position: absolute;
    top: -24px;
    left: 50%;
    color: #547067;
    font-size: .75rem;
    font-weight: 800;
    transform: translateX(-50%);
}

.bar-service[b-rouq1pzi2g] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--theme-primary) 74%, var(--theme-light)), var(--theme-primary));
}

.bar-completed[b-rouq1pzi2g] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--theme-accent) 82%, white), #b68412);
}

.mini-metric-grid[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 19px;
}

.mini-metric[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.mini-metric span[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .95rem;
}

.mini-metric strong[b-rouq1pzi2g] {
    color: var(--exec-ink);
    font-size: 1.05rem;
}

.mini-metric[b-rouq1pzi2g]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.alert-total[b-rouq1pzi2g],
.record-count[b-rouq1pzi2g] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.alert-list[b-rouq1pzi2g] {
    display: grid;
    gap: 11px;
}

.alert-item[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 44px 1fr 22px;
    gap: 12px;
    width: 100%;
    align-items: flex-start;
    padding: 14px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    font-family: "Kanit", sans-serif;
    transition: .2s ease;
}

.alert-item:hover[b-rouq1pzi2g] {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(20, 71, 55, .10);
}

.alert-icon[b-rouq1pzi2g] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
}

.alert-critical .alert-icon[b-rouq1pzi2g] {
    color: #b9343a;
    background: #ffe6e7;
}

.alert-warning .alert-icon[b-rouq1pzi2g] {
    color: #a56c03;
    background: #fff1cd;
}

.alert-information .alert-icon[b-rouq1pzi2g] {
    color: #2d6fab;
    background: #e6f1ff;
}

.alert-copy[b-rouq1pzi2g] {
    display: grid;
    gap: 4px;
}

.alert-copy strong[b-rouq1pzi2g] {
    color: var(--theme-ink);
    font-size: 1rem;
    line-height: 1.45;
}

.alert-copy small[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .82rem;
}

.alert-copy em[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .9rem;
    font-style: normal;
    line-height: 1.55;
}

.department-panel[b-rouq1pzi2g] {
    overflow: hidden;
}

.department-table-wrap[b-rouq1pzi2g] {
    overflow-x: auto;
    border: 1px solid var(--exec-border);
    border-radius: 18px;
}

.department-table[b-rouq1pzi2g] {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    background: #fff;
}

.department-table th[b-rouq1pzi2g],
.department-table td[b-rouq1pzi2g] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.department-table th[b-rouq1pzi2g] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .92rem;
    font-weight: 800;
}

.department-table td[b-rouq1pzi2g] {
    color: #35554a;
    font-size: .95rem;
}

.department-table tbody tr:hover[b-rouq1pzi2g] {
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.department-name-cell[b-rouq1pzi2g] {
    display: flex;
    min-width: 290px;
    align-items: center;
    gap: 11px;
}

.department-name-cell img[b-rouq1pzi2g],
.department-avatar[b-rouq1pzi2g] {
    display: grid;
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
}

.department-name-cell img[b-rouq1pzi2g] {
    object-fit: cover;
}

.department-avatar[b-rouq1pzi2g] {
    color: #fff;
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-light));
    font-weight: 800;
}

.department-name-cell div[b-rouq1pzi2g] {
    display: grid;
    gap: 3px;
}

.department-name-cell strong[b-rouq1pzi2g] {
    color: var(--theme-ink);
    font-size: 1rem;
}

.department-name-cell span[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.table-progress[b-rouq1pzi2g] {
    display: grid;
    min-width: 130px;
    gap: 6px;
}

.count-pill[b-rouq1pzi2g],
.status-pill[b-rouq1pzi2g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.count-amber[b-rouq1pzi2g] { color: #926100; background: #fff0c8; }
.count-red[b-rouq1pzi2g] { color: #ae3f44; background: #ffe3e4; }
.status-excellent[b-rouq1pzi2g] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.status-good[b-rouq1pzi2g] { color: #286b9d; background: #e2f1fc; }
.status-watch[b-rouq1pzi2g] { color: #996405; background: #fff0ca; }
.status-critical[b-rouq1pzi2g] { color: #b23f45; background: #ffe2e4; }

.highlight-card[b-rouq1pzi2g] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--exec-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21, 73, 57, .07);
}

.highlight-image[b-rouq1pzi2g] {
    position: relative;
    display: grid;
    height: 165px;
    place-items: center;
    overflow: hidden;
    color: var(--theme-primary);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-light) 15%, white), #eff9f5);
}

.highlight-image img[b-rouq1pzi2g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.highlight-image[b-rouq1pzi2g] >  .mud-icon-root {
    font-size: 3.4rem;
}

.highlight-image span[b-rouq1pzi2g] {
    position: absolute;
    left: 13px;
    bottom: 13px;
    padding: 6px 10px;
    border-radius: 999px;
    color: #fff;
    background: rgba(4, 61, 45, .82);
    font-size: .78rem;
    font-weight: 800;
    backdrop-filter: blur(8px);
}

.highlight-body[b-rouq1pzi2g] {
    padding: 17px;
}

.highlight-body > strong[b-rouq1pzi2g] {
    display: block;
    min-height: 49px;
    color: var(--theme-ink);
    font-size: 1.06rem;
    line-height: 1.48;
}

.highlight-body p[b-rouq1pzi2g] {
    min-height: 70px;
    margin: 8px 0 13px;
    color: var(--theme-muted);
    font-size: .91rem;
    line-height: 1.6;
}

.highlight-body > div[b-rouq1pzi2g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.highlight-body span[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .82rem;
}

.highlight-body em[b-rouq1pzi2g] {
    color: var(--theme-primary);
    font-size: .9rem;
    font-style: normal;
    font-weight: 800;
}

.activity-list[b-rouq1pzi2g] {
    display: grid;
}

.activity-item[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 43px 1fr;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--theme-border);
}

.activity-item:last-child[b-rouq1pzi2g] {
    border-bottom: 0;
}

.activity-icon[b-rouq1pzi2g] {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 14px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
}

.activity-item strong[b-rouq1pzi2g] {
    color: var(--theme-ink);
    font-size: 1rem;
}

.activity-item p[b-rouq1pzi2g] {
    margin: 4px 0;
    color: var(--theme-muted);
    font-size: .9rem;
    line-height: 1.5;
}

.activity-item small[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .81rem;
}

.modal-backdrop[b-rouq1pzi2g] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4, 34, 26, .68);
    backdrop-filter: blur(6px);
}

.executive-report-page[b-rouq1pzi2g]  .modal-panel {
    width: min(920px, 100%);
    max-height: 93vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.modal-header[b-rouq1pzi2g] {
    position: sticky;
    z-index: 4;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--exec-border);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(13px);
}

.executive-report-page[b-rouq1pzi2g]  .modal-title {
    color: var(--exec-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 850;
}

.executive-report-page[b-rouq1pzi2g]  .modal-subtitle {
    color: var(--exec-muted);
    font-size: 1rem;
}

.department-detail-hero[b-rouq1pzi2g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 22px 25px;
    color: #fff;
    background: linear-gradient(135deg, var(--theme-dark), var(--theme-primary));
}

.department-detail-profile[b-rouq1pzi2g] {
    display: flex;
    align-items: center;
    gap: 13px;
}

.department-detail-profile img[b-rouq1pzi2g],
.department-detail-profile > span[b-rouq1pzi2g] {
    display: grid;
    width: 62px;
    height: 62px;
    flex: 0 0 auto;
    place-items: center;
    border: 3px solid rgba(255,255,255,.24);
    border-radius: 19px;
    color: #fff;
    background: rgba(255,255,255,.14);
    object-fit: cover;
    font-size: 1.12rem;
    font-weight: 850;
}

.department-detail-profile div[b-rouq1pzi2g] {
    display: grid;
    gap: 4px;
}

.department-detail-profile strong[b-rouq1pzi2g] {
    font-size: 1.15rem;
}

.department-detail-profile small[b-rouq1pzi2g] {
    color: rgba(255,255,255,.74);
}

.modal-body[b-rouq1pzi2g] {
    padding: 24px 25px;
}

.detail-stat-grid[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.detail-stat-grid > div[b-rouq1pzi2g] {
    display: grid;
    gap: 5px;
    padding: 15px;
    border: 1px solid var(--exec-border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-stat-grid span[b-rouq1pzi2g] {
    color: var(--theme-muted);
    font-size: .9rem;
}

.detail-stat-grid strong[b-rouq1pzi2g] {
    color: var(--theme-ink);
    font-size: 1.09rem;
}

.detail-section[b-rouq1pzi2g] {
    margin-top: 18px;
    padding: 17px;
    border: 1px solid var(--exec-border);
    border-radius: 17px;
}

.detail-section h3[b-rouq1pzi2g] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--theme-ink);
    font-size: 1.08rem;
}

.detail-section p[b-rouq1pzi2g] {
    margin: 0;
    color: var(--theme-muted);
    font-size: .98rem;
    line-height: 1.7;
}

.detail-success[b-rouq1pzi2g] {
    border-color: #cce9dc;
    background: #f2fbf7;
}

.detail-risk[b-rouq1pzi2g] {
    border-color: #f2ddbc;
    background: #fff9ed;
}

.detail-progress-grid[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 13px;
    margin-top: 18px;
}

.detail-progress-grid > div[b-rouq1pzi2g] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 15px;
    border: 1px solid var(--exec-border);
    border-radius: 16px;
}

.detail-progress-grid span[b-rouq1pzi2g] {
    color: #6a7f77;
    font-size: .9rem;
}

.detail-progress-grid strong[b-rouq1pzi2g] {
    color: var(--theme-ink);
}

.detail-progress-grid[b-rouq1pzi2g]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.modal-actions[b-rouq1pzi2g] {
    position: sticky;
    bottom: 0;
    z-index: 4;
    display: flex;
    justify-content: flex-end;
    padding: 17px 25px;
    border-top: 1px solid var(--exec-border);
    background: #fff;
}

@media (max-width: 1180px) {
    .hero-layout[b-rouq1pzi2g] {
        grid-template-columns: 1fr;
    }

    .executive-report-page[b-rouq1pzi2g]  .hero-status-card {
        max-width: 560px;
    }
}

@media (max-width: 900px) {
    .filter-heading[b-rouq1pzi2g],
    .panel-heading[b-rouq1pzi2g] {
        flex-direction: column;
    }

    .filter-actions[b-rouq1pzi2g] {
        width: 100%;
    }

    .detail-stat-grid[b-rouq1pzi2g],
    .detail-progress-grid[b-rouq1pzi2g] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .executive-report-page[b-rouq1pzi2g] {
        padding: 12px;
    }

    .executive-report-page[b-rouq1pzi2g]  .executive-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .executive-report-page[b-rouq1pzi2g]  .hero-title {
        font-size: 2.35rem;
    }

    .executive-report-page[b-rouq1pzi2g]  .hero-subtitle {
        font-size: 1.08rem;
    }

    .hero-features[b-rouq1pzi2g] {
        display: grid;
    }

    .filter-actions[b-rouq1pzi2g],
    .apply-row[b-rouq1pzi2g] {
        align-items: stretch;
        flex-direction: column;
    }

    .filter-actions[b-rouq1pzi2g]  .mud-button-root,
    .apply-row[b-rouq1pzi2g]  .mud-button-root {
        width: 100%;
    }

    .bar-chart[b-rouq1pzi2g] {
        gap: 6px;
        padding-left: 0;
        padding-right: 0;
    }

    .bar[b-rouq1pzi2g] {
        width: min(42%, 24px);
    }

    .bar span[b-rouq1pzi2g] {
        display: none;
    }

    .mini-metric-grid[b-rouq1pzi2g] {
        grid-template-columns: 1fr;
    }

    .detail-stat-grid[b-rouq1pzi2g],
    .detail-progress-grid[b-rouq1pzi2g] {
        grid-template-columns: 1fr;
    }

    .department-detail-hero[b-rouq1pzi2g] {
        align-items: flex-start;
        flex-direction: column;
    }

    .modal-backdrop[b-rouq1pzi2g] {
        padding: 8px;
    }

    .modal-header[b-rouq1pzi2g],
    .modal-body[b-rouq1pzi2g],
    .modal-actions[b-rouq1pzi2g] {
        padding-left: 18px;
        padding-right: 18px;
    }
}
/* /Components/Pages/05Correspondence/03Reports/ExportReports.razor.rz.scp.css */
.export-report-page[b-wht6k4ndef] {
    --ex-primary: #0a6d51;
    --ex-dark: var(--theme-dark);
    --ex-ink: var(--theme-ink);
    --ex-muted: var(--theme-muted);
    --ex-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--ex-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(29,145,106,.09), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #edf5f1 100%);
    font-family: "Kanit", sans-serif;
}

.export-report-page[b-wht6k4ndef],
.export-report-page *[b-wht6k4ndef] {
    box-sizing: border-box;
}

.export-report-page[b-wht6k4ndef]  .export-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 84% 12%, rgba(255,213,97,.18), transparent 29%),
        linear-gradient(128deg, var(--theme-dark) 0%, var(--theme-primary) 58%, #0b7a5b 100%);
    box-shadow: 0 24px 56px rgba(5,63,48,.25);
}

.export-report-page[b-wht6k4ndef]  .export-hero::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: .1;
    background-image:
        linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(90deg, transparent 0%, #000 60%);
}

.hero-layout[b-wht6k4ndef] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0,1fr) 355px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-wht6k4ndef] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 650;
}

.export-report-page[b-wht6k4ndef]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.35rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.14;
}

.export-report-page[b-wht6k4ndef]  .hero-subtitle {
    max-width: 900px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.19rem;
    line-height: 1.78;
}

.hero-tags[b-wht6k4ndef] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.hero-tags span[b-wht6k4ndef] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.10);
    font-size: .98rem;
    font-weight: 600;
}

.export-report-page[b-wht6k4ndef]  .hero-summary {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-summary-top[b-wht6k4ndef] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-summary-icon[b-wht6k4ndef] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: #5b4100;
    background: linear-gradient(135deg, #ffe5a0, #d5a42d);
}

.hero-summary-icon[b-wht6k4ndef]  .mud-icon-root {
    font-size: 2rem;
}

.mock-badge[b-wht6k4ndef] {
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    font-size: .82rem;
    font-weight: 800;
}

.export-report-page[b-wht6k4ndef]  .hero-summary-title {
    margin-top: 17px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-summary-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-summary-grid div[b-wht6k4ndef] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-summary-grid small[b-wht6k4ndef] {
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.hero-summary-grid strong[b-wht6k4ndef] {
    color: #fff;
    font-size: 1.07rem;
}

.export-report-page[b-wht6k4ndef]  .hero-summary .mud-button-root {
    min-height: 49px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
}

.export-report-page[b-wht6k4ndef]  .filter-panel,
.export-report-page[b-wht6k4ndef]  .dashboard-panel,
.export-report-page[b-wht6k4ndef]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--ex-border);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 31px rgba(20,74,57,.08);
}

.panel-heading[b-wht6k4ndef] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.compact-heading[b-wht6k4ndef] {
    margin-bottom: 14px;
}

.export-report-page[b-wht6k4ndef]  .panel-title {
    color: var(--ex-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 850;
}

.export-report-page[b-wht6k4ndef]  .panel-subtitle {
    margin-top: 4px;
    color: var(--ex-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.heading-actions[b-wht6k4ndef],
.view-actions[b-wht6k4ndef],
.job-actions[b-wht6k4ndef],
.modal-actions[b-wht6k4ndef] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.export-report-page[b-wht6k4ndef]  .large-input .mud-input-control {
    min-height: 58px;
}

.export-report-page[b-wht6k4ndef]  .large-input .mud-input-label,
.export-report-page[b-wht6k4ndef]  .large-input input,
.export-report-page[b-wht6k4ndef]  .large-input textarea,
.export-report-page[b-wht6k4ndef]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.export-report-page[b-wht6k4ndef]  .filter-panel .mud-button-root,
.export-report-page[b-wht6k4ndef]  .dashboard-panel .mud-button-root,
.export-report-page[b-wht6k4ndef]  .modal-panel .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.export-report-page[b-wht6k4ndef]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--ex-muted);
}

.kpi-grid[b-wht6k4ndef],
.dashboard-grid[b-wht6k4ndef] {
    margin-top: 1px;
}

.export-report-page[b-wht6k4ndef]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 176px;
    gap: 18px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--ex-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 27px rgba(21,72,56,.075);
}

.export-report-page[b-wht6k4ndef]  .kpi-card::after {
    position: absolute;
    right: -38px;
    bottom: -48px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    content: "";
    background: var(--kpi-soft);
}

.kpi-green[b-wht6k4ndef] { --kpi-main:var(--theme-primary); --kpi-soft:color-mix(in srgb, var(--theme-light) 15%, white); }
.kpi-blue[b-wht6k4ndef] { --kpi-main:#286fb6; --kpi-soft:#dfedff; }
.kpi-purple[b-wht6k4ndef] { --kpi-main:#7653aa; --kpi-soft:#eee6fb; }
.kpi-amber[b-wht6k4ndef] { --kpi-main:#b77805; --kpi-soft:#fff0c9; }
.kpi-teal[b-wht6k4ndef] { --kpi-main:#16858b; --kpi-soft:#dcf4f3; }
.kpi-red[b-wht6k4ndef] { --kpi-main:#c14e54; --kpi-soft:#ffe3e5; }

.kpi-icon[b-wht6k4ndef] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 18px;
    color: var(--kpi-main);
    background: var(--kpi-soft);
}

.kpi-icon[b-wht6k4ndef]  .mud-icon-root {
    font-size: 2rem;
}

.kpi-copy[b-wht6k4ndef] {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
}

.export-report-page[b-wht6k4ndef]  .kpi-title {
    color: #62776f;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.kpi-value[b-wht6k4ndef] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
}

.kpi-value strong[b-wht6k4ndef] {
    color: var(--ex-ink);
    font-size: 2.15rem;
    font-weight: 900;
}

.kpi-value span[b-wht6k4ndef] {
    color: var(--ex-muted);
    font-size: 1rem;
    font-weight: 600;
}

.kpi-note[b-wht6k4ndef] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
}

.kpi-note small[b-wht6k4ndef] {
    color: #72867e;
    font-size: .9rem;
}

.change[b-wht6k4ndef] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
    font-weight: 800;
}

.change-good[b-wht6k4ndef] { color: var(--theme-primary); }
.change-bad[b-wht6k4ndef] { color: #c14b50; }

.record-count[b-wht6k4ndef] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.template-card[b-wht6k4ndef] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--ex-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21,73,57,.07);
    transition: transform .2s ease, box-shadow .2s ease;
}

.template-card:hover[b-wht6k4ndef] {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(21,73,57,.12);
}

.template-image[b-wht6k4ndef] {
    position: relative;
    display: grid;
    height: 155px;
    place-items: center;
    overflow: hidden;
    color: var(--theme-primary);
    background: linear-gradient(135deg,color-mix(in srgb, var(--theme-light) 15%, white),#eff9f5);
}

.template-image img[b-wht6k4ndef] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-image[b-wht6k4ndef] >  .mud-icon-root {
    font-size: 3.4rem;
}

.category-pill[b-wht6k4ndef],
.popular-pill[b-wht6k4ndef],
.format-badge[b-wht6k4ndef],
.job-status[b-wht6k4ndef] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 29px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    white-space: nowrap;
}

.template-image > .category-pill[b-wht6k4ndef] {
    position: absolute;
    left: 12px;
    bottom: 12px;
}

.popular-pill[b-wht6k4ndef] {
    position: absolute;
    top: 12px;
    right: 12px;
    color: #805600;
    background: #ffedb8;
    box-shadow: 0 5px 14px rgba(48,39,7,.12);
}

.category-executive[b-wht6k4ndef] { color: #684492; background: #eee4fa; }
.category-service[b-wht6k4ndef] { color: #276b9d; background: #e3f1fb; }
.category-revenue[b-wht6k4ndef] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.category-sla[b-wht6k4ndef] { color: #b23f45; background: #ffe2e4; }
.category-personnel[b-wht6k4ndef] { color: #996405; background: #fff0ca; }
.category-correspondence[b-wht6k4ndef] { color: #3d6972; background: #e4f0f2; }

.template-body[b-wht6k4ndef] {
    padding: 18px;
}

.template-body > small[b-wht6k4ndef] {
    color: #72867e;
    font-size: .84rem;
}

.template-body h3[b-wht6k4ndef] {
    margin: 6px 0 7px;
    color: var(--theme-ink);
    font-size: 1.18rem;
    line-height: 1.45;
}

.template-body p[b-wht6k4ndef] {
    min-height: 52px;
    margin: 0;
    color: #687c74;
    font-size: .9rem;
    line-height: 1.55;
}

.format-badges[b-wht6k4ndef] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 13px;
}

.format-pdf[b-wht6k4ndef] { color: #b23f45; background: #ffe3e5; }
.format-excel[b-wht6k4ndef] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.format-csv[b-wht6k4ndef] { color: #286b9d; background: #e2f1fc; }
.format-json[b-wht6k4ndef] { color: #694799; background: #eee6fa; }

.template-meta[b-wht6k4ndef] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.template-meta span[b-wht6k4ndef] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--theme-muted);
    font-size: .83rem;
}

.format-summary-list[b-wht6k4ndef] {
    display: grid;
    gap: 11px;
}

.format-summary-row[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid #e3ece8;
    border-radius: 17px;
    background: #fff;
}

.format-summary-icon[b-wht6k4ndef] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    color: var(--format-main);
    background: var(--format-soft);
}

.format-summary-green[b-wht6k4ndef] { --format-main:var(--theme-primary); --format-soft:#def4eb; }
.format-summary-red[b-wht6k4ndef] { --format-main:#b84046; --format-soft:#ffe4e6; }
.format-summary-blue[b-wht6k4ndef] { --format-main:#286fb6; --format-soft:#e3efff; }
.format-summary-purple[b-wht6k4ndef] { --format-main:#7653aa; --format-soft:#efe8fb; }

.format-summary-copy[b-wht6k4ndef] {
    display: grid;
    gap: 7px;
}

.format-summary-copy > div[b-wht6k4ndef] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.format-summary-copy strong[b-wht6k4ndef] {
    color: #294c40;
    font-size: 1rem;
}

.format-summary-copy em[b-wht6k4ndef] {
    color: #687d75;
    font-size: .87rem;
    font-style: normal;
}

.format-summary-copy small[b-wht6k4ndef] {
    color: #788b83;
    font-size: .82rem;
}

.storage-note[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    margin-top: 16px;
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    color: #3a6557;
    background: #f2f8f5;
}

.storage-note[b-wht6k4ndef] >  .mud-icon-root {
    font-size: 2rem;
    color: #0b7456;
}

.storage-note div[b-wht6k4ndef] {
    display: grid;
    gap: 4px;
}

.storage-note strong[b-wht6k4ndef] {
    color: #254b3f;
}

.storage-note p[b-wht6k4ndef] {
    margin: 0;
    color: #697d75;
    font-size: .86rem;
    line-height: 1.55;
}

.storage-note code[b-wht6k4ndef] {
    color: #0a6d51;
    font-family: monospace;
    font-weight: 700;
}

.job-table-wrap[b-wht6k4ndef] {
    overflow-x: auto;
    border: 1px solid var(--ex-border);
    border-radius: 18px;
}

.job-table[b-wht6k4ndef] {
    width: 100%;
    min-width: 1360px;
    border-collapse: collapse;
    background: #fff;
}

.job-table th[b-wht6k4ndef],
.job-table td[b-wht6k4ndef] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.job-table th[b-wht6k4ndef] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .92rem;
    font-weight: 800;
}

.job-table td[b-wht6k4ndef] {
    color: #35554a;
    font-size: .95rem;
}

.job-table tbody tr:hover[b-wht6k4ndef] {
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.job-name-cell[b-wht6k4ndef] {
    display: flex;
    min-width: 310px;
    align-items: center;
    gap: 11px;
}

.file-icon[b-wht6k4ndef] {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
}

.file-pdf[b-wht6k4ndef] { color: #b23f45; background: #ffe3e5; }
.file-excel[b-wht6k4ndef] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.file-csv[b-wht6k4ndef] { color: #286b9d; background: #e2f1fc; }
.file-json[b-wht6k4ndef] { color: #694799; background: #eee6fa; }

.job-name-cell div[b-wht6k4ndef] {
    display: grid;
    gap: 3px;
}

.job-name-cell strong[b-wht6k4ndef] {
    color: var(--theme-ink);
}

.job-name-cell small[b-wht6k4ndef],
.cell-subtitle[b-wht6k4ndef] {
    display: block;
    color: var(--theme-muted);
    font-size: .82rem;
    margin-top: 3px;
}

.table-progress[b-wht6k4ndef] {
    display: grid;
    min-width: 130px;
    gap: 6px;
}

.job-completed[b-wht6k4ndef] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.job-processing[b-wht6k4ndef] { color: #286b9d; background: #e2f1fc; }
.job-waiting[b-wht6k4ndef] { color: #996405; background: #fff0ca; }
.job-failed[b-wht6k4ndef] { color: #b23f45; background: #ffe2e4; }
.job-cancelled[b-wht6k4ndef] { color: #697a73; background: #edf2f0; }

.job-actions[b-wht6k4ndef] {
    flex-wrap: nowrap;
}

.job-card[b-wht6k4ndef] {
    height: 100%;
    padding: 18px;
    border: 1px solid var(--ex-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 9px 22px rgba(21,73,57,.07);
}

.job-card-head[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    gap: 11px;
    align-items: center;
}

.job-card-head > div[b-wht6k4ndef] {
    display: grid;
    gap: 3px;
}

.job-card-head strong[b-wht6k4ndef] {
    color: var(--theme-ink);
    font-size: 1rem;
}

.job-card-head small[b-wht6k4ndef] {
    color: var(--theme-muted);
    font-size: .8rem;
}

.job-file-name[b-wht6k4ndef] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding: 11px;
    border-radius: 13px;
    color: #4f6d62;
    background: var(--theme-bg);
    font-size: .88rem;
    word-break: break-all;
}

.job-meta-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 13px;
}

.job-meta-grid > div[b-wht6k4ndef] {
    display: grid;
    gap: 4px;
    padding: 10px;
    border-radius: 13px;
    background: #f8faf9;
}

.job-meta-grid span[b-wht6k4ndef] {
    color: #788b83;
    font-size: .78rem;
}

.job-meta-grid strong[b-wht6k4ndef] {
    color: #294c40;
    font-size: .88rem;
}

.job-progress[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 14px;
}

.job-progress span[b-wht6k4ndef] {
    color: #677b73;
    font-size: .88rem;
}

.job-progress strong[b-wht6k4ndef] {
    color: var(--theme-ink);
}

.job-progress[b-wht6k4ndef]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.job-error[b-wht6k4ndef] {
    display: flex;
    gap: 8px;
    margin-top: 13px;
    padding: 11px;
    border: 1px solid #f1cfd2;
    border-radius: 13px;
    color: #a63d43;
    background: #fff3f4;
    font-size: .84rem;
    line-height: 1.5;
}

.job-card-actions[b-wht6k4ndef] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.activity-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 12px;
}

.activity-item[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    padding: 15px;
    border: 1px solid #e3ece8;
    border-radius: 17px;
    background: #fff;
}

.activity-icon[b-wht6k4ndef] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    color: #0b7456;
    background: #e2f3ec;
}

.activity-item div[b-wht6k4ndef] {
    display: grid;
    gap: 4px;
}

.activity-item strong[b-wht6k4ndef] {
    color: #294c40;
}

.activity-item p[b-wht6k4ndef] {
    margin: 0;
    color: #687c74;
    font-size: .87rem;
    line-height: 1.5;
}

.activity-item small[b-wht6k4ndef] {
    color: #879890;
    font-size: .78rem;
}

.modal-backdrop[b-wht6k4ndef] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4,34,26,.68);
    backdrop-filter: blur(6px);
}

.export-report-page[b-wht6k4ndef]  .modal-panel {
    width: min(980px,100%);
    max-height: 93vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.export-report-page[b-wht6k4ndef]  .job-detail-modal {
    width: min(820px,100%);
}

.modal-header[b-wht6k4ndef] {
    position: sticky;
    z-index: 4;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--ex-border);
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(13px);
}

.export-report-page[b-wht6k4ndef]  .modal-title {
    color: var(--ex-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 850;
}

.export-report-page[b-wht6k4ndef]  .modal-subtitle {
    color: var(--ex-muted);
    font-size: 1rem;
}

.template-preview-head[b-wht6k4ndef],
.job-detail-head[b-wht6k4ndef] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 25px;
    color: #fff;
    background: linear-gradient(135deg,var(--theme-dark),var(--theme-primary));
}

.template-preview-head img[b-wht6k4ndef],
.template-preview-head > span:first-child[b-wht6k4ndef],
.job-detail-head > .file-icon[b-wht6k4ndef] {
    display: grid;
    width: 66px;
    height: 66px;
    flex: 0 0 auto;
    place-items: center;
    border: 3px solid rgba(255,255,255,.22);
    border-radius: 18px;
    object-fit: cover;
}

.template-preview-head > div[b-wht6k4ndef],
.job-detail-head > div[b-wht6k4ndef] {
    display: grid;
    flex: 1;
    gap: 4px;
}

.template-preview-head strong[b-wht6k4ndef],
.job-detail-head strong[b-wht6k4ndef] {
    font-size: 1.18rem;
}

.template-preview-head p[b-wht6k4ndef] {
    margin: 0;
    color: rgba(255,255,255,.76);
    font-size: .9rem;
    line-height: 1.5;
}

.template-preview-head .category-pill[b-wht6k4ndef],
.job-detail-head .job-status[b-wht6k4ndef] {
    box-shadow: 0 6px 16px rgba(0,0,0,.12);
}

.job-detail-head small[b-wht6k4ndef] {
    color: rgba(255,255,255,.75);
}

.modal-body[b-wht6k4ndef] {
    padding: 24px 25px;
}

.option-section[b-wht6k4ndef] {
    margin-top: 19px;
    padding: 17px;
    border: 1px solid var(--ex-border);
    border-radius: 18px;
    background: #f9fbfa;
}

.option-section h3[b-wht6k4ndef] {
    margin: 0;
    color: #244b3e;
    font-size: 1.08rem;
}

.option-heading[b-wht6k4ndef] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.option-heading p[b-wht6k4ndef] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    font-size: .88rem;
}

.column-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 14px;
}

.column-option[b-wht6k4ndef] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #dfe9e5;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
}

.column-selected[b-wht6k4ndef] {
    border-color: #91c9b5;
    background: #f0faf6;
}

.column-option > span[b-wht6k4ndef] {
    display: grid;
    gap: 2px;
}

.column-option strong[b-wht6k4ndef] {
    color: #294c40;
    font-size: .93rem;
}

.column-option small[b-wht6k4ndef] {
    color: #7d8f87;
    font-size: .77rem;
}

.switch-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
}

.switch-grid[b-wht6k4ndef]  .mud-switch {
    padding: 11px;
    border: 1px solid #e0e9e5;
    border-radius: 14px;
    background: #fff;
}

.note-input[b-wht6k4ndef] {
    margin-top: 18px;
}

.modal-actions[b-wht6k4ndef] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    justify-content: flex-end;
    padding: 17px 25px;
    border-top: 1px solid var(--ex-border);
    background: #fff;
}

.detail-grid[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 11px;
}

.detail-grid > div[b-wht6k4ndef] {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid var(--ex-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-grid span[b-wht6k4ndef] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.detail-grid strong[b-wht6k4ndef] {
    color: var(--theme-ink);
    font-size: .96rem;
}

.detail-progress[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 17px;
    padding: 15px;
    border: 1px solid var(--ex-border);
    border-radius: 16px;
}

.detail-progress[b-wht6k4ndef]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.file-location[b-wht6k4ndef],
.detail-error[b-wht6k4ndef] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 11px;
    margin-top: 16px;
    padding: 15px;
    border-radius: 16px;
}

.file-location[b-wht6k4ndef] {
    border: 1px solid #d9e8e2;
    color: #0b7456;
    background: #f2f9f6;
}

.detail-error[b-wht6k4ndef] {
    border: 1px solid #f0cdd0;
    color: #b13e44;
    background: #fff3f4;
}

.file-location[b-wht6k4ndef] >  .mud-icon-root,
.detail-error[b-wht6k4ndef] >  .mud-icon-root {
    font-size: 1.9rem;
}

.file-location div[b-wht6k4ndef],
.detail-error div[b-wht6k4ndef] {
    display: grid;
    gap: 4px;
}

.file-location strong[b-wht6k4ndef],
.detail-error strong[b-wht6k4ndef] {
    color: #294c40;
}

.file-location code[b-wht6k4ndef] {
    color: #0a6d51;
    word-break: break-all;
}

.detail-error p[b-wht6k4ndef] {
    margin: 0;
    color: #8f4a4e;
}

@media (max-width: 1280px) {
    .activity-grid[b-wht6k4ndef] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 1180px) {
    .hero-layout[b-wht6k4ndef] {
        grid-template-columns: 1fr;
    }

    .export-report-page[b-wht6k4ndef]  .hero-summary {
        max-width: 560px;
    }
}

@media (max-width: 900px) {
    .panel-heading[b-wht6k4ndef] {
        flex-direction: column;
    }

    .heading-actions[b-wht6k4ndef] {
        width: 100%;
    }

    .detail-grid[b-wht6k4ndef] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .switch-grid[b-wht6k4ndef] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .export-report-page[b-wht6k4ndef] {
        padding: 12px;
    }

    .export-report-page[b-wht6k4ndef]  .export-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .export-report-page[b-wht6k4ndef]  .hero-title {
        font-size: 2.35rem;
    }

    .hero-tags[b-wht6k4ndef] {
        display: grid;
    }

    .activity-grid[b-wht6k4ndef],
    .column-grid[b-wht6k4ndef],
    .detail-grid[b-wht6k4ndef] {
        grid-template-columns: 1fr;
    }

    .job-card-head[b-wht6k4ndef] {
        grid-template-columns: 48px 1fr;
    }

    .job-card-head > .job-status[b-wht6k4ndef] {
        grid-column: 2;
        justify-self: start;
    }

    .job-meta-grid[b-wht6k4ndef] {
        grid-template-columns: 1fr;
    }

    .template-preview-head[b-wht6k4ndef],
    .job-detail-head[b-wht6k4ndef] {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .modal-backdrop[b-wht6k4ndef] {
        padding: 8px;
    }

    .modal-header[b-wht6k4ndef],
    .modal-body[b-wht6k4ndef],
    .modal-actions[b-wht6k4ndef] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .modal-actions[b-wht6k4ndef] {
        align-items: stretch;
        flex-direction: column;
    }

    .modal-actions[b-wht6k4ndef]  .mud-button-root {
        width: 100%;
    }
}
/* /Components/Pages/05Correspondence/03Reports/RevenueReports.razor.rz.scp.css */
.revenue-report-page[b-t8qolkg4rg] {
    --rr-primary: var(--theme-primary);
    --rr-dark: var(--theme-dark);
    --rr-ink: var(--theme-ink);
    --rr-muted: var(--theme-muted);
    --rr-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--rr-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(29,145,106,.09), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, var(--theme-bg) 100%);
    font-family: "Kanit", sans-serif;
}

.revenue-report-page[b-t8qolkg4rg],
.revenue-report-page *[b-t8qolkg4rg] {
    box-sizing: border-box;
}

.revenue-report-page[b-t8qolkg4rg]  .revenue-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 10%, rgba(255,215,105,.19), transparent 28%),
        linear-gradient(128deg, var(--theme-dark) 0%, var(--theme-primary) 58%, color-mix(in srgb, var(--theme-primary) 84%, var(--theme-light)) 100%);
    box-shadow: 0 24px 56px rgba(5,63,48,.25);
}

.hero-layout[b-t8qolkg4rg] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0,1fr) 355px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 650;
}

.revenue-report-page[b-t8qolkg4rg]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.35rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.14;
}

.revenue-report-page[b-t8qolkg4rg]  .hero-subtitle {
    max-width: 850px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.19rem;
    line-height: 1.78;
}

.hero-tags[b-t8qolkg4rg] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.hero-tags span[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.1);
    font-size: .98rem;
    font-weight: 600;
}

.revenue-report-page[b-t8qolkg4rg]  .hero-summary {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-summary-top[b-t8qolkg4rg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-summary-icon[b-t8qolkg4rg] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: #5b4100;
    background: linear-gradient(135deg, #ffe5a0, #d5a42d);
}

.hero-summary-icon[b-t8qolkg4rg]  .mud-icon-root {
    font-size: 2rem;
}

.mock-badge[b-t8qolkg4rg] {
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.1);
    font-size: .82rem;
    font-weight: 800;
}

.revenue-report-page[b-t8qolkg4rg]  .hero-summary-title {
    margin-top: 17px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-summary-grid[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-summary-grid div[b-t8qolkg4rg] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-summary-grid small[b-t8qolkg4rg] {
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.hero-summary-grid strong[b-t8qolkg4rg] {
    color: #fff;
    font-size: 1.07rem;
}

.revenue-report-page[b-t8qolkg4rg]  .hero-summary .mud-button-root {
    min-height: 49px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
}

.revenue-report-page[b-t8qolkg4rg]  .filter-panel,
.revenue-report-page[b-t8qolkg4rg]  .dashboard-panel,
.revenue-report-page[b-t8qolkg4rg]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--rr-border);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 31px rgba(20,74,57,.08);
}

.panel-heading[b-t8qolkg4rg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.compact-heading[b-t8qolkg4rg] {
    margin-bottom: 14px;
}

.revenue-report-page[b-t8qolkg4rg]  .panel-title {
    color: var(--rr-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 850;
}

.revenue-report-page[b-t8qolkg4rg]  .panel-subtitle {
    margin-top: 4px;
    color: var(--rr-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.heading-actions[b-t8qolkg4rg],
.apply-row[b-t8qolkg4rg],
.view-actions[b-t8qolkg4rg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.apply-row[b-t8qolkg4rg] {
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--rr-border);
}

.revenue-report-page[b-t8qolkg4rg]  .large-input .mud-input-control {
    min-height: 58px;
}

.revenue-report-page[b-t8qolkg4rg]  .large-input .mud-input-label,
.revenue-report-page[b-t8qolkg4rg]  .large-input input,
.revenue-report-page[b-t8qolkg4rg]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.revenue-report-page[b-t8qolkg4rg]  .filter-panel .mud-button-root,
.revenue-report-page[b-t8qolkg4rg]  .dashboard-panel .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.revenue-report-page[b-t8qolkg4rg]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--rr-muted);
}

.kpi-grid[b-t8qolkg4rg],
.dashboard-grid[b-t8qolkg4rg],
.bottom-grid[b-t8qolkg4rg] {
    margin-top: 1px;
}

.revenue-report-page[b-t8qolkg4rg]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 176px;
    gap: 18px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--rr-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 27px rgba(21,72,56,.075);
}

.revenue-report-page[b-t8qolkg4rg]  .kpi-card::after {
    position: absolute;
    right: -38px;
    bottom: -48px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    content: "";
    background: var(--kpi-soft);
}

.kpi-green[b-t8qolkg4rg] { --kpi-main:var(--theme-primary); --kpi-soft:color-mix(in srgb, var(--theme-light) 15%, white); }
.kpi-blue[b-t8qolkg4rg] { --kpi-main:#286fb6; --kpi-soft:#dfedff; }
.kpi-purple[b-t8qolkg4rg] { --kpi-main:#7653aa; --kpi-soft:#eee6fb; }
.kpi-amber[b-t8qolkg4rg] { --kpi-main:#b77805; --kpi-soft:#fff0c9; }
.kpi-teal[b-t8qolkg4rg] { --kpi-main:#16858b; --kpi-soft:#dcf4f3; }
.kpi-red[b-t8qolkg4rg] { --kpi-main:#c14e54; --kpi-soft:#ffe3e5; }

.kpi-icon[b-t8qolkg4rg] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 18px;
    color: var(--kpi-main);
    background: var(--kpi-soft);
}

.kpi-icon[b-t8qolkg4rg]  .mud-icon-root {
    font-size: 2rem;
}

.kpi-copy[b-t8qolkg4rg] {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
}

.revenue-report-page[b-t8qolkg4rg]  .kpi-title {
    color: #62776f;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.kpi-value[b-t8qolkg4rg] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
}

.kpi-value strong[b-t8qolkg4rg] {
    color: var(--rr-ink);
    font-size: 2.15rem;
    font-weight: 900;
}

.kpi-value span[b-t8qolkg4rg] {
    color: var(--rr-muted);
    font-size: 1rem;
    font-weight: 600;
}

.kpi-note[b-t8qolkg4rg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
}

.kpi-note small[b-t8qolkg4rg] {
    color: #72867e;
    font-size: .9rem;
}

.change[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
    font-weight: 800;
}

.change-good[b-t8qolkg4rg] { color: var(--theme-primary); }
.change-bad[b-t8qolkg4rg] { color: #c14b50; }

.chart-legend[b-t8qolkg4rg] {
    display: flex;
    gap: 14px;
    color: var(--theme-muted);
    font-size: .92rem;
}

.chart-legend span[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.chart-legend i[b-t8qolkg4rg] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.legend-target[b-t8qolkg4rg] { background: #aebdb6; }
.legend-collected[b-t8qolkg4rg] { background: #0b7456; }

.bar-chart[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: repeat(6,minmax(46px,1fr));
    gap: 14px;
    min-height: 290px;
    align-items: end;
    padding: 24px 10px 4px;
    border-bottom: 1px solid var(--rr-border);
    background:
        repeating-linear-gradient(to top, transparent 0, transparent 53px, rgba(17,91,68,.07) 54px);
}

.bar-column[b-t8qolkg4rg] {
    display: grid;
    height: 250px;
    align-items: end;
    gap: 9px;
    text-align: center;
}

.bar-column > strong[b-t8qolkg4rg] {
    color: var(--theme-muted);
    font-size: .92rem;
}

.bar-values[b-t8qolkg4rg] {
    display: flex;
    height: 215px;
    align-items: end;
    justify-content: center;
    gap: 6px;
}

.bar[b-t8qolkg4rg] {
    position: relative;
    width: min(35%,31px);
    min-height: 16px;
    border-radius: 9px 9px 4px 4px;
}

.bar span[b-t8qolkg4rg] {
    position: absolute;
    top: -24px;
    left: 50%;
    color: #547067;
    font-size: .75rem;
    font-weight: 800;
    transform: translateX(-50%);
}

.bar-target[b-t8qolkg4rg] { background: linear-gradient(180deg,#ccd6d1,#93a89e); }
.bar-collected[b-t8qolkg4rg] { background: linear-gradient(180deg,#16956f,var(--theme-primary)); }

.trend-summary[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 19px;
}

.trend-summary > div[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.trend-summary span[b-t8qolkg4rg] {
    color: var(--theme-muted);
    font-size: .95rem;
}

.trend-summary strong[b-t8qolkg4rg] {
    color: var(--rr-ink);
    font-size: 1.05rem;
}

.trend-summary small[b-t8qolkg4rg] {
    grid-column: 1 / -1;
    color: #7b8d85;
}

.trend-summary[b-t8qolkg4rg]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.channel-list[b-t8qolkg4rg],
.area-list[b-t8qolkg4rg],
.transaction-list[b-t8qolkg4rg],
.alert-list[b-t8qolkg4rg] {
    display: grid;
    gap: 11px;
}

.channel-row[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid #e3ece8;
    border-radius: 17px;
    background: #fff;
}

.channel-icon[b-t8qolkg4rg] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    color: var(--channel-main);
    background: var(--channel-soft);
}

.channel-green[b-t8qolkg4rg] { --channel-main:var(--theme-primary); --channel-soft:#def4eb; }
.channel-blue[b-t8qolkg4rg] { --channel-main:#286fb6; --channel-soft:#e3efff; }
.channel-purple[b-t8qolkg4rg] { --channel-main:#7653aa; --channel-soft:#efe8fb; }
.channel-amber[b-t8qolkg4rg] { --channel-main:#b77805; --channel-soft:#fff1cf; }
.channel-teal[b-t8qolkg4rg] { --channel-main:#16858b; --channel-soft:#dff5f4; }

.channel-copy[b-t8qolkg4rg] {
    display: grid;
    gap: 7px;
}

.channel-copy > div[b-t8qolkg4rg] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.channel-copy strong[b-t8qolkg4rg] {
    color: #294c40;
    font-size: 1rem;
}

.channel-copy em[b-t8qolkg4rg] {
    color: #687d75;
    font-size: .87rem;
    font-style: normal;
}

.channel-copy small[b-t8qolkg4rg] {
    color: #788b83;
    font-size: .82rem;
}

.record-count[b-t8qolkg4rg],
.alert-count[b-t8qolkg4rg] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.revenue-table-wrap[b-t8qolkg4rg] {
    overflow-x: auto;
    border: 1px solid var(--rr-border);
    border-radius: 18px;
}

.revenue-table[b-t8qolkg4rg] {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    background: #fff;
}

.revenue-table th[b-t8qolkg4rg],
.revenue-table td[b-t8qolkg4rg] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.revenue-table th[b-t8qolkg4rg] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .92rem;
    font-weight: 800;
}

.revenue-table td[b-t8qolkg4rg] {
    color: #35554a;
    font-size: .95rem;
}

.revenue-name-cell[b-t8qolkg4rg] {
    display: flex;
    min-width: 300px;
    align-items: center;
    gap: 11px;
}

.revenue-name-cell img[b-t8qolkg4rg],
.revenue-name-cell > span[b-t8qolkg4rg] {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
}

.revenue-name-cell img[b-t8qolkg4rg] {
    object-fit: cover;
}

.revenue-name-cell > span[b-t8qolkg4rg] {
    color: #0b7355;
    background: #e1f3ec;
}

.revenue-name-cell div[b-t8qolkg4rg] {
    display: grid;
    gap: 3px;
}

.revenue-name-cell strong[b-t8qolkg4rg] {
    color: var(--theme-ink);
}

.revenue-name-cell small[b-t8qolkg4rg] {
    color: var(--theme-muted);
}

.table-progress[b-t8qolkg4rg] {
    display: grid;
    min-width: 130px;
    gap: 6px;
}

.amount-danger[b-t8qolkg4rg] {
    color: #bd444a !important;
}

.count-pill[b-t8qolkg4rg],
.status-pill[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 35px;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.count-pill[b-t8qolkg4rg] { color: #946200; background: #fff0c8; }
.status-excellent[b-t8qolkg4rg] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.status-good[b-t8qolkg4rg] { color: #286b9d; background: #e2f1fc; }
.status-watch[b-t8qolkg4rg] { color: #996405; background: #fff0ca; }
.status-critical[b-t8qolkg4rg] { color: #b23f45; background: #ffe2e4; }

.revenue-card[b-t8qolkg4rg] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--rr-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21,73,57,.07);
}

.revenue-card-image[b-t8qolkg4rg] {
    position: relative;
    display: grid;
    height: 165px;
    place-items: center;
    overflow: hidden;
    color: var(--theme-primary);
    background: linear-gradient(135deg,color-mix(in srgb, var(--theme-light) 15%, white),#eff9f5);
}

.revenue-card-image img[b-t8qolkg4rg] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.revenue-card-image[b-t8qolkg4rg] >  .mud-icon-root {
    font-size: 3.4rem;
}

.revenue-card-image > .status-pill[b-t8qolkg4rg] {
    position: absolute;
    right: 12px;
    bottom: 12px;
}

.revenue-card-body[b-t8qolkg4rg] {
    padding: 18px;
}

.revenue-card-body > small[b-t8qolkg4rg] {
    color: #72867e;
}

.revenue-card-body h3[b-t8qolkg4rg] {
    min-height: 56px;
    margin: 6px 0 14px;
    color: var(--theme-ink);
    font-size: 1.16rem;
    line-height: 1.48;
}

.revenue-stat-grid[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.revenue-stat-grid > div[b-t8qolkg4rg] {
    display: grid;
    gap: 4px;
    padding: 11px;
    border-radius: 14px;
    background: var(--theme-bg);
}

.revenue-stat-grid span[b-t8qolkg4rg] {
    color: #74877f;
    font-size: .8rem;
}

.revenue-stat-grid strong[b-t8qolkg4rg] {
    color: var(--theme-ink);
    font-size: .96rem;
}

.revenue-progress[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 14px;
}

.revenue-progress[b-t8qolkg4rg]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.revenue-card-footer[b-t8qolkg4rg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.revenue-card-footer > span[b-t8qolkg4rg] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #6b7f77;
    font-size: .84rem;
}

.area-row[b-t8qolkg4rg] {
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: #fff;
}

.area-row-top[b-t8qolkg4rg] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
}

.area-row-top div[b-t8qolkg4rg] {
    display: grid;
    gap: 3px;
}

.area-row-top strong[b-t8qolkg4rg] {
    color: #294c40;
}

.area-row-top small[b-t8qolkg4rg] {
    color: #778a82;
}

.area-row-top > span[b-t8qolkg4rg] {
    color: #0b7456;
    font-size: 1.05rem;
    font-weight: 850;
}

.area-metrics[b-t8qolkg4rg] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.area-metrics span[b-t8qolkg4rg] {
    padding: 5px 8px;
    border-radius: 999px;
    color: #61756d;
    background: #f0f5f3;
    font-size: .78rem;
    font-weight: 650;
}

.area-metrics .area-overdue[b-t8qolkg4rg] {
    color: #aa3f45;
    background: #ffe6e7;
}

.transaction-item[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 11px;
    align-items: center;
    padding: 13px 0;
    border-bottom: 1px solid #e6eeea;
}

.transaction-icon[b-t8qolkg4rg] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    color: #0b7456;
    background: #e2f3ec;
}

.transaction-item > div[b-t8qolkg4rg] {
    display: grid;
    gap: 3px;
}

.transaction-item strong[b-t8qolkg4rg] {
    color: #294c40;
}

.transaction-item small[b-t8qolkg4rg] {
    color: #758980;
    font-size: .8rem;
}

.transaction-item em[b-t8qolkg4rg] {
    color: #899991;
    font-size: .76rem;
    font-style: normal;
}

.transaction-amount[b-t8qolkg4rg] {
    color: var(--theme-primary);
    font-weight: 850;
    white-space: nowrap;
}

.alert-item[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 11px;
    width: 100%;
    padding: 13px;
    border: 1px solid #e4ece8;
    border-radius: 16px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    font-family: "Kanit", sans-serif;
}

.alert-icon[b-t8qolkg4rg] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
}

.alert-critical .alert-icon[b-t8qolkg4rg] {
    color: #b9343a;
    background: #ffe6e7;
}

.alert-warning .alert-icon[b-t8qolkg4rg] {
    color: #a56c03;
    background: #fff1cd;
}

.alert-info .alert-icon[b-t8qolkg4rg] {
    color: #2d6fab;
    background: #e6f1ff;
}

.alert-item > span:last-child[b-t8qolkg4rg] {
    display: grid;
    gap: 4px;
}

.alert-item strong[b-t8qolkg4rg] {
    color: var(--theme-ink);
    line-height: 1.45;
}

.alert-item small[b-t8qolkg4rg] {
    color: #7a8c84;
    font-size: .79rem;
}

.alert-item em[b-t8qolkg4rg] {
    color: #62766e;
    font-size: .84rem;
    font-style: normal;
    line-height: 1.5;
}

.modal-backdrop[b-t8qolkg4rg] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4,34,26,.68);
    backdrop-filter: blur(6px);
}

.revenue-report-page[b-t8qolkg4rg]  .modal-panel {
    width: min(900px,100%);
    max-height: 93vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.modal-header[b-t8qolkg4rg] {
    position: sticky;
    z-index: 4;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--rr-border);
    background: rgba(255,255,255,.96);
}

.revenue-report-page[b-t8qolkg4rg]  .modal-title {
    color: var(--rr-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 850;
}

.revenue-report-page[b-t8qolkg4rg]  .modal-subtitle {
    color: var(--rr-muted);
    font-size: 1rem;
}

.detail-banner[b-t8qolkg4rg] {
    position: relative;
    display: grid;
    height: 215px;
    place-items: center;
    overflow: hidden;
    color: #0b7456;
    background: linear-gradient(135deg,#ddf3ea,#edf8f4);
}

.detail-banner img[b-t8qolkg4rg] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-banner[b-t8qolkg4rg] >  .mud-icon-root {
    font-size: 4rem;
}

.detail-banner > .status-pill[b-t8qolkg4rg] {
    position: absolute;
    right: 18px;
    bottom: 18px;
}

.modal-body[b-t8qolkg4rg] {
    padding: 24px 25px;
}

.detail-stat-grid[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 12px;
}

.detail-stat-grid > div[b-t8qolkg4rg] {
    display: grid;
    gap: 5px;
    padding: 15px;
    border: 1px solid var(--rr-border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-stat-grid span[b-t8qolkg4rg] {
    color: var(--theme-muted);
}

.detail-stat-grid strong[b-t8qolkg4rg] {
    color: var(--theme-ink);
}

.detail-progress[b-t8qolkg4rg] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 17px;
    padding: 15px;
    border: 1px solid var(--rr-border);
    border-radius: 16px;
}

.detail-progress[b-t8qolkg4rg]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.detail-section[b-t8qolkg4rg] {
    margin-top: 18px;
    padding: 17px;
    border: 1px solid var(--rr-border);
    border-radius: 17px;
}

.detail-section h3[b-t8qolkg4rg] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--theme-ink);
}

.detail-section p[b-t8qolkg4rg] {
    margin: 0;
    color: var(--theme-muted);
    line-height: 1.7;
}

.detail-success[b-t8qolkg4rg] {
    border-color: #cce9dc;
    background: #f2fbf7;
}

.detail-warning[b-t8qolkg4rg] {
    border-color: #f2ddbc;
    background: #fff9ed;
}

.modal-actions[b-t8qolkg4rg] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    padding: 17px 25px;
    border-top: 1px solid var(--rr-border);
    background: #fff;
}

@media (max-width: 1180px) {
    .hero-layout[b-t8qolkg4rg] {
        grid-template-columns: 1fr;
    }

    .revenue-report-page[b-t8qolkg4rg]  .hero-summary {
        max-width: 560px;
    }
}

@media (max-width: 900px) {
    .panel-heading[b-t8qolkg4rg] {
        flex-direction: column;
    }

    .heading-actions[b-t8qolkg4rg] {
        width: 100%;
    }

    .detail-stat-grid[b-t8qolkg4rg] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .revenue-report-page[b-t8qolkg4rg] {
        padding: 12px;
    }

    .revenue-report-page[b-t8qolkg4rg]  .revenue-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .revenue-report-page[b-t8qolkg4rg]  .hero-title {
        font-size: 2.35rem;
    }

    .hero-tags[b-t8qolkg4rg] {
        display: grid;
    }

    .heading-actions[b-t8qolkg4rg],
    .apply-row[b-t8qolkg4rg] {
        align-items: stretch;
        flex-direction: column;
    }

    .heading-actions[b-t8qolkg4rg]  .mud-button-root,
    .apply-row[b-t8qolkg4rg]  .mud-button-root {
        width: 100%;
    }

    .bar-chart[b-t8qolkg4rg] {
        gap: 6px;
        padding-left: 0;
        padding-right: 0;
    }

    .bar[b-t8qolkg4rg] {
        width: min(42%,24px);
    }

    .bar span[b-t8qolkg4rg] {
        display: none;
    }

    .trend-summary[b-t8qolkg4rg],
    .detail-stat-grid[b-t8qolkg4rg] {
        grid-template-columns: 1fr;
    }

    .transaction-item[b-t8qolkg4rg] {
        grid-template-columns: 44px 1fr;
    }

    .transaction-amount[b-t8qolkg4rg] {
        grid-column: 2;
    }

    .modal-backdrop[b-t8qolkg4rg] {
        padding: 8px;
    }

    .modal-header[b-t8qolkg4rg],
    .modal-body[b-t8qolkg4rg],
    .modal-actions[b-t8qolkg4rg] {
        padding-left: 18px;
        padding-right: 18px;
    }
}
/* /Components/Pages/05Correspondence/03Reports/ServiceReports.razor.rz.scp.css */
.service-report-page[b-hmbre14mnl] {
    --sr-primary: #0b7053;
    --sr-primary-dark: #054435;
    --sr-gold: #d8aa31;
    --sr-ink: #173f33;
    --sr-muted: #6e827a;
    --sr-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--sr-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(28, 145, 106, .08), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #edf5f1 100%);
    font-family: "Kanit", sans-serif;
}

.service-report-page[b-hmbre14mnl],
.service-report-page *[b-hmbre14mnl] {
    box-sizing: border-box;
}

.service-report-page[b-hmbre14mnl]  .service-report-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 30px;
    color: #fff;
    background: linear-gradient(128deg, var(--theme-dark) 0%, #08654c 58%, #0c7c5d 100%);
    box-shadow: 0 24px 56px rgba(5, 64, 49, .25);
}

.hero-pattern[b-hmbre14mnl] {
    position: absolute;
    inset: 0;
    opacity: .11;
    background-image:
        linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(90deg, transparent 0%, #000 55%);
}

.hero-orb[b-hmbre14mnl] {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.hero-orb-one[b-hmbre14mnl] {
    width: 330px;
    height: 330px;
    top: -185px;
    right: 18%;
    background: rgba(255, 213, 97, .15);
}

.hero-orb-two[b-hmbre14mnl] {
    width: 245px;
    height: 245px;
    right: -80px;
    bottom: -125px;
    background: rgba(255,255,255,.10);
}

.hero-layout[b-hmbre14mnl] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 355px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    color: rgba(255,255,255,.91);
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 650;
}

.service-report-page[b-hmbre14mnl]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.35rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.14;
}

.service-report-page[b-hmbre14mnl]  .hero-subtitle {
    max-width: 860px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.19rem;
    line-height: 1.78;
}

.hero-feature-list[b-hmbre14mnl] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.hero-feature-list span[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    color: rgba(255,255,255,.91);
    background: rgba(255,255,255,.10);
    font-size: .98rem;
    font-weight: 600;
}

.service-report-page[b-hmbre14mnl]  .hero-summary {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-summary-top[b-hmbre14mnl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-summary-icon[b-hmbre14mnl] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: #5b4100;
    background: linear-gradient(135deg, #ffe5a0, #d5a42d);
}

.hero-summary-icon[b-hmbre14mnl]  .mud-icon-root {
    font-size: 2rem;
}

.mock-badge[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    color: #effff8;
    background: rgba(255,255,255,.10);
    font-size: .82rem;
    font-weight: 800;
}

.mock-badge i[b-hmbre14mnl] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #70f2b8;
    box-shadow: 0 0 0 5px rgba(112, 242, 184, .14);
}

.service-report-page[b-hmbre14mnl]  .hero-summary-title {
    margin-top: 17px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-summary-grid[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-summary-grid div[b-hmbre14mnl] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-summary-grid small[b-hmbre14mnl] {
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.hero-summary-grid strong[b-hmbre14mnl] {
    color: #fff;
    font-size: 1.07rem;
}

.service-report-page[b-hmbre14mnl]  .hero-summary .mud-button-root {
    min-height: 49px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
}

.service-report-page[b-hmbre14mnl]  .filter-panel,
.service-report-page[b-hmbre14mnl]  .dashboard-panel,
.service-report-page[b-hmbre14mnl]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--sr-border);
    border-radius: 24px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 12px 31px rgba(20, 74, 57, .08);
}

.panel-heading[b-hmbre14mnl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.compact-heading[b-hmbre14mnl] {
    margin-bottom: 14px;
}

.service-report-page[b-hmbre14mnl]  .panel-title {
    color: var(--sr-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 850;
}

.service-report-page[b-hmbre14mnl]  .panel-subtitle {
    margin-top: 4px;
    color: var(--sr-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.heading-actions[b-hmbre14mnl],
.apply-row[b-hmbre14mnl],
.view-actions[b-hmbre14mnl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.apply-row[b-hmbre14mnl] {
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--sr-border);
}

.service-report-page[b-hmbre14mnl]  .large-input .mud-input-control {
    min-height: 58px;
}

.service-report-page[b-hmbre14mnl]  .large-input .mud-input-label,
.service-report-page[b-hmbre14mnl]  .large-input input,
.service-report-page[b-hmbre14mnl]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.service-report-page[b-hmbre14mnl]  .filter-panel .mud-button-root,
.service-report-page[b-hmbre14mnl]  .dashboard-panel .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.service-report-page[b-hmbre14mnl]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--sr-muted);
}

.kpi-grid[b-hmbre14mnl] {
    margin-top: 1px;
}

.service-report-page[b-hmbre14mnl]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 176px;
    gap: 18px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--sr-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 27px rgba(21, 72, 56, .075);
}

.service-report-page[b-hmbre14mnl]  .kpi-card::after {
    position: absolute;
    right: -38px;
    bottom: -48px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    content: "";
    background: var(--kpi-soft);
}

.kpi-green[b-hmbre14mnl] { --kpi-main:var(--theme-primary); --kpi-soft:color-mix(in srgb, var(--theme-light) 15%, white); }
.kpi-blue[b-hmbre14mnl] { --kpi-main:#286fb6; --kpi-soft:#dfedff; }
.kpi-purple[b-hmbre14mnl] { --kpi-main:#7653aa; --kpi-soft:#eee6fb; }
.kpi-amber[b-hmbre14mnl] { --kpi-main:#b77805; --kpi-soft:#fff0c9; }
.kpi-teal[b-hmbre14mnl] { --kpi-main:#16858b; --kpi-soft:#dcf4f3; }
.kpi-red[b-hmbre14mnl] { --kpi-main:#c14e54; --kpi-soft:#ffe3e5; }

.kpi-icon[b-hmbre14mnl] {
    position: relative;
    z-index: 1;
    display: grid;
    flex: 0 0 auto;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: var(--kpi-main);
    background: var(--kpi-soft);
}

.kpi-icon[b-hmbre14mnl]  .mud-icon-root {
    font-size: 2rem;
}

.kpi-copy[b-hmbre14mnl] {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
}

.service-report-page[b-hmbre14mnl]  .kpi-title {
    color: #62776f;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.kpi-value[b-hmbre14mnl] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
}

.kpi-value strong[b-hmbre14mnl] {
    color: var(--sr-ink);
    font-size: 2.15rem;
    font-weight: 900;
}

.kpi-value span[b-hmbre14mnl] {
    color: var(--sr-muted);
    font-size: 1rem;
    font-weight: 600;
}

.kpi-note[b-hmbre14mnl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
}

.kpi-note small[b-hmbre14mnl] {
    color: #72867e;
    font-size: .9rem;
}

.change[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
    font-weight: 800;
}

.change-good[b-hmbre14mnl] { color: var(--theme-primary); }
.change-bad[b-hmbre14mnl] { color: #c14b50; }

.dashboard-grid[b-hmbre14mnl],
.bottom-grid[b-hmbre14mnl] {
    margin-top: 1px;
}

.chart-legend[b-hmbre14mnl] {
    display: flex;
    gap: 14px;
    color: var(--theme-muted);
    font-size: .92rem;
}

.chart-legend span[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.chart-legend i[b-hmbre14mnl] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.legend-request[b-hmbre14mnl] { background: var(--theme-primary); }
.legend-completed[b-hmbre14mnl] { background: var(--theme-accent); }

.bar-chart[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: repeat(6, minmax(46px, 1fr));
    gap: 14px;
    min-height: 290px;
    align-items: end;
    padding: 24px 10px 4px;
    border-bottom: 1px solid var(--sr-border);
    background:
        repeating-linear-gradient(
            to top,
            transparent 0,
            transparent 53px,
            rgba(17, 91, 68, .07) 54px
        );
}

.bar-column[b-hmbre14mnl] {
    display: grid;
    height: 250px;
    align-items: end;
    gap: 9px;
    text-align: center;
}

.bar-column > strong[b-hmbre14mnl] {
    color: var(--theme-muted);
    font-size: .92rem;
}

.bar-values[b-hmbre14mnl] {
    display: flex;
    height: 215px;
    align-items: end;
    justify-content: center;
    gap: 6px;
}

.bar[b-hmbre14mnl] {
    position: relative;
    width: min(35%, 31px);
    min-height: 16px;
    border-radius: 9px 9px 4px 4px;
    transition: .2s ease;
}

.bar:hover[b-hmbre14mnl] {
    transform: translateY(-3px);
}

.bar span[b-hmbre14mnl] {
    position: absolute;
    top: -24px;
    left: 50%;
    color: #547067;
    font-size: .75rem;
    font-weight: 800;
    transform: translateX(-50%);
}

.bar-request[b-hmbre14mnl] {
    background: linear-gradient(180deg, #16956f, var(--theme-primary));
}

.bar-completed[b-hmbre14mnl] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--theme-accent) 82%, white), #b68412);
}

.quality-summary[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 19px;
}

.quality-summary > div[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.quality-summary span[b-hmbre14mnl] {
    color: var(--theme-muted);
    font-size: .95rem;
}

.quality-summary strong[b-hmbre14mnl] {
    color: var(--sr-ink);
    font-size: 1.05rem;
}

.quality-summary[b-hmbre14mnl]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.channel-list[b-hmbre14mnl] {
    display: grid;
    gap: 11px;
}

.channel-row[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid #e3ece8;
    border-radius: 17px;
    background: #fff;
}

.channel-icon[b-hmbre14mnl] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    color: var(--channel-main);
    background: var(--channel-soft);
}

.channel-green[b-hmbre14mnl] { --channel-main:var(--theme-primary); --channel-soft:#def4eb; }
.channel-blue[b-hmbre14mnl] { --channel-main:#286fb6; --channel-soft:#e3efff; }
.channel-purple[b-hmbre14mnl] { --channel-main:#7653aa; --channel-soft:#efe8fb; }
.channel-amber[b-hmbre14mnl] { --channel-main:#b77805; --channel-soft:#fff1cf; }
.channel-teal[b-hmbre14mnl] { --channel-main:#16858b; --channel-soft:#dff5f4; }

.channel-copy[b-hmbre14mnl] {
    display: grid;
    gap: 7px;
}

.channel-copy > div[b-hmbre14mnl] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.channel-copy strong[b-hmbre14mnl] {
    color: #294c40;
    font-size: 1rem;
}

.channel-copy em[b-hmbre14mnl] {
    color: #687d75;
    font-size: .87rem;
    font-style: normal;
}

.channel-copy small[b-hmbre14mnl] {
    color: #788b83;
    font-size: .84rem;
}

.record-count[b-hmbre14mnl],
.alert-count[b-hmbre14mnl] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.service-table-wrap[b-hmbre14mnl] {
    overflow-x: auto;
    border: 1px solid var(--sr-border);
    border-radius: 18px;
}

.service-table[b-hmbre14mnl] {
    width: 100%;
    min-width: 1260px;
    border-collapse: collapse;
    background: #fff;
}

.service-table th[b-hmbre14mnl],
.service-table td[b-hmbre14mnl] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.service-table th[b-hmbre14mnl] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .92rem;
    font-weight: 800;
}

.service-table td[b-hmbre14mnl] {
    color: #35554a;
    font-size: .95rem;
}

.service-table tbody tr:hover[b-hmbre14mnl] {
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.service-name-cell[b-hmbre14mnl] {
    display: flex;
    min-width: 300px;
    align-items: center;
    gap: 11px;
}

.service-name-cell img[b-hmbre14mnl],
.service-name-cell > span[b-hmbre14mnl] {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
}

.service-name-cell img[b-hmbre14mnl] {
    object-fit: cover;
}

.service-name-cell > span[b-hmbre14mnl] {
    color: #0b7355;
    background: #e1f3ec;
}

.service-name-cell div[b-hmbre14mnl] {
    display: grid;
    gap: 3px;
}

.service-name-cell strong[b-hmbre14mnl] {
    color: var(--theme-ink);
    font-size: 1rem;
}

.service-name-cell small[b-hmbre14mnl] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.table-progress[b-hmbre14mnl] {
    display: grid;
    min-width: 130px;
    gap: 6px;
}

.overdue-pill[b-hmbre14mnl],
.status-pill[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 35px;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.overdue-pill[b-hmbre14mnl] {
    color: #ad3f45;
    background: #ffe3e4;
}

.status-excellent[b-hmbre14mnl] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.status-good[b-hmbre14mnl] { color: #286b9d; background: #e2f1fc; }
.status-watch[b-hmbre14mnl] { color: #996405; background: #fff0ca; }
.status-critical[b-hmbre14mnl] { color: #b23f45; background: #ffe2e4; }

.service-card[b-hmbre14mnl] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--sr-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21, 73, 57, .07);
}

.service-card-image[b-hmbre14mnl] {
    position: relative;
    display: grid;
    height: 165px;
    place-items: center;
    overflow: hidden;
    color: var(--theme-primary);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-light) 15%, white), #eff9f5);
}

.service-card-image img[b-hmbre14mnl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-card-image[b-hmbre14mnl] >  .mud-icon-root {
    font-size: 3.4rem;
}

.service-card-image > .status-pill[b-hmbre14mnl] {
    position: absolute;
    right: 12px;
    bottom: 12px;
    box-shadow: 0 6px 16px rgba(16, 63, 49, .14);
}

.service-card-body[b-hmbre14mnl] {
    padding: 18px;
}

.service-card-body > small[b-hmbre14mnl] {
    color: #72867e;
    font-size: .85rem;
}

.service-card-body h3[b-hmbre14mnl] {
    min-height: 56px;
    margin: 6px 0 14px;
    color: var(--theme-ink);
    font-size: 1.16rem;
    line-height: 1.48;
}

.service-stat-grid[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.service-stat-grid > div[b-hmbre14mnl] {
    display: grid;
    gap: 4px;
    padding: 11px;
    border-radius: 14px;
    background: var(--theme-bg);
}

.service-stat-grid span[b-hmbre14mnl] {
    color: #74877f;
    font-size: .8rem;
}

.service-stat-grid strong[b-hmbre14mnl] {
    color: var(--theme-ink);
    font-size: 1.01rem;
}

.service-progress[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 14px;
}

.service-progress span[b-hmbre14mnl] {
    color: #657a72;
    font-size: .9rem;
}

.service-progress strong[b-hmbre14mnl] {
    color: var(--theme-ink);
    font-size: .95rem;
}

.service-progress[b-hmbre14mnl]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.service-card-footer[b-hmbre14mnl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.service-card-footer > span[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #6b7f77;
    font-size: .84rem;
}

.department-list[b-hmbre14mnl],
.feedback-list[b-hmbre14mnl],
.alert-list[b-hmbre14mnl] {
    display: grid;
    gap: 11px;
}

.department-row[b-hmbre14mnl] {
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: #fff;
}

.department-row-top[b-hmbre14mnl] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
}

.department-row-top div[b-hmbre14mnl] {
    display: grid;
    gap: 3px;
}

.department-row-top strong[b-hmbre14mnl] {
    color: #294c40;
    font-size: 1rem;
}

.department-row-top small[b-hmbre14mnl] {
    color: #778a82;
    font-size: .84rem;
}

.department-row-top > span[b-hmbre14mnl] {
    color: #0b7456;
    font-size: 1.05rem;
    font-weight: 850;
}

.department-metrics[b-hmbre14mnl] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.department-metrics span[b-hmbre14mnl] {
    padding: 5px 8px;
    border-radius: 999px;
    color: #61756d;
    background: #f0f5f3;
    font-size: .79rem;
    font-weight: 650;
}

.department-metrics .department-overdue[b-hmbre14mnl] {
    color: #aa3f45;
    background: #ffe6e7;
}

.feedback-card[b-hmbre14mnl] {
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: #fff;
}

.feedback-top[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    gap: 10px;
    align-items: center;
}

.feedback-avatar[b-hmbre14mnl] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, #087356, #27a47b);
    font-weight: 800;
}

.feedback-top > div[b-hmbre14mnl] {
    display: grid;
    gap: 2px;
}

.feedback-top strong[b-hmbre14mnl] {
    color: #294c40;
    font-size: .95rem;
}

.feedback-top small[b-hmbre14mnl] {
    color: #788b83;
    font-size: .78rem;
}

.rating-pill[b-hmbre14mnl] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 5px 8px;
    border-radius: 999px;
    color: #946200;
    background: #fff0c8;
    font-size: .84rem;
    font-weight: 800;
}

.feedback-card p[b-hmbre14mnl] {
    margin: 12px 0 8px;
    color: #5f746c;
    font-size: .9rem;
    line-height: 1.62;
}

.feedback-card > small[b-hmbre14mnl] {
    color: #899890;
    font-size: .78rem;
}

.alert-item[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 11px;
    width: 100%;
    padding: 13px;
    border: 1px solid #e4ece8;
    border-radius: 16px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    font-family: "Kanit", sans-serif;
    transition: .2s ease;
}

.alert-item:hover[b-hmbre14mnl] {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(20, 71, 55, .10);
}

.alert-icon[b-hmbre14mnl] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
}

.alert-critical .alert-icon[b-hmbre14mnl] {
    color: #b9343a;
    background: #ffe6e7;
}

.alert-warning .alert-icon[b-hmbre14mnl] {
    color: #a56c03;
    background: #fff1cd;
}

.alert-info .alert-icon[b-hmbre14mnl] {
    color: #2d6fab;
    background: #e6f1ff;
}

.alert-item > span:last-child[b-hmbre14mnl] {
    display: grid;
    gap: 4px;
}

.alert-item strong[b-hmbre14mnl] {
    color: var(--theme-ink);
    font-size: .93rem;
    line-height: 1.45;
}

.alert-item small[b-hmbre14mnl] {
    color: #7a8c84;
    font-size: .79rem;
}

.alert-item em[b-hmbre14mnl] {
    color: #62766e;
    font-size: .84rem;
    font-style: normal;
    line-height: 1.5;
}

.modal-backdrop[b-hmbre14mnl] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4, 34, 26, .68);
    backdrop-filter: blur(6px);
}

.service-report-page[b-hmbre14mnl]  .modal-panel {
    width: min(900px, 100%);
    max-height: 93vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.modal-header[b-hmbre14mnl] {
    position: sticky;
    z-index: 4;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--sr-border);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(13px);
}

.service-report-page[b-hmbre14mnl]  .modal-title {
    color: var(--sr-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 850;
}

.service-report-page[b-hmbre14mnl]  .modal-subtitle {
    color: var(--sr-muted);
    font-size: 1rem;
}

.service-detail-banner[b-hmbre14mnl] {
    position: relative;
    display: grid;
    height: 215px;
    place-items: center;
    overflow: hidden;
    color: #0b7456;
    background: linear-gradient(135deg, #ddf3ea, #edf8f4);
}

.service-detail-banner img[b-hmbre14mnl] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-detail-banner[b-hmbre14mnl] >  .mud-icon-root {
    font-size: 4rem;
}

.service-detail-banner > .status-pill[b-hmbre14mnl] {
    position: absolute;
    right: 18px;
    bottom: 18px;
    box-shadow: 0 7px 18px rgba(16, 63, 49, .16);
}

.modal-body[b-hmbre14mnl] {
    padding: 24px 25px;
}

.detail-stat-grid[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.detail-stat-grid > div[b-hmbre14mnl],
.detail-info-grid > div[b-hmbre14mnl] {
    display: grid;
    gap: 5px;
    padding: 15px;
    border: 1px solid var(--sr-border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-stat-grid span[b-hmbre14mnl],
.detail-info-grid span[b-hmbre14mnl] {
    color: var(--theme-muted);
    font-size: .9rem;
}

.detail-stat-grid strong[b-hmbre14mnl],
.detail-info-grid strong[b-hmbre14mnl] {
    color: var(--theme-ink);
    font-size: 1.08rem;
}

.detail-progress-grid[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
    margin-top: 17px;
}

.detail-progress-grid > div[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 15px;
    border: 1px solid var(--sr-border);
    border-radius: 16px;
}

.detail-progress-grid span[b-hmbre14mnl] {
    color: #6a7f77;
    font-size: .9rem;
}

.detail-progress-grid strong[b-hmbre14mnl] {
    color: var(--theme-ink);
}

.detail-progress-grid[b-hmbre14mnl]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.detail-info-grid[b-hmbre14mnl] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 17px;
}

.detail-info-grid > div[b-hmbre14mnl] {
    grid-template-columns: 34px 1fr;
    align-items: center;
}

.detail-info-grid[b-hmbre14mnl]  .mud-icon-root {
    grid-row: 1 / 3;
    color: var(--theme-primary);
}

.detail-section[b-hmbre14mnl] {
    margin-top: 18px;
    padding: 17px;
    border: 1px solid var(--sr-border);
    border-radius: 17px;
}

.detail-section h3[b-hmbre14mnl] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--theme-ink);
    font-size: 1.08rem;
}

.detail-section p[b-hmbre14mnl] {
    margin: 0;
    color: var(--theme-muted);
    font-size: .98rem;
    line-height: 1.7;
}

.detail-success[b-hmbre14mnl] {
    border-color: #cce9dc;
    background: #f2fbf7;
}

.detail-warning[b-hmbre14mnl] {
    border-color: #f2ddbc;
    background: #fff9ed;
}

.modal-actions[b-hmbre14mnl] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    padding: 17px 25px;
    border-top: 1px solid var(--sr-border);
    background: #fff;
}

@media (max-width: 1180px) {
    .hero-layout[b-hmbre14mnl] {
        grid-template-columns: 1fr;
    }

    .service-report-page[b-hmbre14mnl]  .hero-summary {
        max-width: 560px;
    }
}

@media (max-width: 900px) {
    .panel-heading[b-hmbre14mnl] {
        flex-direction: column;
    }

    .heading-actions[b-hmbre14mnl] {
        width: 100%;
    }

    .detail-stat-grid[b-hmbre14mnl],
    .detail-info-grid[b-hmbre14mnl] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .service-report-page[b-hmbre14mnl] {
        padding: 12px;
    }

    .service-report-page[b-hmbre14mnl]  .service-report-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .service-report-page[b-hmbre14mnl]  .hero-title {
        font-size: 2.35rem;
    }

    .service-report-page[b-hmbre14mnl]  .hero-subtitle {
        font-size: 1.07rem;
    }

    .hero-feature-list[b-hmbre14mnl] {
        display: grid;
    }

    .heading-actions[b-hmbre14mnl],
    .apply-row[b-hmbre14mnl] {
        align-items: stretch;
        flex-direction: column;
    }

    .heading-actions[b-hmbre14mnl]  .mud-button-root,
    .apply-row[b-hmbre14mnl]  .mud-button-root {
        width: 100%;
    }

    .bar-chart[b-hmbre14mnl] {
        gap: 6px;
        padding-left: 0;
        padding-right: 0;
    }

    .bar[b-hmbre14mnl] {
        width: min(42%, 24px);
    }

    .bar span[b-hmbre14mnl] {
        display: none;
    }

    .quality-summary[b-hmbre14mnl],
    .detail-stat-grid[b-hmbre14mnl],
    .detail-progress-grid[b-hmbre14mnl],
    .detail-info-grid[b-hmbre14mnl] {
        grid-template-columns: 1fr;
    }

    .modal-backdrop[b-hmbre14mnl] {
        padding: 8px;
    }

    .modal-header[b-hmbre14mnl],
    .modal-body[b-hmbre14mnl],
    .modal-actions[b-hmbre14mnl] {
        padding-left: 18px;
        padding-right: 18px;
    }
}
/* /Components/Pages/05Correspondence/03Reports/SlaReports.razor.rz.scp.css */
.sla-report-page[b-kxjou18336] {
    --sla-primary: #0a6d51;
    --sla-dark: var(--theme-dark);
    --sla-ink: var(--theme-ink);
    --sla-muted: var(--theme-muted);
    --sla-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--sla-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(29,145,106,.09), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #edf5f1 100%);
    font-family: "Kanit", sans-serif;
}

.sla-report-page[b-kxjou18336],
.sla-report-page *[b-kxjou18336] {
    box-sizing: border-box;
}

.sla-report-page[b-kxjou18336]  .sla-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 84% 12%, rgba(255,213,97,.18), transparent 29%),
        linear-gradient(128deg, var(--theme-dark) 0%, var(--theme-primary) 58%, #0b7a5b 100%);
    box-shadow: 0 24px 56px rgba(5,63,48,.25);
}

.hero-layout[b-kxjou18336] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0,1fr) 355px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-kxjou18336] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 650;
}

.sla-report-page[b-kxjou18336]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.35rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.14;
}

.sla-report-page[b-kxjou18336]  .hero-subtitle {
    max-width: 880px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.19rem;
    line-height: 1.78;
}

.hero-tags[b-kxjou18336] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.hero-tags span[b-kxjou18336] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.10);
    font-size: .98rem;
    font-weight: 600;
}

.sla-report-page[b-kxjou18336]  .hero-summary {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-summary-top[b-kxjou18336] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-summary-icon[b-kxjou18336] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: #5b4100;
    background: linear-gradient(135deg, #ffe5a0, #d5a42d);
}

.hero-summary-icon[b-kxjou18336]  .mud-icon-root {
    font-size: 2rem;
}

.mock-badge[b-kxjou18336] {
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    font-size: .82rem;
    font-weight: 800;
}

.sla-report-page[b-kxjou18336]  .hero-summary-title {
    margin-top: 17px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-summary-grid[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-summary-grid div[b-kxjou18336] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-summary-grid small[b-kxjou18336] {
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.hero-summary-grid strong[b-kxjou18336] {
    color: #fff;
    font-size: 1.07rem;
}

.sla-report-page[b-kxjou18336]  .hero-summary .mud-button-root {
    min-height: 49px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
}

.sla-report-page[b-kxjou18336]  .filter-panel,
.sla-report-page[b-kxjou18336]  .dashboard-panel,
.sla-report-page[b-kxjou18336]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--sla-border);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 31px rgba(20,74,57,.08);
}

.panel-heading[b-kxjou18336] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.compact-heading[b-kxjou18336] {
    margin-bottom: 14px;
}

.sla-report-page[b-kxjou18336]  .panel-title {
    color: var(--sla-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.42rem;
    font-weight: 850;
}

.sla-report-page[b-kxjou18336]  .panel-subtitle {
    margin-top: 4px;
    color: var(--sla-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.heading-actions[b-kxjou18336],
.apply-row[b-kxjou18336],
.view-actions[b-kxjou18336] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.apply-row[b-kxjou18336] {
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--sla-border);
}

.sla-report-page[b-kxjou18336]  .large-input .mud-input-control {
    min-height: 58px;
}

.sla-report-page[b-kxjou18336]  .large-input .mud-input-label,
.sla-report-page[b-kxjou18336]  .large-input input,
.sla-report-page[b-kxjou18336]  .large-input .mud-select-input,
.sla-report-page[b-kxjou18336]  .large-input textarea {
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.sla-report-page[b-kxjou18336]  .filter-panel .mud-button-root,
.sla-report-page[b-kxjou18336]  .dashboard-panel .mud-button-root,
.sla-report-page[b-kxjou18336]  .modal-panel .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.sla-report-page[b-kxjou18336]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--sla-muted);
}

.kpi-grid[b-kxjou18336],
.dashboard-grid[b-kxjou18336],
.bottom-grid[b-kxjou18336] {
    margin-top: 1px;
}

.sla-report-page[b-kxjou18336]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 176px;
    gap: 18px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--sla-border);
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 11px 27px rgba(21,72,56,.075);
}

.sla-report-page[b-kxjou18336]  .kpi-card::after {
    position: absolute;
    right: -38px;
    bottom: -48px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    content: "";
    background: var(--kpi-soft);
}

.kpi-green[b-kxjou18336] { --kpi-main:var(--theme-primary); --kpi-soft:color-mix(in srgb, var(--theme-light) 15%, white); }
.kpi-blue[b-kxjou18336] { --kpi-main:#286fb6; --kpi-soft:#dfedff; }
.kpi-purple[b-kxjou18336] { --kpi-main:#7653aa; --kpi-soft:#eee6fb; }
.kpi-amber[b-kxjou18336] { --kpi-main:#b77805; --kpi-soft:#fff0c9; }
.kpi-teal[b-kxjou18336] { --kpi-main:#16858b; --kpi-soft:#dcf4f3; }
.kpi-red[b-kxjou18336] { --kpi-main:#c14e54; --kpi-soft:#ffe3e5; }

.kpi-icon[b-kxjou18336] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 18px;
    color: var(--kpi-main);
    background: var(--kpi-soft);
}

.kpi-icon[b-kxjou18336]  .mud-icon-root {
    font-size: 2rem;
}

.kpi-copy[b-kxjou18336] {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
}

.sla-report-page[b-kxjou18336]  .kpi-title {
    color: #62776f;
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
    font-weight: 650;
}

.kpi-value[b-kxjou18336] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
}

.kpi-value strong[b-kxjou18336] {
    color: var(--sla-ink);
    font-size: 2.15rem;
    font-weight: 900;
}

.kpi-value span[b-kxjou18336] {
    color: var(--sla-muted);
    font-size: 1rem;
    font-weight: 600;
}

.kpi-note[b-kxjou18336] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
}

.kpi-note small[b-kxjou18336] {
    color: #72867e;
    font-size: .9rem;
}

.change[b-kxjou18336] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .9rem;
    font-weight: 800;
}

.change-good[b-kxjou18336] { color: var(--theme-primary); }
.change-bad[b-kxjou18336] { color: #c14b50; }

.chart-legend[b-kxjou18336] {
    display: flex;
    gap: 14px;
    color: var(--theme-muted);
    font-size: .92rem;
}

.chart-legend span[b-kxjou18336] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.chart-legend i[b-kxjou18336] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.legend-total[b-kxjou18336] { background: #aebdb6; }
.legend-within[b-kxjou18336] { background: #0b7456; }

.bar-chart[b-kxjou18336] {
    display: grid;
    grid-template-columns: repeat(6,minmax(46px,1fr));
    gap: 14px;
    min-height: 290px;
    align-items: end;
    padding: 24px 10px 4px;
    border-bottom: 1px solid var(--sla-border);
    background:
        repeating-linear-gradient(to top, transparent 0, transparent 53px, rgba(17,91,68,.07) 54px);
}

.bar-column[b-kxjou18336] {
    display: grid;
    height: 250px;
    align-items: end;
    gap: 9px;
    text-align: center;
}

.bar-column > strong[b-kxjou18336] {
    color: var(--theme-muted);
    font-size: .92rem;
}

.bar-values[b-kxjou18336] {
    display: flex;
    height: 215px;
    align-items: end;
    justify-content: center;
    gap: 6px;
}

.bar[b-kxjou18336] {
    position: relative;
    width: min(35%,31px);
    min-height: 16px;
    border-radius: 9px 9px 4px 4px;
}

.bar span[b-kxjou18336] {
    position: absolute;
    top: -24px;
    left: 50%;
    color: #547067;
    font-size: .75rem;
    font-weight: 800;
    transform: translateX(-50%);
}

.bar-total[b-kxjou18336] { background: linear-gradient(180deg,#cdd7d2,#91a69d); }
.bar-within[b-kxjou18336] { background: linear-gradient(180deg,#16956f,var(--theme-primary)); }

.trend-summary[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 19px;
}

.trend-summary > div[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    padding: 15px;
    border: 1px solid var(--theme-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.trend-summary span[b-kxjou18336] {
    color: var(--theme-muted);
    font-size: .95rem;
}

.trend-summary strong[b-kxjou18336] {
    color: var(--sla-ink);
    font-size: 1.05rem;
}

.trend-summary small[b-kxjou18336] {
    grid-column: 1 / -1;
    color: #7b8d85;
}

.trend-summary[b-kxjou18336]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.cause-list[b-kxjou18336],
.activity-list[b-kxjou18336],
.alert-list[b-kxjou18336] {
    display: grid;
    gap: 11px;
}

.cause-item[b-kxjou18336] {
    display: grid;
    grid-template-columns: 47px 1fr;
    gap: 12px;
    width: 100%;
    align-items: center;
    padding: 13px;
    border: 1px solid #e3ece8;
    border-radius: 17px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    font-family: "Kanit", sans-serif;
}

.cause-icon[b-kxjou18336] {
    display: grid;
    width: 47px;
    height: 47px;
    place-items: center;
    border-radius: 15px;
    color: var(--cause-main);
    background: var(--cause-soft);
}

.cause-amber[b-kxjou18336] { --cause-main:#a96f05; --cause-soft:#fff1d0; }
.cause-red[b-kxjou18336] { --cause-main:#b84046; --cause-soft:#ffe4e6; }
.cause-blue[b-kxjou18336] { --cause-main:#2c70b0; --cause-soft:#e5f1ff; }
.cause-purple[b-kxjou18336] { --cause-main:#7653aa; --cause-soft:#eee7fb; }
.cause-teal[b-kxjou18336] { --cause-main:#16858b; --cause-soft:#dff5f4; }

.cause-copy[b-kxjou18336] {
    display: grid;
    gap: 7px;
}

.cause-copy > span[b-kxjou18336] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.cause-copy strong[b-kxjou18336] {
    color: #294c40;
    font-size: .97rem;
}

.cause-copy em[b-kxjou18336] {
    color: #687d75;
    font-size: .84rem;
    font-style: normal;
}

.cause-copy small[b-kxjou18336] {
    color: #788b83;
    font-size: .81rem;
    line-height: 1.45;
}

.record-count[b-kxjou18336],
.alert-count[b-kxjou18336] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.department-table-wrap[b-kxjou18336],
.overdue-table-wrap[b-kxjou18336] {
    overflow-x: auto;
    border: 1px solid var(--sla-border);
    border-radius: 18px;
}

.department-table[b-kxjou18336],
.overdue-table[b-kxjou18336] {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
    background: #fff;
}

.department-table th[b-kxjou18336],
.department-table td[b-kxjou18336],
.overdue-table th[b-kxjou18336],
.overdue-table td[b-kxjou18336] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.department-table th[b-kxjou18336],
.overdue-table th[b-kxjou18336] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .92rem;
    font-weight: 800;
}

.department-table td[b-kxjou18336],
.overdue-table td[b-kxjou18336] {
    color: #35554a;
    font-size: .95rem;
}

.department-name-cell[b-kxjou18336],
.work-name-cell[b-kxjou18336] {
    display: flex;
    min-width: 290px;
    align-items: center;
    gap: 11px;
}

.department-name-cell img[b-kxjou18336],
.department-avatar[b-kxjou18336],
.work-name-cell img[b-kxjou18336],
.work-name-cell > span[b-kxjou18336] {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
}

.department-name-cell img[b-kxjou18336],
.work-name-cell img[b-kxjou18336] {
    object-fit: cover;
}

.department-avatar[b-kxjou18336] {
    color: #fff;
    background: linear-gradient(135deg,#087356,#27a47b);
    font-weight: 800;
}

.work-name-cell > span[b-kxjou18336] {
    color: #b44349;
    background: #ffe5e7;
}

.department-name-cell div[b-kxjou18336],
.work-name-cell div[b-kxjou18336] {
    display: grid;
    gap: 3px;
}

.department-name-cell strong[b-kxjou18336],
.work-name-cell strong[b-kxjou18336] {
    color: var(--theme-ink);
}

.department-name-cell small[b-kxjou18336],
.work-name-cell small[b-kxjou18336] {
    color: var(--theme-muted);
}

.table-progress[b-kxjou18336] {
    display: grid;
    min-width: 130px;
    gap: 6px;
}

.count-pill[b-kxjou18336],
.status-pill[b-kxjou18336],
.priority-pill[b-kxjou18336],
.escalated-pill[b-kxjou18336],
.pending-pill[b-kxjou18336] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 35px;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.count-amber[b-kxjou18336] { color: #946200; background: #fff0c8; }
.count-red[b-kxjou18336] { color: #ad3f45; background: #ffe3e4; }

.status-excellent[b-kxjou18336] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.status-good[b-kxjou18336] { color: #286b9d; background: #e2f1fc; }
.status-watch[b-kxjou18336] { color: #996405; background: #fff0ca; }
.status-critical[b-kxjou18336] { color: #b23f45; background: #ffe2e4; }

.priority-normal[b-kxjou18336] { color: #477165; background: #e8f2ee; }
.priority-important[b-kxjou18336] { color: #2d6fa9; background: #e4f1ff; }
.priority-urgent[b-kxjou18336] { color: #9b6504; background: #fff0c9; }
.priority-critical[b-kxjou18336] { color: #b43d43; background: #ffe2e4; }

.escalated-pill[b-kxjou18336] { color: #b23d43; background: #ffe2e4; }
.pending-pill[b-kxjou18336] { color: #996405; background: #fff0ca; }
.overdue-hours[b-kxjou18336] { color: #bd444a !important; }

.overdue-card[b-kxjou18336] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--sla-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21,73,57,.07);
}

.overdue-card-image[b-kxjou18336] {
    position: relative;
    display: grid;
    height: 165px;
    place-items: center;
    overflow: hidden;
    color: #b6454b;
    background: linear-gradient(135deg,#ffe7e8,#fff4f4);
}

.overdue-card-image img[b-kxjou18336] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.overdue-card-image[b-kxjou18336] >  .mud-icon-root {
    font-size: 3.4rem;
}

.overdue-card-image > .priority-pill[b-kxjou18336] {
    position: absolute;
    right: 12px;
    bottom: 12px;
}

.overdue-card-body[b-kxjou18336] {
    padding: 18px;
}

.overdue-card-body > small[b-kxjou18336] {
    color: #72867e;
}

.overdue-card-body h3[b-kxjou18336] {
    min-height: 57px;
    margin: 6px 0 14px;
    color: var(--theme-ink);
    font-size: 1.16rem;
    line-height: 1.48;
}

.responsible-row[b-kxjou18336] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px;
    border-radius: 15px;
    background: var(--theme-bg);
}

.responsible-row img[b-kxjou18336],
.responsible-row > span[b-kxjou18336] {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border-radius: 13px;
}

.responsible-row img[b-kxjou18336] {
    object-fit: cover;
}

.responsible-row > span[b-kxjou18336] {
    color: #fff;
    background: linear-gradient(135deg,#087356,#27a47b);
    font-weight: 800;
}

.responsible-row div[b-kxjou18336] {
    display: grid;
    gap: 2px;
}

.responsible-row strong[b-kxjou18336] {
    color: #294c40;
}

.responsible-row small[b-kxjou18336] {
    color: #778a82;
}

.overdue-stat-grid[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 12px;
}

.overdue-stat-grid > div[b-kxjou18336] {
    display: grid;
    gap: 4px;
    padding: 11px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.overdue-stat-grid span[b-kxjou18336] {
    color: #74877f;
    font-size: .8rem;
}

.overdue-stat-grid strong[b-kxjou18336] {
    color: var(--theme-ink);
    font-size: .96rem;
}

.work-progress[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 13px;
}

.work-progress[b-kxjou18336]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.delay-box[b-kxjou18336] {
    margin-top: 13px;
    padding: 12px;
    border: 1px solid #f1dfbe;
    border-radius: 14px;
    background: #fff9ee;
}

.delay-box strong[b-kxjou18336] {
    color: #8d5e05;
    font-size: .9rem;
}

.delay-box p[b-kxjou18336] {
    margin: 5px 0 0;
    color: #6f776f;
    font-size: .87rem;
    line-height: 1.55;
}

.overdue-card-footer[b-kxjou18336] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--theme-border);
}

.activity-item[b-kxjou18336] {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid #e6eeea;
}

.activity-item:last-child[b-kxjou18336] {
    border-bottom: 0;
}

.activity-icon[b-kxjou18336] {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    color: #0b7456;
    background: #e2f3ec;
}

.activity-item div[b-kxjou18336] {
    display: grid;
    gap: 3px;
}

.activity-item strong[b-kxjou18336] {
    color: #294c40;
}

.activity-item p[b-kxjou18336] {
    margin: 0;
    color: #687c74;
    line-height: 1.55;
}

.activity-item small[b-kxjou18336] {
    color: #879890;
    font-size: .8rem;
}

.alert-item[b-kxjou18336] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 11px;
    width: 100%;
    padding: 13px;
    border: 1px solid #e4ece8;
    border-radius: 16px;
    text-align: left;
    background: #fff;
    cursor: pointer;
    font-family: "Kanit", sans-serif;
}

.alert-icon[b-kxjou18336] {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
}

.alert-critical .alert-icon[b-kxjou18336] {
    color: #b9343a;
    background: #ffe6e7;
}

.alert-warning .alert-icon[b-kxjou18336] {
    color: #a56c03;
    background: #fff1cd;
}

.alert-info .alert-icon[b-kxjou18336] {
    color: #2d6fab;
    background: #e6f1ff;
}

.alert-item > span:last-child[b-kxjou18336] {
    display: grid;
    gap: 4px;
}

.alert-item strong[b-kxjou18336] {
    color: var(--theme-ink);
    line-height: 1.45;
}

.alert-item small[b-kxjou18336] {
    color: #7a8c84;
    font-size: .79rem;
}

.alert-item em[b-kxjou18336] {
    color: #62766e;
    font-size: .84rem;
    font-style: normal;
    line-height: 1.5;
}

.modal-backdrop[b-kxjou18336] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4,34,26,.68);
    backdrop-filter: blur(6px);
}

.sla-report-page[b-kxjou18336]  .modal-panel {
    width: min(900px,100%);
    max-height: 93vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.modal-header[b-kxjou18336] {
    position: sticky;
    z-index: 4;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--sla-border);
    background: rgba(255,255,255,.96);
}

.sla-report-page[b-kxjou18336]  .modal-title {
    color: var(--sla-ink);
    font-family: "Kanit", sans-serif;
    font-weight: 850;
}

.sla-report-page[b-kxjou18336]  .modal-subtitle {
    color: var(--sla-muted);
    font-size: 1rem;
}

.detail-banner[b-kxjou18336] {
    position: relative;
    display: grid;
    height: 215px;
    place-items: center;
    overflow: hidden;
    color: #b6454b;
    background: linear-gradient(135deg,#ffe7e8,#fff4f4);
}

.detail-banner img[b-kxjou18336] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-banner[b-kxjou18336] >  .mud-icon-root {
    font-size: 4rem;
}

.detail-banner > .priority-pill[b-kxjou18336] {
    position: absolute;
    right: 18px;
    bottom: 18px;
}

.modal-body[b-kxjou18336] {
    padding: 24px 25px;
}

.detail-stat-grid[b-kxjou18336] {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 12px;
}

.detail-stat-grid > div[b-kxjou18336] {
    display: grid;
    gap: 5px;
    padding: 15px;
    border: 1px solid var(--sla-border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-stat-grid span[b-kxjou18336] {
    color: var(--theme-muted);
}

.detail-stat-grid strong[b-kxjou18336] {
    color: var(--theme-ink);
}

.detail-progress[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 17px;
    padding: 15px;
    border: 1px solid var(--sla-border);
    border-radius: 16px;
}

.detail-progress[b-kxjou18336]  .mud-progress-linear {
    grid-column: 1 / -1;
}

.detail-section[b-kxjou18336] {
    margin-top: 18px;
    padding: 17px;
    border: 1px solid var(--sla-border);
    border-radius: 17px;
}

.detail-section h3[b-kxjou18336] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--theme-ink);
}

.detail-section p[b-kxjou18336] {
    margin: 0;
    color: var(--theme-muted);
    line-height: 1.7;
}

.detail-success[b-kxjou18336] {
    border-color: #cce9dc;
    background: #f2fbf7;
}

.detail-warning[b-kxjou18336] {
    border-color: #f2ddbc;
    background: #fff9ed;
}

.escalation-note[b-kxjou18336] {
    margin-top: 18px;
}

.modal-actions[b-kxjou18336] {
    position: sticky;
    z-index: 4;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    padding: 17px 25px;
    border-top: 1px solid var(--sla-border);
    background: #fff;
}

.department-detail-head[b-kxjou18336] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 20px 25px;
    color: #fff;
    background: linear-gradient(135deg,var(--theme-dark),var(--theme-primary));
}

.department-detail-head img[b-kxjou18336],
.department-detail-head > span:first-child[b-kxjou18336] {
    display: grid;
    width: 60px;
    height: 60px;
    flex: 0 0 auto;
    place-items: center;
    border: 3px solid rgba(255,255,255,.22);
    border-radius: 18px;
    color: #fff;
    background: rgba(255,255,255,.12);
    object-fit: cover;
    font-weight: 800;
}

.department-detail-head > div[b-kxjou18336] {
    display: grid;
    flex: 1;
    gap: 3px;
}

.department-detail-head strong[b-kxjou18336] {
    font-size: 1.1rem;
}

.department-detail-head small[b-kxjou18336] {
    color: rgba(255,255,255,.72);
}

.department-progress-grid[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
    margin-top: 17px;
}

.department-progress-grid > div[b-kxjou18336] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 15px;
    border: 1px solid var(--sla-border);
    border-radius: 16px;
}

.department-progress-grid[b-kxjou18336]  .mud-progress-linear {
    grid-column: 1 / -1;
}

@media (max-width: 1180px) {
    .hero-layout[b-kxjou18336] {
        grid-template-columns: 1fr;
    }

    .sla-report-page[b-kxjou18336]  .hero-summary {
        max-width: 560px;
    }
}

@media (max-width: 900px) {
    .panel-heading[b-kxjou18336] {
        flex-direction: column;
    }

    .heading-actions[b-kxjou18336] {
        width: 100%;
    }

    .detail-stat-grid[b-kxjou18336],
    .department-progress-grid[b-kxjou18336] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .sla-report-page[b-kxjou18336] {
        padding: 12px;
    }

    .sla-report-page[b-kxjou18336]  .sla-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .sla-report-page[b-kxjou18336]  .hero-title {
        font-size: 2.35rem;
    }

    .hero-tags[b-kxjou18336] {
        display: grid;
    }

    .heading-actions[b-kxjou18336],
    .apply-row[b-kxjou18336] {
        align-items: stretch;
        flex-direction: column;
    }

    .heading-actions[b-kxjou18336]  .mud-button-root,
    .apply-row[b-kxjou18336]  .mud-button-root {
        width: 100%;
    }

    .bar-chart[b-kxjou18336] {
        gap: 6px;
        padding-left: 0;
        padding-right: 0;
    }

    .bar[b-kxjou18336] {
        width: min(42%,24px);
    }

    .bar span[b-kxjou18336] {
        display: none;
    }

    .trend-summary[b-kxjou18336],
    .detail-stat-grid[b-kxjou18336],
    .department-progress-grid[b-kxjou18336] {
        grid-template-columns: 1fr;
    }

    .overdue-stat-grid[b-kxjou18336] {
        grid-template-columns: 1fr;
    }

    .modal-backdrop[b-kxjou18336] {
        padding: 8px;
    }

    .modal-header[b-kxjou18336],
    .modal-body[b-kxjou18336],
    .modal-actions[b-kxjou18336] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .department-detail-head[b-kxjou18336] {
        align-items: flex-start;
        flex-wrap: wrap;
    }
}
/* /Components/Pages/06SystemManagement/GeneralSettings.razor.rz.scp.css */
.general-settings-page[b-xd8gy9fw05] {
    --gs-primary: var(--theme-primary);
    --gs-primary-dark: #115e59;
    --gs-primary-soft: #ecfdf5;
    --gs-green: #16a34a;
    --gs-blue: #2563eb;
    --gs-purple: #7c3aed;
    --gs-amber: #d97706;
    --gs-red: #dc2626;
    --gs-ink: #122126;
    --gs-muted: #64748b;
    --gs-line: #e2e8f0;
    --gs-surface: #ffffff;
    --gs-background: #f4f8f7;
    min-height: 100vh;
    padding: 24px;
    color: var(--gs-ink);
    font-family: "Kanit", sans-serif;
    background:
        radial-gradient(circle at 8% 4%, rgba(15, 118, 110, .08), transparent 24%),
        radial-gradient(circle at 96% 6%, rgba(37, 99, 235, .06), transparent 22%),
        var(--gs-background);
}

.general-settings-page :deep(.mud-typography)[b-xd8gy9fw05],
.general-settings-page :deep(.mud-input)[b-xd8gy9fw05],
.general-settings-page :deep(.mud-button-label)[b-xd8gy9fw05],
.general-settings-page :deep(.mud-select)[b-xd8gy9fw05],
.general-settings-page :deep(.mud-input-label)[b-xd8gy9fw05] {
    font-family: "Kanit", sans-serif !important;
}

.premium-hero[b-xd8gy9fw05] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 220px;
    padding: 34px 38px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 28px;
    background: linear-gradient(135deg, #063f3b 0%, var(--theme-primary) 52%, #168f7f 100%);
    box-shadow: 0 22px 55px rgba(15, 76, 70, .22);
}

.hero-decoration[b-xd8gy9fw05] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.hero-decoration-one[b-xd8gy9fw05] {
    width: 320px;
    height: 320px;
    top: -190px;
    right: 120px;
    border: 60px solid rgba(255, 255, 255, .06);
}

.hero-decoration-two[b-xd8gy9fw05] {
    width: 230px;
    height: 230px;
    right: -85px;
    bottom: -130px;
    background: rgba(255, 255, 255, .07);
}

.hero-content[b-xd8gy9fw05] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 24px;
}

.hero-icon-wrap[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 94px;
    height: 94px;
    flex: 0 0 94px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(255,255,255,.24), rgba(255,255,255,.10));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.36), 0 18px 34px rgba(0,0,0,.12);
    backdrop-filter: blur(12px);
}

.hero-icon-wrap :deep(.mud-icon-root)[b-xd8gy9fw05] {
    color: white;
    font-size: 48px;
}

.hero-copy[b-xd8gy9fw05] {
    max-width: 840px;
}

.hero-breadcrumb[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 9px;
    color: rgba(255,255,255,.82);
    font-size: 16px;
    font-weight: 500;
}

.hero-breadcrumb :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 19px;
}

.hero-copy h1[b-xd8gy9fw05] {
    margin: 0;
    color: white;
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.6px;
}

.hero-copy p[b-xd8gy9fw05] {
    max-width: 760px;
    margin: 12px 0 17px;
    color: rgba(255,255,255,.86);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;
}

.route-pill[b-xd8gy9fw05] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 13px;
    color: #dffef6;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(4, 47, 46, .34);
    font-size: 15px;
    font-weight: 600;
}

.route-pill :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 18px;
}

.hero-add-button[b-xd8gy9fw05] {
    position: relative;
    z-index: 1;
    min-width: 178px;
    min-height: 52px;
    padding-inline: 22px !important;
    color: var(--theme-dark) !important;
    border-radius: 16px !important;
    background: white !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.16) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}

.summary-grid[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 20px;
}

.summary-card[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 130px;
    padding: 21px;
    border: 1px solid var(--gs-line);
    border-radius: 22px !important;
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .05) !important;
}

.summary-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    border-radius: 18px;
}

.summary-icon :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 31px;
}

.summary-card-main .summary-icon[b-xd8gy9fw05] {
    color: var(--gs-primary);
    background: #ccfbf1;
}

.summary-card-active .summary-icon[b-xd8gy9fw05] {
    color: var(--gs-green);
    background: #dcfce7;
}

.summary-card-image .summary-icon[b-xd8gy9fw05] {
    color: var(--gs-blue);
    background: #dbeafe;
}

.summary-card-security .summary-icon[b-xd8gy9fw05] {
    color: var(--gs-purple);
    background: #ede9fe;
}

.summary-card > div:last-child[b-xd8gy9fw05] {
    display: grid;
}

.summary-card span[b-xd8gy9fw05] {
    color: var(--gs-muted);
    font-size: 16px;
    font-weight: 500;
}

.summary-card strong[b-xd8gy9fw05] {
    margin-top: 2px;
    color: var(--gs-ink);
    font-size: 31px;
    font-weight: 800;
    line-height: 1.15;
}

.summary-card small[b-xd8gy9fw05] {
    margin-top: 3px;
    color: #94a3b8;
    font-size: 14px;
}

.filter-panel[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 20px;
    padding: 22px 24px;
    border: 1px solid var(--gs-line);
    border-radius: 22px !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .04) !important;
}

.filter-title[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 270px;
}

.filter-icon[b-xd8gy9fw05],
.panel-title-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    color: var(--gs-primary);
    border-radius: 14px;
    background: var(--gs-primary-soft);
}

.filter-title h2[b-xd8gy9fw05],
.panel-header h2[b-xd8gy9fw05],
.editor-placeholder h2[b-xd8gy9fw05],
.editor-header h2[b-xd8gy9fw05] {
    margin: 0;
    color: var(--gs-ink);
    font-size: 22px;
    font-weight: 750;
}

.filter-title p[b-xd8gy9fw05],
.panel-header p[b-xd8gy9fw05] {
    margin: 2px 0 0;
    color: var(--gs-muted);
    font-size: 15px;
}

.filter-controls[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: minmax(280px, 1.7fr) minmax(180px, .9fr) minmax(150px, .7fr) auto;
    align-items: center;
    gap: 12px;
    width: min(1040px, 100%);
}

.large-field :deep(.mud-input-root)[b-xd8gy9fw05] {
    min-height: 52px;
    font-size: 17px;
}

.large-field :deep(.mud-input-label)[b-xd8gy9fw05] {
    font-size: 17px;
    font-weight: 500;
}

.large-field :deep(.mud-input-helper-text)[b-xd8gy9fw05] {
    font-size: 14px;
}

.large-field :deep(.mud-select-input)[b-xd8gy9fw05] {
    font-size: 17px;
}

.reset-button[b-xd8gy9fw05],
.cancel-button[b-xd8gy9fw05] {
    min-height: 50px;
    border-color: #cbd5e1 !important;
    border-radius: 13px !important;
    color: #475569 !important;
    background: white !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

.content-grid[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(390px, .8fr);
    align-items: start;
    gap: 20px;
    margin-top: 20px;
}

.settings-list-panel[b-xd8gy9fw05],
.editor-panel[b-xd8gy9fw05] {
    overflow: hidden;
    border: 1px solid var(--gs-line);
    border-radius: 24px !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .055) !important;
}

.editor-panel[b-xd8gy9fw05] {
    position: sticky;
    top: 18px;
    max-height: calc(100vh - 36px);
}

.panel-header[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    border-bottom: 1px solid #edf2f7;
}

.panel-title-row[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 13px;
}

.header-actions[b-xd8gy9fw05],
.row-actions[b-xd8gy9fw05],
.editor-footer-actions[b-xd8gy9fw05],
.confirm-actions[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soft-icon-button[b-xd8gy9fw05] {
    width: 46px !important;
    height: 46px !important;
    color: #475569 !important;
    border: 1px solid var(--gs-line) !important;
    border-radius: 13px !important;
    background: #f8fafc !important;
}

.add-button[b-xd8gy9fw05],
.save-button[b-xd8gy9fw05] {
    min-height: 48px;
    padding-inline: 19px !important;
    color: white !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, var(--gs-primary-dark), var(--gs-primary)) !important;
    box-shadow: 0 9px 20px rgba(15, 118, 110, .20) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.settings-list[b-xd8gy9fw05] {
    display: grid;
    gap: 14px;
    padding: 18px;
}

.setting-card[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 17px;
    padding: 18px;
    border: 1px solid #e6edf2;
    border-radius: 19px;
    background: white;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.setting-card:hover[b-xd8gy9fw05] {
    transform: translateY(-2px);
    border-color: #b9ded8;
    box-shadow: 0 12px 26px rgba(15, 118, 110, .08);
}

.setting-card-selected[b-xd8gy9fw05] {
    border-color: #4faaa0;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, .10), 0 12px 26px rgba(15, 118, 110, .08);
}

.setting-visual[b-xd8gy9fw05] {
    position: relative;
    display: grid;
    place-items: center;
    width: 92px;
    height: 92px;
    overflow: hidden;
    border: 1px solid #d9eee9;
    border-radius: 20px;
    background: linear-gradient(145deg, #effcf8, #e1f6f1);
}

.setting-visual img[b-xd8gy9fw05] {
    width: 100%;
    height: 100%;
    padding: 14px;
    object-fit: contain;
}

.setting-fallback[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--gs-primary);
}

.setting-fallback :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 43px;
}

.setting-topline[b-xd8gy9fw05],
.setting-footer[b-xd8gy9fw05],
.permission-row[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.setting-code-wrap[b-xd8gy9fw05],
.access-badges[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.setting-code[b-xd8gy9fw05] {
    color: var(--theme-primary);
    font-family: Consolas, monospace;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .3px;
}

.category-badge[b-xd8gy9fw05],
.status-badge[b-xd8gy9fw05],
.access-badges span[b-xd8gy9fw05] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 650;
}

.category-organization[b-xd8gy9fw05] { color: #1d4ed8; background: #dbeafe; }
.category-system[b-xd8gy9fw05] { color: var(--theme-primary); background: #ccfbf1; }
.category-security[b-xd8gy9fw05] { color: #6d28d9; background: #ede9fe; }
.category-notification[b-xd8gy9fw05] { color: #b45309; background: #fef3c7; }
.category-appearance[b-xd8gy9fw05] { color: #be185d; background: #fce7f3; }
.category-integration[b-xd8gy9fw05] { color: #0369a1; background: #e0f2fe; }

.status-badge[b-xd8gy9fw05] {
    flex: 0 0 auto;
}

.status-active[b-xd8gy9fw05] {
    color: #15803d;
    background: #dcfce7;
}

.status-inactive[b-xd8gy9fw05] {
    color: #64748b;
    background: #f1f5f9;
}

.status-dot[b-xd8gy9fw05] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: currentColor;
}

.setting-main h3[b-xd8gy9fw05] {
    margin: 8px 0 3px;
    color: var(--gs-ink);
    font-size: 21px;
    font-weight: 750;
    line-height: 1.35;
}

.setting-description[b-xd8gy9fw05] {
    margin: 0;
    color: var(--gs-muted);
    font-size: 16px;
    line-height: 1.65;
}

.setting-value-box[b-xd8gy9fw05] {
    display: grid;
    gap: 2px;
    margin-top: 12px;
    padding: 12px 14px;
    border-left: 4px solid #14b8a6;
    border-radius: 10px;
    background: #f0fdfa;
}

.setting-value-box span[b-xd8gy9fw05] {
    color: #5f7775;
    font-size: 13px;
}

.setting-value-box strong[b-xd8gy9fw05] {
    color: #134e4a;
    font-size: 16px;
    font-weight: 700;
    word-break: break-word;
}

.setting-meta-grid[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: 1fr 1.35fr .65fr;
    gap: 9px;
    margin-top: 12px;
}

.meta-item[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid #edf1f5;
    border-radius: 12px;
    background: #fafcfd;
}

.meta-item :deep(.mud-icon-root)[b-xd8gy9fw05] {
    flex: 0 0 auto;
    color: #64748b;
    font-size: 20px;
}

.meta-item div[b-xd8gy9fw05] {
    display: grid;
    min-width: 0;
}

.meta-item span[b-xd8gy9fw05] {
    color: #94a3b8;
    font-size: 12px;
}

.meta-item strong[b-xd8gy9fw05] {
    overflow: hidden;
    color: #334155;
    font-size: 14px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.permission-row[b-xd8gy9fw05] {
    align-items: flex-start;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed #dce4e9;
}

.permission-title[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #475569;
    font-size: 14px;
    font-weight: 650;
}

.permission-title :deep(.mud-icon-root)[b-xd8gy9fw05] {
    color: var(--gs-primary);
    font-size: 19px;
}

.access-badges[b-xd8gy9fw05] {
    justify-content: flex-end;
}

.access-badges span[b-xd8gy9fw05] {
    color: #475569;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.setting-footer[b-xd8gy9fw05] {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid #edf1f5;
}

.updated-info[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #94a3b8;
    font-size: 13px;
}

.updated-info :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 17px;
}

.edit-button[b-xd8gy9fw05] {
    min-height: 40px;
    color: var(--gs-primary) !important;
    border-color: #96d5cc !important;
    border-radius: 11px !important;
    font-size: 15px !important;
    font-weight: 650 !important;
}

.delete-icon-button[b-xd8gy9fw05] {
    width: 40px !important;
    height: 40px !important;
    color: #dc2626 !important;
    border: 1px solid #fecaca !important;
    border-radius: 11px !important;
    background: #fff7f7 !important;
}

.loading-state[b-xd8gy9fw05],
.empty-state[b-xd8gy9fw05] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 40px;
    text-align: center;
}

.loading-state strong[b-xd8gy9fw05],
.empty-state h3[b-xd8gy9fw05] {
    margin-top: 17px;
    color: var(--gs-ink);
    font-size: 21px;
    font-weight: 750;
}

.loading-state span[b-xd8gy9fw05],
.empty-state p[b-xd8gy9fw05] {
    margin: 5px 0 18px;
    color: var(--gs-muted);
    font-size: 16px;
}

.empty-icon[b-xd8gy9fw05],
.placeholder-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    color: var(--gs-primary);
    border-radius: 24px;
    background: var(--gs-primary-soft);
}

.empty-icon :deep(.mud-icon-root)[b-xd8gy9fw05],
.placeholder-icon :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 42px;
}

.editor-placeholder[b-xd8gy9fw05] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 660px;
    padding: 36px;
    text-align: center;
}

.editor-placeholder h2[b-xd8gy9fw05] {
    margin-top: 20px;
}

.editor-placeholder > p[b-xd8gy9fw05] {
    max-width: 390px;
    margin: 8px 0 22px;
    color: var(--gs-muted);
    font-size: 16px;
    line-height: 1.7;
}

.placeholder-features[b-xd8gy9fw05] {
    display: grid;
    gap: 10px;
    width: 100%;
    margin-bottom: 24px;
    padding: 17px;
    border: 1px solid #dcebe7;
    border-radius: 16px;
    background: var(--theme-bg);
    text-align: left;
}

.placeholder-features div[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #334155;
    font-size: 15px;
}

.placeholder-features :deep(.mud-icon-root)[b-xd8gy9fw05] {
    color: #16a34a;
    font-size: 20px;
}

.full-width-button[b-xd8gy9fw05] {
    width: 100%;
}

.editor-header[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px;
    border-bottom: 1px solid #e8eef2;
    background: linear-gradient(180deg, #ffffff, color-mix(in srgb, var(--theme-bg) 42%, white));
}

.editor-heading[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.editor-heading-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    color: white;
    border-radius: 15px;
    background: linear-gradient(145deg, var(--gs-primary-dark), #14b8a6);
    box-shadow: 0 8px 18px rgba(15,118,110,.18);
}

.editor-heading span[b-xd8gy9fw05] {
    color: var(--gs-primary);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.editor-scroll[b-xd8gy9fw05] {
    max-height: calc(100vh - 190px);
    overflow-y: auto;
    padding: 5px 22px 24px;
    scrollbar-width: thin;
    scrollbar-color: #b7c8c4 transparent;
}

.form-section[b-xd8gy9fw05] {
    display: grid;
    gap: 15px;
    padding: 21px 0;
    border-bottom: 1px solid #e9eef2;
}

.form-section:last-child[b-xd8gy9fw05] {
    border-bottom: 0;
}

.section-title[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 1px;
}

.section-number[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    color: var(--gs-primary-dark);
    border: 1px solid #b7e5de;
    border-radius: 12px;
    background: var(--gs-primary-soft);
    font-size: 14px;
    font-weight: 800;
}

.section-title h3[b-xd8gy9fw05] {
    margin: 0;
    color: var(--gs-ink);
    font-size: 18px;
    font-weight: 750;
}

.section-title p[b-xd8gy9fw05] {
    margin: 1px 0 0;
    color: #8492a4;
    font-size: 14px;
}

.switch-card[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid #dce9e6;
    border-radius: 15px;
    background: #f8fcfb;
}

.switch-copy[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    gap: 11px;
}

.switch-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #15803d;
    border-radius: 13px;
    background: #dcfce7;
}

.switch-copy > div:last-child[b-xd8gy9fw05] {
    display: grid;
}

.switch-copy strong[b-xd8gy9fw05] {
    color: #1e293b;
    font-size: 16px;
}

.switch-copy span[b-xd8gy9fw05] {
    color: #64748b;
    font-size: 14px;
}

.image-preview-card[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid #dce7ec;
    border-radius: 15px;
    background: #f8fafc;
}

.image-preview-box[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    overflow: hidden;
    border: 1px solid #d5e8e4;
    border-radius: 16px;
    background: white;
}

.image-preview-box img[b-xd8gy9fw05] {
    width: 100%;
    height: 100%;
    padding: 11px;
    object-fit: contain;
}

.image-preview-fallback[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #94a3b8;
}

.image-preview-fallback :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 36px;
}

.image-preview-info[b-xd8gy9fw05] {
    display: grid;
    min-width: 0;
}

.image-preview-info span[b-xd8gy9fw05] {
    color: #64748b;
    font-size: 13px;
}

.image-preview-info strong[b-xd8gy9fw05] {
    overflow: hidden;
    margin: 2px 0;
    color: var(--theme-primary);
    font-family: Consolas, monospace;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-preview-info small[b-xd8gy9fw05] {
    color: #94a3b8;
    font-size: 12px;
}

.operation-grid[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.permission-option[b-xd8gy9fw05] {
    display: grid;
    grid-template-columns: auto 38px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    min-height: 76px;
    padding: 9px 11px 9px 5px;
    cursor: pointer;
    border: 1px solid #e1e7eb;
    border-radius: 14px;
    background: white;
    transition: border-color .15s ease, background .15s ease;
}

.permission-option-selected[b-xd8gy9fw05] {
    border-color: #9fd8cf;
    background: #f0fdfa;
}

.operation-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: var(--gs-primary);
    border-radius: 10px;
    background: white;
}

.permission-option > span:last-child[b-xd8gy9fw05] {
    display: grid;
}

.permission-option strong[b-xd8gy9fw05] {
    color: #26333a;
    font-size: 15px;
}

.permission-option small[b-xd8gy9fw05] {
    color: #7b8997;
    font-size: 12px;
    line-height: 1.4;
}

.access-level-list[b-xd8gy9fw05] {
    display: grid;
    gap: 9px;
}

.access-level-card[b-xd8gy9fw05] {
    position: relative;
    display: grid;
    grid-template-columns: auto 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    min-height: 76px;
    padding: 9px 13px 9px 5px;
    cursor: pointer;
    border: 1px solid #e1e7eb;
    border-radius: 14px;
    background: white;
    transition: border-color .15s ease, background .15s ease, transform .15s ease;
}

.access-level-card:hover[b-xd8gy9fw05] {
    transform: translateX(2px);
    border-color: #b7dcd6;
}

.access-level-selected[b-xd8gy9fw05] {
    border-color: #80cabf;
    background: linear-gradient(90deg, #f0fdfa, #fbfffe);
}

.access-level-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: var(--gs-primary);
    border-radius: 12px;
    background: #e9f9f5;
}

.access-level-copy[b-xd8gy9fw05] {
    display: grid;
}

.access-level-copy strong[b-xd8gy9fw05] {
    color: #26333a;
    font-size: 15px;
}

.access-level-copy small[b-xd8gy9fw05] {
    color: #7b8997;
    font-size: 13px;
}

.access-check[b-xd8gy9fw05] {
    color: #16a34a !important;
    font-size: 21px !important;
}

.editor-footer[b-xd8gy9fw05] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    border-top: 1px solid #e1e8ec;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.footer-delete-button[b-xd8gy9fw05] {
    color: #dc2626 !important;
    font-size: 15px !important;
    font-weight: 650 !important;
}

.save-button[b-xd8gy9fw05] {
    min-width: 158px;
}

.save-button :deep(.mud-progress-circular)[b-xd8gy9fw05] {
    margin-right: 8px;
}

.confirm-overlay[b-xd8gy9fw05] {
    position: fixed;
    z-index: 1500;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(6px);
}

.confirm-dialog[b-xd8gy9fw05] {
    width: min(460px, 100%);
    padding: 30px;
    border-radius: 24px !important;
    text-align: center;
}

.confirm-icon[b-xd8gy9fw05] {
    display: grid;
    place-items: center;
    width: 74px;
    height: 74px;
    margin: 0 auto 16px;
    color: #dc2626;
    border-radius: 22px;
    background: #fee2e2;
}

.confirm-icon :deep(.mud-icon-root)[b-xd8gy9fw05] {
    font-size: 39px;
}

.confirm-dialog h2[b-xd8gy9fw05] {
    margin: 0;
    color: #17232b;
    font-size: 25px;
    font-weight: 800;
}

.confirm-dialog p[b-xd8gy9fw05] {
    margin: 8px 0 10px;
    color: #64748b;
    font-size: 17px;
    line-height: 1.6;
}

.confirm-code[b-xd8gy9fw05] {
    display: inline-flex;
    padding: 6px 12px;
    color: var(--theme-primary);
    border-radius: 999px;
    background: #ccfbf1;
    font-family: Consolas, monospace;
    font-size: 14px;
    font-weight: 700;
}

.confirm-warning[b-xd8gy9fw05] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 19px 0;
    padding: 13px;
    color: #92400e;
    border: 1px solid #fde68a;
    border-radius: 13px;
    background: #fffbeb;
    text-align: left;
    font-size: 14px;
}

.confirm-actions[b-xd8gy9fw05] {
    justify-content: center;
}

.confirm-actions :deep(.mud-button-root)[b-xd8gy9fw05] {
    min-width: 130px;
}

.confirm-delete-button[b-xd8gy9fw05] {
    min-height: 50px;
    color: white !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, #b91c1c, #dc2626) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

@media (max-width: 1500px) {
    .content-grid[b-xd8gy9fw05] {
        grid-template-columns: minmax(0, 1.4fr) minmax(370px, .8fr);
    }

    .setting-meta-grid[b-xd8gy9fw05] {
        grid-template-columns: 1fr 1fr;
    }

    .meta-item:last-child[b-xd8gy9fw05] {
        grid-column: span 2;
    }
}

@media (max-width: 1220px) {
    .summary-grid[b-xd8gy9fw05] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-panel[b-xd8gy9fw05] {
        align-items: flex-start;
        flex-direction: column;
    }

    .filter-controls[b-xd8gy9fw05] {
        width: 100%;
    }

    .content-grid[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
    }

    .editor-panel[b-xd8gy9fw05] {
        position: static;
        max-height: none;
    }

    .editor-scroll[b-xd8gy9fw05] {
        max-height: none;
    }
}

@media (max-width: 900px) {
    .general-settings-page[b-xd8gy9fw05] {
        padding: 15px;
    }

    .premium-hero[b-xd8gy9fw05] {
        align-items: flex-start;
        flex-direction: column;
        padding: 28px;
    }

    .hero-add-button[b-xd8gy9fw05] {
        width: 100%;
    }

    .filter-controls[b-xd8gy9fw05] {
        grid-template-columns: 1fr 1fr;
    }

    .search-field[b-xd8gy9fw05],
    .reset-button[b-xd8gy9fw05] {
        grid-column: span 2;
    }

    .setting-card[b-xd8gy9fw05] {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .setting-visual[b-xd8gy9fw05] {
        width: 72px;
        height: 72px;
    }
}

@media (max-width: 640px) {
    .general-settings-page[b-xd8gy9fw05] {
        padding: 10px;
    }

    .premium-hero[b-xd8gy9fw05] {
        min-height: unset;
        padding: 22px;
        border-radius: 22px;
    }

    .hero-content[b-xd8gy9fw05] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .hero-icon-wrap[b-xd8gy9fw05] {
        width: 72px;
        height: 72px;
        flex-basis: 72px;
        border-radius: 21px;
    }

    .hero-icon-wrap :deep(.mud-icon-root)[b-xd8gy9fw05] {
        font-size: 37px;
    }

    .hero-breadcrumb[b-xd8gy9fw05] {
        flex-wrap: wrap;
        font-size: 14px;
    }

    .hero-copy p[b-xd8gy9fw05] {
        font-size: 16px;
    }

    .summary-grid[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .summary-card[b-xd8gy9fw05] {
        min-height: 108px;
    }

    .filter-controls[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
    }

    .search-field[b-xd8gy9fw05],
    .reset-button[b-xd8gy9fw05] {
        grid-column: auto;
    }

    .panel-header[b-xd8gy9fw05],
    .setting-footer[b-xd8gy9fw05],
    .permission-row[b-xd8gy9fw05],
    .editor-footer[b-xd8gy9fw05] {
        align-items: stretch;
        flex-direction: column;
    }

    .header-actions[b-xd8gy9fw05],
    .editor-footer-actions[b-xd8gy9fw05] {
        width: 100%;
    }

    .header-actions .add-button[b-xd8gy9fw05],
    .editor-footer-actions :deep(.mud-button-root)[b-xd8gy9fw05] {
        flex: 1;
    }

    .setting-card[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
    }

    .setting-visual[b-xd8gy9fw05] {
        width: 78px;
        height: 78px;
    }

    .setting-topline[b-xd8gy9fw05] {
        align-items: flex-start;
        flex-direction: column;
    }

    .setting-meta-grid[b-xd8gy9fw05],
    .operation-grid[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
    }

    .meta-item:last-child[b-xd8gy9fw05] {
        grid-column: auto;
    }

    .access-badges[b-xd8gy9fw05] {
        justify-content: flex-start;
    }

    .updated-info[b-xd8gy9fw05] {
        line-height: 1.5;
    }

    .row-actions[b-xd8gy9fw05] {
        width: 100%;
    }

    .edit-button[b-xd8gy9fw05] {
        flex: 1;
    }

    .editor-scroll[b-xd8gy9fw05],
    .editor-header[b-xd8gy9fw05] {
        padding-inline: 16px;
    }

    .editor-footer[b-xd8gy9fw05] {
        padding: 13px 16px;
    }

    .image-preview-card[b-xd8gy9fw05] {
        grid-template-columns: 1fr;
    }

    .image-preview-box[b-xd8gy9fw05] {
        width: 100%;
        height: 150px;
    }
}
/* /Components/Pages/06SystemManagement/ModuleSettings.razor.rz.scp.css */
/*
  เวอร์ชันนี้ย้าย CSS ไปไว้ที่ wwwroot/css/module-settings.css แล้ว
  เนื่องจาก CSS isolation ไม่สามารถเข้าถึงโครงสร้างภายใน MudBlazor ได้ครบทุกส่วน
  กรุณาคัดลอกไฟล์ global CSS และคง <link> ใน ModuleSettings.razor
*/
/* /Components/Pages/06SystemManagement/PermissionDialog.razor.rz.scp.css */
/* Premium V3 ใช้ Global CSS ที่ wwwroot/css/permissions-premium-v3.css */
/* /Components/Pages/06SystemManagement/Permissions.razor.rz.scp.css */
/* Premium V3 ใช้ Global CSS ที่ wwwroot/css/permissions-premium-v3.css */
/* /Components/Pages/06SystemManagement/SystemUsers.razor.rz.scp.css */
.system-users-page[b-fu7ggjmn4r] {
    --su-primary: var(--theme-primary);
    --su-dark: #043c2f;
    --su-ink: var(--theme-ink);
    --su-muted: var(--theme-muted);
    --su-border: var(--theme-border);
    min-height: 100vh;
    padding: 20px;
    color: var(--su-ink);
    background:
        radial-gradient(circle at 100% 0%, rgba(23, 143, 103, .10), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--theme-bg) 58%, white) 0%, #edf5f1 100%);
    font-family: "Kanit", sans-serif;
}

.system-users-page[b-fu7ggjmn4r],
.system-users-page *[b-fu7ggjmn4r] {
    box-sizing: border-box;
}

.system-users-page[b-fu7ggjmn4r]  .users-hero {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 12%, rgba(255, 215, 105, .20), transparent 30%),
        linear-gradient(128deg, var(--theme-dark) 0%, var(--theme-primary) 58%, color-mix(in srgb, var(--theme-primary) 84%, var(--theme-light)) 100%);
    box-shadow: 0 24px 56px rgba(5, 63, 48, .25);
}

.system-users-page[b-fu7ggjmn4r]  .users-hero::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: .11;
    background-image:
        linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(90deg, transparent 0%, #000 58%);
}

.hero-layout[b-fu7ggjmn4r] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 34px;
    align-items: center;
}

.hero-kicker[b-fu7ggjmn4r] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 13px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: 1rem;
    font-weight: 650;
}

.system-users-page[b-fu7ggjmn4r]  .hero-title {
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: clamp(2.35rem, 4vw, 4rem);
    font-weight: 900;
    line-height: 1.14;
}

.system-users-page[b-fu7ggjmn4r]  .hero-subtitle {
    max-width: 900px;
    margin-top: 14px;
    color: rgba(255,255,255,.84);
    font-family: "Kanit", sans-serif;
    font-size: 1.19rem;
    line-height: 1.78;
}

.hero-tags[b-fu7ggjmn4r] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.hero-tags span[b-fu7ggjmn4r] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.10);
    font-size: .98rem;
    font-weight: 600;
}

.system-users-page[b-fu7ggjmn4r]  .hero-summary {
    padding: 23px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(15px);
}

.hero-summary-top[b-fu7ggjmn4r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-summary-icon[b-fu7ggjmn4r] {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: #5b4100;
    background: linear-gradient(135deg, #ffe5a0, #d5a42d);
}

.hero-summary-icon[b-fu7ggjmn4r]  .mud-icon-root {
    font-size: 2rem;
}

.mock-badge[b-fu7ggjmn4r] {
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    font-size: .82rem;
    font-weight: 800;
}

.system-users-page[b-fu7ggjmn4r]  .hero-summary-title {
    margin-top: 17px;
    color: #fff;
    font-family: "Kanit", sans-serif;
    font-size: 1.28rem;
    font-weight: 800;
}

.hero-summary-grid[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 16px 0 18px;
}

.hero-summary-grid div[b-fu7ggjmn4r] {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 15px;
    background: rgba(255,255,255,.09);
}

.hero-summary-grid small[b-fu7ggjmn4r] {
    color: rgba(255,255,255,.68);
    font-size: .88rem;
}

.hero-summary-grid strong[b-fu7ggjmn4r] {
    color: #fff;
    font-size: 1.07rem;
}

.system-users-page[b-fu7ggjmn4r]  .hero-summary .mud-button-root {
    min-height: 50px;
    border-radius: 14px;
    font-family: "Kanit", sans-serif;
    font-size: 1.06rem;
    font-weight: 800;
}

.system-users-page[b-fu7ggjmn4r]  .filter-panel,
.system-users-page[b-fu7ggjmn4r]  .users-panel,
.system-users-page[b-fu7ggjmn4r]  .loading-panel {
    margin-top: 20px;
    padding: 24px;
    border: 1px solid var(--su-border);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 12px 31px rgba(20,74,57,.08);
}

.panel-heading[b-fu7ggjmn4r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

.system-users-page[b-fu7ggjmn4r]  .panel-title {
    color: var(--su-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.45rem;
    font-weight: 850;
}

.system-users-page[b-fu7ggjmn4r]  .panel-subtitle {
    margin-top: 4px;
    color: var(--su-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}

.heading-actions[b-fu7ggjmn4r],
.apply-row[b-fu7ggjmn4r],
.view-actions[b-fu7ggjmn4r],
.row-actions[b-fu7ggjmn4r],
.modal-actions[b-fu7ggjmn4r],
.delete-actions[b-fu7ggjmn4r] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.apply-row[b-fu7ggjmn4r] {
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--su-border);
}

.result-note[b-fu7ggjmn4r] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #5f766d;
    font-size: 1rem;
}

.system-users-page[b-fu7ggjmn4r]  .large-input .mud-input-control {
    min-height: 58px;
}

.system-users-page[b-fu7ggjmn4r]  .large-input .mud-input-label,
.system-users-page[b-fu7ggjmn4r]  .large-input input,
.system-users-page[b-fu7ggjmn4r]  .large-input textarea,
.system-users-page[b-fu7ggjmn4r]  .large-input .mud-select-input {
    font-family: "Kanit", sans-serif;
    font-size: 1.03rem;
}

.system-users-page[b-fu7ggjmn4r]  .filter-panel .mud-button-root,
.system-users-page[b-fu7ggjmn4r]  .users-panel .mud-button-root,
.system-users-page[b-fu7ggjmn4r]  .modal-panel .mud-button-root,
.system-users-page[b-fu7ggjmn4r]  .delete-confirm .mud-button-root {
    min-height: 44px;
    border-radius: 13px;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.system-users-page[b-fu7ggjmn4r]  .loading-panel {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    color: var(--su-muted);
}

.summary-grid[b-fu7ggjmn4r] {
    margin-top: 1px;
}

.system-users-page[b-fu7ggjmn4r]  .summary-card {
    position: relative;
    display: grid;
    min-height: 150px;
    grid-template-columns: 58px 1fr;
    gap: 17px;
    align-items: center;
    overflow: hidden;
    padding: 22px;
    border: 1px solid var(--su-border);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 11px 27px rgba(21,72,56,.075);
}

.system-users-page[b-fu7ggjmn4r]  .summary-card::after {
    position: absolute;
    right: -35px;
    bottom: -48px;
    width: 112px;
    height: 112px;
    border-radius: 50%;
    content: "";
    background: var(--summary-soft);
}

.summary-green[b-fu7ggjmn4r] { --summary-main:var(--theme-primary); --summary-soft:color-mix(in srgb, var(--theme-light) 15%, white); }
.summary-blue[b-fu7ggjmn4r] { --summary-main:#286fb6; --summary-soft:#dfedff; }
.summary-purple[b-fu7ggjmn4r] { --summary-main:#7653aa; --summary-soft:#eee6fb; }
.summary-red[b-fu7ggjmn4r] { --summary-main:#c14e54; --summary-soft:#ffe3e5; }

.summary-icon[b-fu7ggjmn4r] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    color: var(--summary-main);
    background: var(--summary-soft);
}

.summary-icon[b-fu7ggjmn4r]  .mud-icon-root {
    font-size: 2rem;
}

.summary-card > div[b-fu7ggjmn4r] {
    position: relative;
    z-index: 1;
}

.system-users-page[b-fu7ggjmn4r]  .summary-title {
    color: #62776f;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 650;
}

.summary-value[b-fu7ggjmn4r] {
    margin-top: 3px;
    color: #1b4739;
    font-size: 2.25rem;
    font-weight: 900;
    line-height: 1.12;
}

.summary-card small[b-fu7ggjmn4r] {
    color: var(--theme-muted);
    font-size: .87rem;
}

.record-count[b-fu7ggjmn4r] {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 13px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 13%, white);
    font-size: .95rem;
    font-weight: 800;
}

.users-table-wrap[b-fu7ggjmn4r] {
    overflow-x: auto;
    border: 1px solid var(--su-border);
    border-radius: 18px;
}

.users-table[b-fu7ggjmn4r] {
    width: 100%;
    min-width: 1380px;
    border-collapse: collapse;
    background: #fff;
}

.users-table th[b-fu7ggjmn4r],
.users-table td[b-fu7ggjmn4r] {
    padding: 15px 14px;
    border-bottom: 1px solid #e8efec;
    vertical-align: middle;
    text-align: left;
}

.users-table th[b-fu7ggjmn4r] {
    color: #5f746c;
    background: var(--theme-bg);
    font-size: .94rem;
    font-weight: 800;
}

.users-table td[b-fu7ggjmn4r] {
    color: #35554a;
    font-size: .96rem;
}

.users-table tbody tr:hover[b-fu7ggjmn4r] {
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.user-name-cell[b-fu7ggjmn4r] {
    display: flex;
    min-width: 320px;
    align-items: center;
    gap: 12px;
}

.user-name-cell img[b-fu7ggjmn4r],
.user-avatar[b-fu7ggjmn4r] {
    display: grid;
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 16px;
}

.user-name-cell img[b-fu7ggjmn4r] {
    object-fit: cover;
}

.user-avatar[b-fu7ggjmn4r] {
    color: #fff;
    background: linear-gradient(135deg, #087356, #27a47b);
    font-size: 1rem;
    font-weight: 800;
}

.user-name-cell div[b-fu7ggjmn4r] {
    display: grid;
    gap: 3px;
}

.user-name-cell strong[b-fu7ggjmn4r] {
    color: var(--theme-ink);
    font-size: 1rem;
}

.user-name-cell small[b-fu7ggjmn4r] {
    color: #5f766d;
    font-size: .84rem;
}

.user-name-cell em[b-fu7ggjmn4r] {
    color: #81938c;
    font-size: .78rem;
    font-style: normal;
}

.cell-subtitle[b-fu7ggjmn4r] {
    display: block;
    margin-top: 4px;
    color: #778b82;
    font-size: .82rem;
}

.status-pill[b-fu7ggjmn4r],
.access-pill[b-fu7ggjmn4r] {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.status-active[b-fu7ggjmn4r] { color: var(--theme-primary); background: color-mix(in srgb, var(--theme-light) 15%, white); }
.status-inactive[b-fu7ggjmn4r] { color: #687a73; background: #edf2f0; }
.status-locked[b-fu7ggjmn4r] { color: #b23f45; background: #ffe2e4; }
.status-pending[b-fu7ggjmn4r] { color: #996405; background: #fff0ca; }

.access-viewer[b-fu7ggjmn4r] { color: #50716a; background: #e8f1ee; }
.access-officer[b-fu7ggjmn4r] { color: #286b9d; background: #e2f1fc; }
.access-supervisor[b-fu7ggjmn4r] { color: #4d659b; background: #e8edfa; }
.access-manager[b-fu7ggjmn4r] { color: #684492; background: #eee4fa; }
.access-administrator[b-fu7ggjmn4r] { color: #9b6504; background: #fff0c9; }
.access-superadministrator[b-fu7ggjmn4r] { color: #b23f45; background: #ffe2e4; }

.permission-count[b-fu7ggjmn4r] {
    display: flex;
    align-items: baseline;
    gap: 5px;
}

.permission-count strong[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    font-size: 1.28rem;
    font-weight: 900;
}

.permission-count span[b-fu7ggjmn4r] {
    color: var(--theme-muted);
    font-size: .84rem;
}

.row-actions[b-fu7ggjmn4r] {
    flex-wrap: nowrap;
}

.user-card[b-fu7ggjmn4r] {
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--su-border);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(21,73,57,.07);
    transition: transform .2s ease, box-shadow .2s ease;
}

.user-card:hover[b-fu7ggjmn4r] {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(21,73,57,.12);
}

.user-card-head[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 62px minmax(0,1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 18px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 20%, rgba(255,215,105,.16), transparent 28%),
        linear-gradient(135deg, var(--theme-dark), var(--theme-primary));
}

.profile-photo[b-fu7ggjmn4r] {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    overflow: hidden;
    border: 3px solid rgba(255,255,255,.25);
    border-radius: 18px;
    background: rgba(255,255,255,.12);
}

.profile-photo img[b-fu7ggjmn4r] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-photo span[b-fu7ggjmn4r] {
    font-size: 1.1rem;
    font-weight: 800;
}

.user-card-title[b-fu7ggjmn4r] {
    display: grid;
    gap: 4px;
}

.user-card-title strong[b-fu7ggjmn4r] {
    font-size: 1.08rem;
}

.user-card-title small[b-fu7ggjmn4r] {
    color: rgba(255,255,255,.72);
    font-size: .82rem;
}

.user-card-head .status-pill[b-fu7ggjmn4r] {
    box-shadow: 0 5px 14px rgba(0,0,0,.12);
}

.user-card-body[b-fu7ggjmn4r] {
    padding: 18px;
}

.access-level-banner[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    padding: 13px;
    border: 1px solid var(--theme-border);
    border-radius: 16px;
    color: #0a7053;
    background: #f1f9f6;
}

.access-level-banner[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 2rem;
}

.access-level-banner div[b-fu7ggjmn4r] {
    display: grid;
    gap: 2px;
}

.access-level-banner small[b-fu7ggjmn4r] {
    color: var(--theme-muted);
    font-size: .78rem;
}

.access-level-banner strong[b-fu7ggjmn4r] {
    color: var(--theme-ink);
    font-size: .98rem;
}

.user-info-grid[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 13px;
}

.user-info-grid > div[b-fu7ggjmn4r] {
    display: grid;
    gap: 4px;
    padding: 11px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.user-info-grid span[b-fu7ggjmn4r] {
    color: #788b83;
    font-size: .78rem;
}

.user-info-grid strong[b-fu7ggjmn4r] {
    color: #294c40;
    font-size: .88rem;
    line-height: 1.45;
}

.security-badges[b-fu7ggjmn4r] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 13px;
}

.security-badges span[b-fu7ggjmn4r] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 29px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 750;
}

.security-on[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 15%, white);
}

.security-off[b-fu7ggjmn4r] {
    color: #7b8a84;
    background: #edf2f0;
}

.user-card-actions[b-fu7ggjmn4r] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 18px;
    border-top: 1px solid var(--theme-border);
    background: #fbfcfc;
}

.modal-backdrop[b-fu7ggjmn4r] {
    position: fixed;
    z-index: 1600;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(4,34,26,.68);
    backdrop-filter: blur(6px);
}

.system-users-page[b-fu7ggjmn4r]  .modal-panel {
    width: min(1080px,100%);
    max-height: 94vh;
    overflow: auto;
    border-radius: 27px;
    background: #fff;
}

.system-users-page[b-fu7ggjmn4r]  .detail-modal {
    width: min(900px,100%);
}

.modal-header[b-fu7ggjmn4r] {
    position: sticky;
    z-index: 5;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding: 23px 25px;
    border-bottom: 1px solid var(--su-border);
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(13px);
}

.system-users-page[b-fu7ggjmn4r]  .modal-title {
    color: var(--su-ink);
    font-family: "Kanit", sans-serif;
    font-size: 1.65rem;
    font-weight: 850;
}

.system-users-page[b-fu7ggjmn4r]  .modal-subtitle {
    color: var(--su-muted);
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
}

.modal-body[b-fu7ggjmn4r] {
    padding: 24px 25px;
}

.form-section[b-fu7ggjmn4r] {
    margin-bottom: 20px;
    padding: 19px;
    border: 1px solid var(--su-border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.form-section:last-child[b-fu7ggjmn4r] {
    margin-bottom: 0;
}

.section-heading[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    margin-bottom: 17px;
}

.section-heading > span[b-fu7ggjmn4r] {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 15%, white);
}

.section-heading h3[b-fu7ggjmn4r] {
    margin: 0;
    color: var(--theme-ink);
    font-size: 1.18rem;
}

.section-heading p[b-fu7ggjmn4r] {
    margin: 3px 0 0;
    color: #72867e;
    font-size: .9rem;
}

.security-switch-grid[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 16px;
}

.security-switch-grid[b-fu7ggjmn4r]  .mud-switch {
    min-height: 58px;
    padding: 11px;
    border: 1px solid #e0e9e5;
    border-radius: 14px;
    background: #fff;
}

.security-switch-grid[b-fu7ggjmn4r]  .mud-typography {
    font-family: "Kanit", sans-serif;
    font-size: .96rem;
}

.permission-toolbar[b-fu7ggjmn4r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 13px;
    padding: 12px 14px;
    border-radius: 15px;
    color: #536f65;
    background: #eef7f3;
}

.permission-toolbar strong[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    font-size: 1.15rem;
}

.permission-toolbar > div[b-fu7ggjmn4r] {
    display: flex;
    gap: 6px;
}

.permission-modules[b-fu7ggjmn4r] {
    display: grid;
    gap: 13px;
}

.permission-module[b-fu7ggjmn4r] {
    overflow: hidden;
    border: 1px solid #dce8e3;
    border-radius: 17px;
    background: #fff;
}

.module-heading[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 11px;
    align-items: center;
    padding: 13px 15px;
    border-bottom: 1px solid #e3ece8;
    background: #f3f8f6;
}

.module-heading > span[b-fu7ggjmn4r] {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
    color: var(--theme-primary);
    background: #dff2eb;
}

.module-heading div[b-fu7ggjmn4r] {
    display: grid;
    gap: 2px;
}

.module-heading strong[b-fu7ggjmn4r] {
    color: #244a3e;
    font-size: 1rem;
}

.module-heading small[b-fu7ggjmn4r] {
    color: #74877f;
    font-size: .8rem;
}

.permission-list[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    padding: 13px;
}

.permission-option[b-fu7ggjmn4r] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-height: 88px;
    padding: 11px;
    border: 1px solid #e1eae6;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
}

.permission-selected[b-fu7ggjmn4r] {
    border-color: #8fc7b3;
    background: #f0faf6;
}

.permission-option > span[b-fu7ggjmn4r] {
    display: grid;
    gap: 3px;
}

.permission-option strong[b-fu7ggjmn4r] {
    color: #294c40;
    font-size: .92rem;
}

.permission-option small[b-fu7ggjmn4r] {
    color: var(--theme-muted);
    font-size: .8rem;
    line-height: 1.45;
}

.permission-option em[b-fu7ggjmn4r] {
    color: #8b9a94;
    font-size: .72rem;
    font-style: normal;
    word-break: break-all;
}

.image-preview-row[b-fu7ggjmn4r] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px dashed #a9cbbf;
    border-radius: 17px;
    background: #f6fbf9;
}

.form-image-preview[b-fu7ggjmn4r] {
    display: grid;
    width: 82px;
    height: 82px;
    flex: 0 0 auto;
    place-items: center;
    overflow: hidden;
    border-radius: 20px;
    color: var(--theme-primary);
    background: #dff2eb;
}

.form-image-preview img[b-fu7ggjmn4r] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.form-image-preview[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 2.7rem;
}

.image-preview-row > div:last-child[b-fu7ggjmn4r] {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.image-preview-row strong[b-fu7ggjmn4r] {
    color: #294c40;
}

.image-preview-row code[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    word-break: break-all;
}

.modal-actions[b-fu7ggjmn4r] {
    position: sticky;
    z-index: 5;
    bottom: 0;
    justify-content: flex-end;
    padding: 17px 25px;
    border-top: 1px solid var(--su-border);
    background: #fff;
}

.detail-profile-head[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 76px 1fr auto;
    gap: 15px;
    align-items: center;
    padding: 22px 25px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 18%, rgba(255,215,105,.17), transparent 27%),
        linear-gradient(135deg, var(--theme-dark), var(--theme-primary));
}

.detail-photo[b-fu7ggjmn4r] {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    overflow: hidden;
    border: 3px solid rgba(255,255,255,.24);
    border-radius: 21px;
    background: rgba(255,255,255,.12);
}

.detail-photo img[b-fu7ggjmn4r] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-photo span[b-fu7ggjmn4r] {
    font-size: 1.25rem;
    font-weight: 800;
}

.detail-profile-head > div:nth-child(2)[b-fu7ggjmn4r] {
    display: grid;
    gap: 5px;
}

.detail-profile-head strong[b-fu7ggjmn4r] {
    font-size: 1.25rem;
}

.detail-profile-head small[b-fu7ggjmn4r] {
    color: rgba(255,255,255,.75);
}

.detail-profile-head .access-pill[b-fu7ggjmn4r] {
    justify-self: start;
}

.detail-grid[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 11px;
}

.detail-grid > div[b-fu7ggjmn4r] {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid var(--su-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--theme-bg) 58%, white);
}

.detail-grid span[b-fu7ggjmn4r] {
    color: var(--theme-muted);
    font-size: .82rem;
}

.detail-grid strong[b-fu7ggjmn4r] {
    color: var(--theme-ink);
    font-size: .94rem;
    word-break: break-word;
}

.detail-security-grid[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 11px;
    margin-top: 16px;
}

.detail-security-grid > div[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 10px;
    align-items: center;
    padding: 13px;
    border-radius: 15px;
}

.detail-security-grid > div[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 1.75rem;
}

.detail-security-grid span[b-fu7ggjmn4r] {
    display: grid;
    gap: 3px;
}

.detail-security-grid strong[b-fu7ggjmn4r] {
    font-size: .9rem;
}

.detail-security-grid small[b-fu7ggjmn4r] {
    font-size: .77rem;
}

.detail-security-on[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    background: #e9f7f1;
}

.detail-security-off[b-fu7ggjmn4r] {
    color: #71827b;
    background: #f0f3f2;
}

.detail-security-warning[b-fu7ggjmn4r] {
    color: #996405;
    background: #fff4d8;
}

.detail-permission-section[b-fu7ggjmn4r],
.detail-note[b-fu7ggjmn4r] {
    margin-top: 17px;
    padding: 17px;
    border: 1px solid var(--su-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--theme-bg) 42%, white);
}

.detail-permission-heading h3[b-fu7ggjmn4r],
.detail-note h3[b-fu7ggjmn4r] {
    margin: 0;
    color: #244a3e;
    font-size: 1.08rem;
}

.detail-permission-heading p[b-fu7ggjmn4r],
.detail-note p[b-fu7ggjmn4r] {
    margin: 4px 0 0;
    color: var(--theme-muted);
    line-height: 1.6;
}

.granted-permissions[b-fu7ggjmn4r] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.granted-permissions span[b-fu7ggjmn4r] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 31px;
    padding: 5px 10px;
    border-radius: 999px;
    color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-light) 15%, white);
    font-size: .8rem;
    font-weight: 700;
}

.system-users-page[b-fu7ggjmn4r]  .delete-confirm {
    width: min(500px,100%);
    padding: 28px;
    border-radius: 25px;
    text-align: center;
    background: #fff;
}

.delete-icon[b-fu7ggjmn4r] {
    display: grid;
    width: 76px;
    height: 76px;
    margin: 0 auto 16px;
    place-items: center;
    border-radius: 23px;
    color: #b43e44;
    background: #ffe5e7;
}

.delete-icon[b-fu7ggjmn4r]  .mud-icon-root {
    font-size: 2.8rem;
}

.system-users-page[b-fu7ggjmn4r]  .delete-title {
    color: #2b4d42;
    font-family: "Kanit", sans-serif;
    font-size: 1.55rem;
    font-weight: 850;
}

.delete-confirm > p[b-fu7ggjmn4r] {
    margin: 12px 0;
    color: #62776f;
    font-size: 1rem;
    line-height: 1.65;
}

.delete-warning[b-fu7ggjmn4r] {
    padding: 12px;
    border: 1px solid #f2cfd2;
    border-radius: 14px;
    color: #9f4348;
    background: #fff4f5;
    font-size: .88rem;
    line-height: 1.55;
}

.delete-actions[b-fu7ggjmn4r] {
    justify-content: center;
    margin-top: 18px;
}

@media (max-width: 1180px) {
    .hero-layout[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }

    .system-users-page[b-fu7ggjmn4r]  .hero-summary {
        max-width: 560px;
    }

    .detail-grid[b-fu7ggjmn4r] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .detail-security-grid[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .panel-heading[b-fu7ggjmn4r] {
        flex-direction: column;
    }

    .heading-actions[b-fu7ggjmn4r] {
        width: 100%;
    }

    .security-switch-grid[b-fu7ggjmn4r],
    .permission-list[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .system-users-page[b-fu7ggjmn4r] {
        padding: 12px;
    }

    .system-users-page[b-fu7ggjmn4r]  .users-hero {
        padding: 28px 20px;
        border-radius: 24px;
    }

    .system-users-page[b-fu7ggjmn4r]  .hero-title {
        font-size: 2.35rem;
    }

    .hero-tags[b-fu7ggjmn4r] {
        display: grid;
    }

    .heading-actions[b-fu7ggjmn4r],
    .apply-row[b-fu7ggjmn4r],
    .modal-actions[b-fu7ggjmn4r] {
        align-items: stretch;
        flex-direction: column;
    }

    .heading-actions[b-fu7ggjmn4r]  .mud-button-root,
    .apply-row[b-fu7ggjmn4r]  .mud-button-root,
    .modal-actions[b-fu7ggjmn4r]  .mud-button-root {
        width: 100%;
    }

    .user-card-head[b-fu7ggjmn4r] {
        grid-template-columns: 62px 1fr;
    }

    .user-card-head > .status-pill[b-fu7ggjmn4r] {
        grid-column: 2;
        justify-self: start;
    }

    .user-info-grid[b-fu7ggjmn4r],
    .detail-grid[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }

    .permission-toolbar[b-fu7ggjmn4r] {
        align-items: flex-start;
        flex-direction: column;
    }

    .permission-toolbar > div[b-fu7ggjmn4r] {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .detail-profile-head[b-fu7ggjmn4r] {
        grid-template-columns: 76px 1fr;
    }

    .detail-profile-head > .status-pill[b-fu7ggjmn4r] {
        grid-column: 2;
        justify-self: start;
    }

    .modal-backdrop[b-fu7ggjmn4r] {
        padding: 8px;
    }

    .modal-header[b-fu7ggjmn4r],
    .modal-body[b-fu7ggjmn4r],
    .modal-actions[b-fu7ggjmn4r] {
        padding-left: 18px;
        padding-right: 18px;
    }
}
.profile-upload-card[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 20px;
    align-items: center;
    padding: 18px;
    border: 1px solid #cfe2da;
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(231,247,241,.92), rgba(255,255,255,.96));
}

.profile-upload-preview[b-fu7ggjmn4r] {
    position: relative;
    display: grid;
    width: 210px;
    height: 210px;
    place-items: center;
    overflow: hidden;
    border: 3px dashed #82bca7;
    border-radius: 24px;
    color: var(--theme-primary);
    background: #edf8f3;
    cursor: pointer;
}

.profile-upload-preview > img[b-fu7ggjmn4r] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-upload-preview[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 5rem;
    opacity: .72;
}

.profile-upload-overlay[b-fu7ggjmn4r] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: #fff;
    background: rgba(4, 62, 47, .70);
    opacity: 0;
    transition: opacity .2s ease;
    pointer-events: none;
}

.profile-upload-overlay[b-fu7ggjmn4r]  .mud-icon-root {
    font-size: 2rem;
}

.profile-upload-overlay span[b-fu7ggjmn4r] {
    font-size: 1rem;
    font-weight: 750;
}

.profile-upload-preview:hover .profile-upload-overlay[b-fu7ggjmn4r] {
    opacity: 1;
}

.profile-file-input[b-fu7ggjmn4r] {
    position: absolute;
    z-index: 3;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.profile-upload-info[b-fu7ggjmn4r] {
    display: grid;
    gap: 15px;
}

.profile-upload-info h4[b-fu7ggjmn4r] {
    margin: 0;
    color: var(--theme-ink);
    font-size: 1.2rem;
}

.profile-upload-info p[b-fu7ggjmn4r] {
    margin: 5px 0 0;
    color: var(--theme-muted);
    font-size: .94rem;
}

.profile-upload-actions[b-fu7ggjmn4r] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.profile-select-button[b-fu7ggjmn4r] {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 17px;
    border-radius: 13px;
    color: #fff;
    background: var(--theme-primary);
    box-shadow: 0 7px 16px rgba(8,104,79,.18);
    cursor: pointer;
    font-family: "Kanit", sans-serif;
    font-size: 1rem;
    font-weight: 750;
    transition: transform .18s ease, background .18s ease;
}

.profile-select-button:hover[b-fu7ggjmn4r] {
    background: #075a44;
    transform: translateY(-1px);
}

.selected-image-info[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.selected-image-info > span[b-fu7ggjmn4r] {
    display: grid;
    gap: 4px;
    padding: 11px 13px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--theme-border);
}

.selected-image-info strong[b-fu7ggjmn4r] {
    color: #60766e;
    font-size: .8rem;
}

.selected-image-info em[b-fu7ggjmn4r] {
    color: var(--theme-ink);
    font-size: .92rem;
    font-style: normal;
    word-break: break-all;
}

.image-location-row[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 12px;
    align-items: center;
    padding: 13px 15px;
    border: 1px dashed #a9cbbf;
    border-radius: 16px;
    color: var(--theme-primary);
    background: #f6fbf9;
}

.image-location-row[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 2rem;
}

.image-location-row > div[b-fu7ggjmn4r] {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.image-location-row strong[b-fu7ggjmn4r] {
    color: #294c40;
}

.image-location-row code[b-fu7ggjmn4r] {
    color: var(--theme-primary);
    word-break: break-all;
}

@media (max-width: 720px) {
    .profile-upload-card[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }

    .profile-upload-preview[b-fu7ggjmn4r] {
        width: min(100%, 280px);
        height: 280px;
        justify-self: center;
    }

    .selected-image-info[b-fu7ggjmn4r] {
        grid-template-columns: 1fr;
    }

    .profile-upload-actions[b-fu7ggjmn4r] {
        align-items: stretch;
        flex-direction: column;
    }

    .profile-select-button[b-fu7ggjmn4r] {
        width: 100%;
    }
}
.address-form-section[b-fu7ggjmn4r] {
    position: relative;
    overflow: hidden;
}

.address-form-section[b-fu7ggjmn4r]::after {
    position: absolute;
    right: -75px;
    bottom: -90px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    content: "";
    pointer-events: none;
    background: radial-gradient(
        circle,
        rgba(20, 142, 102, .09),
        transparent 68%);
}

.address-form-section > *[b-fu7ggjmn4r] {
    position: relative;
    z-index: 1;
}

.address-api-note[b-fu7ggjmn4r] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
    padding: 13px 15px;
    border: 1px solid #cfe3da;
    border-radius: 16px;
    color: var(--theme-primary);
    background: linear-gradient(135deg, #eff9f5, #f9fcfb);
}

.address-api-note[b-fu7ggjmn4r] >  .mud-icon-root {
    font-size: 2rem;
}

.address-api-note > div[b-fu7ggjmn4r] {
    display: grid;
    gap: 3px;
}

.address-api-note strong[b-fu7ggjmn4r] {
    color: #244a3e;
    font-size: .96rem;
}

.address-api-note span[b-fu7ggjmn4r] {
    color: #6c8178;
    font-size: .84rem;
}

.postal-code-input[b-fu7ggjmn4r]  input {
    color: #075f48;
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: .05em;
}

.detail-address-wide[b-fu7ggjmn4r] {
    grid-column: 1 / -1;
}

.detail-address-wide strong[b-fu7ggjmn4r] {
    line-height: 1.65;
}

@media (max-width: 720px) {
    .address-api-note[b-fu7ggjmn4r] {
        grid-template-columns: 42px 1fr;
    }
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
.dashboard-shell[b-a77a3yhxsm] {
    --luxury-ink: #0d1c18;
    --luxury-ink-soft: color-mix(in srgb, var(--theme-ink) 84%, white);
    --luxury-emerald: var(--theme-primary);
    --luxury-emerald-deep: var(--theme-dark);
    --luxury-emerald-soft: #eaf5f0;
    --luxury-gold: #c9a35c;
    --luxury-gold-deep: #9c7430;
    --luxury-gold-soft: #f8f0df;
    --luxury-cream: #fbfaf6;
    --luxury-surface: rgba(255, 255, 255, .94);
    --luxury-muted: var(--theme-muted);
    --luxury-border: rgba(27, 78, 61, .12);
    --luxury-shadow: 0 24px 64px rgba(8, 49, 38, .10);
    --luxury-shadow-soft: 0 14px 34px rgba(8, 49, 38, .07);

    position: relative;
    min-height: 100vh;
    padding: 28px 30px 52px;
    overflow: hidden;
    background-color: var(--theme-bg);
    background-image:
        radial-gradient(circle at 4% -4%, rgba(215, 181, 112, .23), transparent 28%),
        radial-gradient(circle at 102% 4%, rgba(4, 73, 53, .19), transparent 31%),
        linear-gradient(145deg, rgba(255, 255, 255, .55), transparent 42%),
        linear-gradient(180deg, #f8f6ef 0%, #f0f5f2 42%, var(--theme-border) 100%);
    font-family: 'Kanit', sans-serif;
}

/* เธ•เธฑเธงเธ„เธฃเธญเธšเธˆเธฃเธดเธ‡เธ‚เธญเธ‡ Scoped CSS โ€” เธ—เธณเนƒเธซเน‰เธชเน„เธ•เธฅเนŒ MudBlazor เธ—เธณเธ‡เธฒเธ™เธ„เธฃเธš */
.dashboard-shell[b-a77a3yhxsm]  .dashboard-page {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1720px;
    min-height: auto;
    margin: 0 auto;
    padding: 0 !important;
    overflow: visible;
    background: transparent !important;
}

.dashboard-shell[b-a77a3yhxsm]::after {
    content: "";
    position: fixed;
    right: -160px;
    bottom: -190px;
    width: 520px;
    height: 520px;
    z-index: 0;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(
        circle,
        rgba(201, 163, 92, .13) 0%,
        rgba(11, 91, 69, .08) 40%,
        transparent 70%
    );
    filter: blur(8px);
}

.dashboard-shell[b-a77a3yhxsm]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .38;
    background-image:
        linear-gradient(rgba(11, 91, 69, .022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 91, 69, .022) 1px, transparent 1px);
    background-size: 32px 32px;
}

.dashboard-shell[b-a77a3yhxsm]  .dashboard-page > * {
    position: relative;
    z-index: 1;
}

.dashboard-shell[b-a77a3yhxsm]  * {
    font-family: 'Kanit', sans-serif;
}

/* =========================
   HERO / EXECUTIVE HEADER
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .hero-panel {
    position: relative;
    min-height: 320px;
    padding: 38px 42px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: 34px;
    color: #fff;
    background:
        linear-gradient(118deg, rgba(3, 36, 28, .99) 0%, rgba(6, 67, 51, .97) 55%, rgba(12, 105, 79, .92) 100%);
    box-shadow:
        0 32px 76px rgba(3, 54, 40, .28),
        inset 0 1px 0 rgba(255, 255, 255, .12);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(201, 163, 92, .22), transparent 22%),
        linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, .025) 56%, rgba(255, 255, 255, .055) 100%);
    pointer-events: none;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .04), transparent 30%),
        repeating-linear-gradient(
            135deg,
            rgba(255, 255, 255, .018) 0,
            rgba(255, 255, 255, .018) 1px,
            transparent 1px,
            transparent 14px
        );
}

.dashboard-shell[b-a77a3yhxsm]  .hero-gold-line {
    position: absolute;
    top: 0;
    left: 44px;
    width: 210px;
    height: 4px;
    border-radius: 0 0 8px 8px;
    background: linear-gradient(90deg, transparent, #d9ba78 18%, #f1daaa 52%, #b88b3d 84%, transparent);
    box-shadow: 0 0 26px rgba(220, 181, 105, .45);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-orbit {
    position: absolute;
    border: 1px solid rgba(235, 209, 155, .12);
    border-radius: 50%;
    pointer-events: none;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-orbit-one {
    width: 420px;
    height: 420px;
    right: -115px;
    top: -188px;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-orbit-two {
    width: 260px;
    height: 260px;
    right: 170px;
    bottom: -190px;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-content {
    position: relative;
    z-index: 2;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-topline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    padding: 8px 14px 8px 9px;
    border: 1px solid rgba(229, 203, 145, .24);
    border-radius: 999px;
    color: #f5e7c7;
    background: rgba(255, 255, 255, .075);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    backdrop-filter: blur(14px);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-badge-icon {
    display: grid;
    width: 35px;
    height: 35px;
    place-items: center;
    border-radius: 50%;
    color: #f4dfaf;
    background: linear-gradient(145deg, rgba(205, 164, 87, .32), rgba(205, 164, 87, .12));
}

.dashboard-shell[b-a77a3yhxsm]  .hero-badge > span:last-child {
    display: flex;
    flex-direction: column;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1.15;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-badge small {
    margin-bottom: 2px;
    color: rgba(255, 255, 255, .52);
    font-size: .56rem;
    letter-spacing: .14em;
}

.dashboard-shell[b-a77a3yhxsm]  .system-online {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid rgba(102, 224, 166, .18);
    border-radius: 999px;
    color: #a8e8c7;
    background: rgba(23, 138, 93, .16);
    font-size: .74rem;
    font-weight: 500;
}

.dashboard-shell[b-a77a3yhxsm]  .online-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #65dda6;
    box-shadow: 0 0 0 5px rgba(101, 221, 166, .10), 0 0 16px rgba(101, 221, 166, .55);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-title-wrap {
    display: flex;
    align-items: center;
    gap: 20px;
}

.dashboard-shell[b-a77a3yhxsm]  .municipal-emblem {
    display: grid;
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    place-items: center;
    border: 1px solid rgba(236, 207, 147, .30);
    border-radius: 22px;
    color: #f0d79f;
    background:
        linear-gradient(145deg, rgba(214, 178, 106, .20), rgba(214, 178, 106, .06));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .09),
        0 14px 34px rgba(0, 0, 0, .16);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-title {
    max-width: 850px;
    margin: 0 0 7px !important;
    color: #fff !important;
    font-size: clamp(2rem, 3vw, 3rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.025em;
    line-height: 1.22 !important;
    text-shadow: 0 6px 24px rgba(0, 0, 0, .14);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-subtitle {
    max-width: 760px;
    color: rgba(255, 255, 255, .68) !important;
    font-size: 1rem !important;
    font-weight: 300 !important;
    line-height: 1.7 !important;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 10px;
    color: rgba(255, 255, 255, .72);
    background: rgba(255, 255, 255, .045);
    font-size: .80rem;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-control-panel {
    padding: 20px;
    border: 1px solid rgba(230, 206, 157, .17);
    border-radius: 24px;
    background:
        linear-gradient(155deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .055));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 22px 45px rgba(0, 0, 0, .14);
    backdrop-filter: blur(18px);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-control-caption {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 13px;
    color: #fff;
    font-size: .90rem;
    font-weight: 600;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-control-caption small {
    color: rgba(236, 211, 162, .65);
    font-size: .58rem;
    letter-spacing: .12em;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-date {
    flex: 1;
    min-width: 0;
    border-radius: 15px;
    background: rgba(255, 255, 255, .96);
}

.dashboard-shell[b-a77a3yhxsm]  .refresh-button {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(235, 208, 153, .28) !important;
    border-radius: 15px !important;
    color: #f4dfb1 !important;
    background: linear-gradient(145deg, rgba(205, 164, 87, .24), rgba(205, 164, 87, .10)) !important;
}

.dashboard-shell[b-a77a3yhxsm]  .refresh-button:hover {
    transform: rotate(8deg);
    background: rgba(205, 164, 87, .28) !important;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats > div {
    padding: 10px 8px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 13px;
    text-align: center;
    background: rgba(0, 0, 0, .10);
}

.dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats span {
    display: block;
    overflow: hidden;
    color: rgba(255, 255, 255, .52);
    font-size: .64rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats strong {
    display: block;
    margin-top: 2px;
    color: #f4ddb0;
    font-size: 1.20rem;
    font-weight: 700;
}

.dashboard-shell[b-a77a3yhxsm]  .loading-line {
    margin: -5px 26px 0;
    border-radius: 0 0 12px 12px;
}


/* เนเธˆเน‰เธ‡เน€เธ•เธทเธญเธ™เธเธฒเธ™เธ‚เน‰เธญเธกเธนเธฅ: เธฅเธ”เนเธ–เธšเนเธ”เธ‡เน€เธ•เน‡เธกเธˆเธญเนƒเธซเน‰เน€เธ›เน‡เธ™เธเธฅเนˆเธญเธ‡เธชเธธเธ เธฒเธž */
.dashboard-shell[b-a77a3yhxsm]  .dashboard-error {
    overflow: hidden;
    padding: 4px 8px;
    border: 1px solid rgba(172, 68, 58, .20) !important;
    border-left: 4px solid #b94b43 !important;
    border-radius: 16px !important;
    color: #7f302c !important;
    background: rgba(255, 250, 248, .96) !important;
    box-shadow: 0 12px 30px rgba(112, 48, 42, .08);
}

.dashboard-shell[b-a77a3yhxsm]  .dashboard-error .mud-alert-icon {
    color: #b94b43 !important;
}

.dashboard-shell[b-a77a3yhxsm]  .dashboard-error .mud-alert-message {
    font-size: .84rem;
    font-weight: 500;
    line-height: 1.55;
}

/* =========================
   KPI CARDS
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .kpi-grid {
    margin-top: 12px;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-card {
    position: relative;
    display: flex;
    min-height: 178px;
    padding: 23px;
    overflow: hidden;
    border: 1px solid var(--luxury-border);
    border-radius: 24px;
    color: var(--luxury-emerald);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .99), rgba(250, 252, 250, .94));
    box-shadow: var(--luxury-shadow-soft);
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24px;
    width: 78px;
    height: 3px;
    border-radius: 0 0 5px 5px;
    background: linear-gradient(90deg, transparent, currentColor, transparent);
    opacity: .65;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-card::after {
    content: "";
    position: absolute;
    width: 135px;
    height: 135px;
    right: -68px;
    top: -68px;
    border-radius: 50%;
    background: currentColor;
    opacity: .055;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-card:hover {
    transform: translateY(-6px);
    border-color: rgba(201, 163, 92, .28);
    box-shadow:
        0 24px 52px rgba(8, 49, 38, .13),
        inset 0 1px 0 rgba(255, 255, 255, .90);
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-card.green { color: #0b7857; }
.dashboard-shell[b-a77a3yhxsm]  .kpi-card.blue  { color: #2879ad; }
.dashboard-shell[b-a77a3yhxsm]  .kpi-card.gold  { color: #b9862f; }
.dashboard-shell[b-a77a3yhxsm]  .kpi-card.red   { color: #cf5050; }

.dashboard-shell[b-a77a3yhxsm]  .kpi-icon-wrap {
    display: grid;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    place-items: center;
    margin-right: 17px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 19px;
    color: white;
    background:
        linear-gradient(145deg, currentColor, color-mix(in srgb, currentColor 72%, #000));
    box-shadow:
        0 13px 25px color-mix(in srgb, currentColor 25%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .22);
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-content {
    flex: 1;
    min-width: 0;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-label {
    color: #697970 !important;
    font-size: .88rem !important;
    font-weight: 500 !important;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-value-row {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin-top: 5px;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-value {
    color: var(--luxury-ink) !important;
    font-size: 2.05rem !important;
    font-weight: 700 !important;
    letter-spacing: -.04em;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-unit {
    color: #7b8982;
    font-size: .80rem;
}

.dashboard-shell[b-a77a3yhxsm]  .kpi-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-top: 11px;
    color: #7e8c85;
    font-size: .75rem;
}

.dashboard-shell[b-a77a3yhxsm]  .trend-chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px 8px;
    border: 1px solid rgba(11, 91, 69, .08);
    border-radius: 999px;
    color: var(--luxury-emerald);
    background: var(--luxury-emerald-soft);
    font-weight: 600;
}

/* =========================
   LUXURY CONTENT CARDS
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .section-grid {
    margin-top: 10px;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-card {
    position: relative;
    padding: 26px;
    overflow: hidden;
    border: 1px solid var(--luxury-border);
    border-radius: 26px;
    background: var(--luxury-surface);
    box-shadow: var(--luxury-shadow-soft);
}

.dashboard-shell[b-a77a3yhxsm]  .luxury-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 28px;
    width: 94px;
    height: 3px;
    border-radius: 0 0 5px 5px;
    background: linear-gradient(90deg, transparent, var(--luxury-gold), transparent);
    opacity: .75;
}

.dashboard-shell[b-a77a3yhxsm]  .luxury-card::after {
    content: "";
    position: absolute;
    width: 190px;
    height: 190px;
    right: -120px;
    bottom: -130px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(201, 163, 92, .08), transparent 68%);
    pointer-events: none;
}

.dashboard-shell[b-a77a3yhxsm]  .h-100 {
    height: 100%;
}

.dashboard-shell[b-a77a3yhxsm]  .section-header {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 22px;
}

.dashboard-shell[b-a77a3yhxsm]  .section-title {
    color: var(--luxury-ink) !important;
    font-weight: 650 !important;
    letter-spacing: -.015em;
}

.dashboard-shell[b-a77a3yhxsm]  .section-subtitle {
    margin-top: 4px !important;
    color: var(--luxury-muted) !important;
    line-height: 1.55 !important;
}

.dashboard-shell[b-a77a3yhxsm]  .dashboard-chart {
    position: relative;
    z-index: 2;
    margin-top: 4px;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-chart-legend {
    color: #65756d;
    font-size: .78rem;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-chip {
    border-radius: 999px;
    font-weight: 500;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-chip-outlined.mud-chip-color-success {
    border-color: rgba(201, 163, 92, .34);
    color: var(--luxury-gold-deep);
    background: rgba(248, 240, 223, .62);
}

.dashboard-shell[b-a77a3yhxsm]  .donut-total {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 8px;
    margin-top: -10px;
    color: var(--luxury-muted);
}

.dashboard-shell[b-a77a3yhxsm]  .donut-total strong {
    color: var(--luxury-emerald-deep);
    font-size: 1.45rem;
    font-weight: 700;
}

/* =========================
   SERVICE MODULES
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .module-card {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 112px;
    align-items: center;
    padding: 16px 42px 16px 16px;
    overflow: hidden;
    border: 1px solid rgba(18, 72, 55, .10);
    border-radius: 19px;
    text-align: left;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(247, 250, 248, .94));
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(8, 49, 38, .035);
    transition: all .2s ease;
}

.dashboard-shell[b-a77a3yhxsm]  .module-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    background: linear-gradient(110deg, rgba(201, 163, 92, .07), transparent 48%);
    transition: opacity .2s ease;
}

.dashboard-shell[b-a77a3yhxsm]  .module-card:hover {
    transform: translateY(-4px);
    border-color: rgba(201, 163, 92, .34);
    box-shadow: 0 17px 34px rgba(8, 49, 38, .10);
}

.dashboard-shell[b-a77a3yhxsm]  .module-card:hover::before {
    opacity: 1;
}

.dashboard-shell[b-a77a3yhxsm]  .module-icon {
    position: relative;
    z-index: 1;
    display: grid;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    place-items: center;
    margin-right: 14px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 18px;
    color: white;
    background: linear-gradient(145deg, #0e7054, #074735);
    box-shadow:
        0 12px 22px rgba(7, 71, 53, .20),
        inset 0 1px 0 rgba(255, 255, 255, .22);
}

.dashboard-shell[b-a77a3yhxsm]  .module-icon.orange { background: linear-gradient(145deg, #ee9b43, #b8671e); }
.dashboard-shell[b-a77a3yhxsm]  .module-icon.red    { background: linear-gradient(145deg, #df6969, #ad3e3e); }
.dashboard-shell[b-a77a3yhxsm]  .module-icon.blue   { background: linear-gradient(145deg, #4c94c7, #286b9c); }
.dashboard-shell[b-a77a3yhxsm]  .module-icon.gold   { background: linear-gradient(145deg, #d4ad63, #9b722c); }
.dashboard-shell[b-a77a3yhxsm]  .module-icon.purple { background: linear-gradient(145deg, #9176c7, #624d98); }
.dashboard-shell[b-a77a3yhxsm]  .module-icon.teal   { background: linear-gradient(145deg, #31a59d, #16766f); }

.dashboard-shell[b-a77a3yhxsm]  .module-info {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
}

.dashboard-shell[b-a77a3yhxsm]  .module-info strong {
    color: var(--luxury-ink);
    font-size: .97rem;
    font-weight: 600;
}

.dashboard-shell[b-a77a3yhxsm]  .module-info small {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 4px;
    color: var(--luxury-muted);
    font-size: .75rem;
    line-height: 1.4;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dashboard-shell[b-a77a3yhxsm]  .module-count {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 58px;
    flex-direction: column;
    align-items: flex-end;
    margin-left: 8px;
}

.dashboard-shell[b-a77a3yhxsm]  .module-count strong {
    color: var(--luxury-emerald-deep);
    font-size: 1.22rem;
    font-weight: 700;
}

.dashboard-shell[b-a77a3yhxsm]  .module-count small {
    color: #88948e;
    font-size: .66rem;
}

.dashboard-shell[b-a77a3yhxsm]  .module-arrow {
    position: absolute;
    right: 12px;
    color: #a1aea8;
}

.dashboard-shell[b-a77a3yhxsm]  .luxury-text-button {
    border-radius: 12px !important;
    color: var(--luxury-gold-deep) !important;
    font-weight: 600 !important;
}

/* =========================
   TABLE
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .status-filter {
    width: 180px;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table {
    position: relative;
    z-index: 2;
    overflow: hidden;
    border: 1px solid rgba(17, 72, 55, .08);
    border-radius: 18px;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table ::deep .mud-table-container {
    border-radius: 18px;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table ::deep .mud-table-head {
    background:
        linear-gradient(180deg, #f6f8f6 0%, #eef4f1 100%);
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table ::deep .mud-table-head .mud-table-cell {
    color: #42534b;
    font-size: .80rem;
    font-weight: 600;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table ::deep .mud-table-cell {
    padding: 15px 12px;
    border-bottom-color: #edf1ef;
    color: #415049;
    font-size: .84rem;
}

.dashboard-shell[b-a77a3yhxsm]  .premium-table ::deep .mud-table-row:hover {
    background: linear-gradient(90deg, rgba(11, 91, 69, .045), rgba(201, 163, 92, .035));
}

.dashboard-shell[b-a77a3yhxsm]  .request-no {
    color: var(--luxury-emerald-deep);
    font-weight: 650;
}

.dashboard-shell[b-a77a3yhxsm]  .request-title {
    max-width: 290px;
    overflow: hidden;
    color: var(--luxury-ink);
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dashboard-shell[b-a77a3yhxsm]  .request-subtitle {
    margin-top: 3px;
    color: var(--luxury-muted);
    font-size: .73rem;
}

.dashboard-shell[b-a77a3yhxsm]  .table-empty {
    padding: 45px;
    text-align: center;
    color: var(--luxury-muted);
}

/* =========================
   ALERTS
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .alert-card {
    min-height: 100%;
}

.dashboard-shell[b-a77a3yhxsm]  .live-dot {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border: 1px solid rgba(211, 74, 74, .10);
    border-radius: 999px;
    color: #c74444;
    background: #fff0f0;
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.dashboard-shell[b-a77a3yhxsm]  .live-dot::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 6px;
    border-radius: 50%;
    background: #df4c4c;
    box-shadow: 0 0 0 4px rgba(223, 76, 76, .10);
}

.dashboard-shell[b-a77a3yhxsm]  .alert-list {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-item {
    display: flex;
    width: 100%;
    align-items: center;
    padding: 14px;
    border: 1px solid rgba(17, 72, 55, .08);
    border-radius: 18px;
    text-align: left;
    background: linear-gradient(145deg, #fff, #f9fbfa);
    cursor: pointer;
    transition: all .18s ease;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-item:hover {
    transform: translateX(3px);
    border-color: rgba(201, 163, 92, .28);
    box-shadow: 0 10px 22px rgba(8, 49, 38, .07);
}

.dashboard-shell[b-a77a3yhxsm]  .alert-icon {
    display: grid;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    place-items: center;
    margin-right: 12px;
    border-radius: 14px;
    color: #b43f3f;
    background: linear-gradient(145deg, #fff2f2, #fbe4e4);
}

.dashboard-shell[b-a77a3yhxsm]  .alert-item.warning .alert-icon {
    color: #a16a13;
    background: linear-gradient(145deg, #fff8e8, #faedcb);
}

.dashboard-shell[b-a77a3yhxsm]  .alert-item.info .alert-icon {
    color: #2c6f9e;
    background: linear-gradient(145deg, #eef8ff, #dceef8);
}

.dashboard-shell[b-a77a3yhxsm]  .alert-content {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-content strong {
    color: var(--luxury-ink);
    font-size: .88rem;
    font-weight: 600;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-content small {
    overflow: hidden;
    margin: 3px 0;
    color: var(--luxury-muted);
    font-size: .73rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-content span {
    color: #96a19b;
    font-size: .65rem;
}

.dashboard-shell[b-a77a3yhxsm]  .alert-count {
    display: grid;
    min-width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 11px;
    color: white;
    background: linear-gradient(145deg, #df5a5a, #b73d3d);
    box-shadow: 0 8px 16px rgba(183, 61, 61, .18);
    font-size: .78rem;
    font-weight: 700;
}

/* =========================
   OPERATION CARDS
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .operation-card {
    min-height: 250px;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-heading {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 13px;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-heading h6 {
    color: var(--luxury-ink);
    font-weight: 600;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-heading .mud-typography-caption {
    color: #8b9791;
    letter-spacing: .06em;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-icon {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.dashboard-shell[b-a77a3yhxsm]  .operation-icon.green {
    color: #0b6d50;
    background: linear-gradient(145deg, #eaf7f1, #d9eee5);
}

.dashboard-shell[b-a77a3yhxsm]  .operation-icon.amber {
    color: #9c6b17;
    background: linear-gradient(145deg, #fff5df, #f6e7c4);
}

.dashboard-shell[b-a77a3yhxsm]  .operation-icon.blue {
    color: #236d9f;
    background: linear-gradient(145deg, #eef7fd, #dcecf7);
}

.dashboard-shell[b-a77a3yhxsm]  .operation-stat {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin: 26px 0 18px;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-stat strong {
    color: var(--luxury-ink);
    font-size: 2.35rem;
    font-weight: 700;
    letter-spacing: -.035em;
}

.dashboard-shell[b-a77a3yhxsm]  .operation-stat span {
    color: var(--luxury-muted);
}

.dashboard-shell[b-a77a3yhxsm]  .operation-footer {
    display: flex;
    justify-content: space-between;
    margin-top: 9px;
    color: var(--luxury-muted);
    font-size: .73rem;
}

.dashboard-shell[b-a77a3yhxsm]  .luxury-action-button {
    position: relative;
    z-index: 2;
    min-height: 46px;
    border-radius: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
    box-shadow: 0 11px 24px rgba(8, 49, 38, .10);
}

.dashboard-shell[b-a77a3yhxsm]  .gold-action {
    color: #fff !important;
    background: linear-gradient(135deg, #c9a35c, #9e762f) !important;
}

.dashboard-shell[b-a77a3yhxsm]  .blue-action {
    color: #fff !important;
    background: linear-gradient(135deg, #4c93c2, #276a98) !important;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-progress-linear {
    overflow: hidden;
    border-radius: 999px;
    background: #e9efec;
}

/* =========================
   MUD CONTROLS
   ========================= */

.dashboard-shell[b-a77a3yhxsm]  .mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol {
    color: #66776f;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-input-outlined-border {
    border-color: rgba(11, 91, 69, .16);
    border-radius: 14px;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-input-root {
    color: #21322b;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-button-root {
    text-transform: none;
}

.dashboard-shell[b-a77a3yhxsm]  .mud-icon-button {
    transition: all .2s ease;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width: 1199px) {
    .dashboard-shell[b-a77a3yhxsm]  .hero-panel {
        padding: 34px 32px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-title {
        font-size: 2.25rem !important;
    }
}

@media (max-width: 959px) {
    .dashboard-shell[b-a77a3yhxsm] {
        padding: 18px 15px 38px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-panel {
        padding: 28px 24px;
        border-radius: 26px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-control-panel {
        margin-top: 22px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-title-wrap {
        align-items: flex-start;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-title {
        font-size: 1.95rem !important;
    }
}

@media (max-width: 599px) {
    .dashboard-shell[b-a77a3yhxsm] {
        padding: 12px 10px 30px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-panel {
        min-height: auto;
        padding: 24px 18px;
        border-radius: 22px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-topline {
        align-items: flex-start;
    }

    .dashboard-shell[b-a77a3yhxsm]  .system-online {
        margin-left: 0;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-title-wrap {
        flex-direction: column;
        gap: 13px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .municipal-emblem {
        width: 58px;
        height: 58px;
        flex-basis: 58px;
        border-radius: 17px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-title {
        font-size: 1.55rem !important;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-subtitle {
        font-size: .88rem !important;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-meta {
        gap: 7px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-meta span {
        width: 100%;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-control-panel {
        padding: 15px;
        border-radius: 19px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-actions {
        align-items: stretch;
    }

    .dashboard-shell[b-a77a3yhxsm]  .premium-date {
        width: auto;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats {
        gap: 6px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats span {
        font-size: .58rem;
    }

    .dashboard-shell[b-a77a3yhxsm]  .hero-mini-stats strong {
        font-size: 1.05rem;
    }

    .dashboard-shell[b-a77a3yhxsm]  .section-header {
        flex-direction: column;
    }

    .dashboard-shell[b-a77a3yhxsm]  .status-filter {
        width: 100%;
    }

    .dashboard-shell[b-a77a3yhxsm]  .premium-card {
        padding: 19px;
        border-radius: 21px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .kpi-card {
        min-height: 158px;
        padding: 19px;
    }

    .dashboard-shell[b-a77a3yhxsm]  .module-count {
        display: none;
    }

    .dashboard-shell[b-a77a3yhxsm]  .module-card {
        min-height: 104px;
    }
}
/* /Components/Pages/EmptyState.razor.rz.scp.css */
.empty-state-box[b-fpe4nte7ul] {
    display: flex;
    min-height: 220px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    color: #81918a;
    text-align: center;
}

.empty-state-icon[b-fpe4nte7ul] {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    margin-bottom: 4px;
    border: 1px solid rgba(7, 88, 67, .10);
    border-radius: 20px;
    color: var(--theme-primary);
    background: linear-gradient(145deg, #eef8f3, #ffffff);
    box-shadow: 0 12px 28px rgba(5, 62, 46, .07);
}

.empty-state-box strong[b-fpe4nte7ul] {
    color: color-mix(in srgb, var(--theme-ink) 78%, white);
    font-size: .82rem;
    font-weight: 650;
}

.empty-state-box small[b-fpe4nte7ul] {
    color: var(--theme-muted);
    font-size: .64rem;
}
/* /Components/Pages/Home.razor.rz.scp.css */
.welcome-banner-backdrop[b-nuijb8t1e0] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(18px, 4vw, 48px);
    background:
        radial-gradient(circle at top left, rgba(30, 136, 229, 0.22), transparent 34%),
        rgba(8, 18, 32, 0.72);
    backdrop-filter: blur(10px);
    animation: bannerBackdropFade-b-nuijb8t1e0 180ms ease-out;
}

.welcome-banner-modal[b-nuijb8t1e0] {
    position: relative;
    width: min(100%, 920px);
    max-height: min(86vh, 720px);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 26px 80px rgba(4, 13, 27, 0.38);
    animation: bannerModalEnter-b-nuijb8t1e0 220ms ease-out;
}

.welcome-banner-image[b-nuijb8t1e0] {
    display: block;
    width: 100%;
    max-height: min(86vh, 720px);
    object-fit: contain;
    background: #ffffff;
}

.welcome-banner-close[b-nuijb8t1e0] {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 50%;
    color: #ffffff;
    background: rgba(15, 23, 42, 0.72);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.26);
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.welcome-banner-close:hover[b-nuijb8t1e0],
.welcome-banner-close:focus-visible[b-nuijb8t1e0] {
    transform: translateY(-1px);
    background: rgba(15, 23, 42, 0.9);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.32);
    outline: none;
}

.welcome-banner-close span[b-nuijb8t1e0] {
    display: block;
    margin-top: -3px;
}

@keyframes bannerBackdropFade-b-nuijb8t1e0 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes bannerModalEnter-b-nuijb8t1e0 {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 640px) {
    .welcome-banner-backdrop[b-nuijb8t1e0] {
        align-items: flex-start;
        padding: 72px 14px 18px;
    }

    .welcome-banner-close[b-nuijb8t1e0] {
        top: 10px;
        right: 10px;
        width: 38px;
        height: 38px;
        font-size: 28px;
    }
}